Responsive Design in Bootstrap: Create a Blog Homepage

In this 2-hour project, you will gain the skills to design and build responsive web pages using Bootstrap's grid system by mastering the process of translating design requirements and mockups into functional and visually appealing layouts. By the end of this project, you will be able to create web pages that adapt seamlessly to various devices and screen sizes.The skills taught in this intermediate-level project will help web developers and designers in a wide range of real-world scenarios such as designing websites for magazines, news, and similar types of content.Throughout this project, you will apply bootstrap techniques to build a responsive blog home page using Bootstrap by effectively analyzing design requirements and mockups and utilizing Bootstrap's grid system to construct responsive layouts, and adapt page layouts to different screen sizes and devices. To succeed in this project, you need to be familiar with HTML5 page structure and core components (div, buttons, etc.). Some CSS3 knowledge could be helpful, but it is not required.Learn step-by-stepIn a video that plays in a split-screen with your work area, your instructor will walk you through these steps:•Task 1: Implement page layout using containers•Task 2: Apply responsive layout with the grid system•Practice activity 1: Create a basic layout for a news website.•Task 3: Create the inner layouts for the main section•Task 4: Create the main content of the page•Practice activity 2: Create a layout and content for a news stories•Task 5: Create the content for recent posts and widgets•Cumulative activity: Create a blog post pageRecommended experienceRequired: HTML5 page structure and core components (div, buttons, etc.)Optional: CSS3 (i.e coloring divs and text) is helpful but not required