Building a simple page with the default grid

In this recipe, we will build a simple, well-rounded page to demonstrate how easy it is to work with Bootstrap 4 to create layouts. It is assumed that you are using Cloud9 IDE, but you can follow this recipe in any environment. At the end of the recipe, you should have a fully customized modular page.

Getting ready

To get started quickly, refer to the code provided with the book (folder: chapter02-07).

For basic information on how layouts work in Bootstrap 4, check out http://v4-alpha.getbootstrap.com/layout/overview/.

How to do it...

1. In workspace/app/index.ejs, change the code to look like this:

      <!--
       <div class="container">

       <div class="starter-template">
       <h1>Bootstrap 4 Grid Recipe</h1>
       <p class="lead">Use this document as a way to quickly start any  
       new project.<br> All you get is this text and a mostly barebones  
       HTML document.</p>
       </div>...