O'Reilly logo

Bootstrap 4 Site Blueprints by Ian Whitley, David Cochran, Bass Jobsen

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Using the build process to finish your project

At the start of this chapter, I have shown you a screenshot of a responsive mobile-first one-page marketing site built with Bootstrap. In the rest of the chapter, I will guide you to build this site using the Gulp build process you have created in the preceding sections.

You will have to split up the HTML page into different parts in accordance with the HTML template structure you have already created.

The project will have a single breakpoint at 768 pixels. For viewports wider than 768 pixels, the navigation menu will become horizontal and other adoptions are made.

The layout template

As already mentioned, you'll use Panini to modularize your HTML code. Panini helps you to avoid code duplications in ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required