This book is a practical guide that will help you create modern-day apps with the use of Bootstrap 4, a powerful JavaScript library. It starts off with an introduction to Bootstrap, where we learn about some of the differences coming into Bootstrap 4 that didn't exist in Bootstrap 3. We will also be covering the new features that Bootstrap 4 offers. So, let's start with the sites that we have: we've got a photo-sharing site; this is going to use a lightbox and it's also our first introduction to using Bootstrap 4. Now, Bootstrap has a strict grid column setup where you have 12 columns, but you can divide them up in any way you like. We're also going to look at how you can even go outside the 12, which is a limit for Bootstrap. For example, you have added two columns of span 5 and 10 respectively; basically, when you sum up they're going out of the 12, but things still kind of work out mostly in the same way. So, depending on the complexity of your website, you miss and you go over the 12, we're still going to see things work out pretty much fine.

Next, we have our resume site, which gets a little more complex because of the layout. We're going to use multiple rows, and we're going to have our columns deal with the different kinds of icons. Later on, we will check out Font Awesome, which is really going to come into play when we start getting into some of the more complex websites, because we're not actually using icon images, we're using Font Awesome instead, which acts as a font but really gives us icons. We'll look at a social networking website, where we're going to learn what cards are all about. We're going to look at how to create bubble-style comments, and some other different kinds of more complex layout features to get a particular kind of look to your page. Next is the agency website—a very clean, very nice-looking website. It's going to make heavy use of Font Awesome and some of the different icons that are available to us. Then we'll look at another photo site that we're going to integrate with a different lightbox that doesn't require JavaScript.

There is a lot going on. We're going to go through a great introduction and get some hands-on practice with Bootstrap 4, so let's jump into it.