Chapter 8Design Great UIs with Bootstrap’s Grid and Components

At the start of Chapter 7, Create a Single-Page App Using Angular’s Router, we saw a mock-up of the customer detail view. We’re going to build this page now to learn about the true power of Bootstrap—its grid. We’ll also examine some of Bootstrap’s many components, which will allow us to create a polished and visually appealing user interface.

We’ll tackle this topic in three parts. First, I’ll provide some background on grid-based design. This will help you understand why Bootstrap is based on a grid, and how you can break down any UI into grids, to make your work easier. Next, you’ll lay out the customer detail screen I hinted at in the previous chapter, using Bootstrap’s ...

Get Rails, Angular, Postgres, and Bootstrap now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.