In this chapter, we explored NG Bootstrap—the first of the two third-party component libraries that are freely available to us for use in our Angular applications. We'll be exploring the second one, Angular Material, in the next chapter.

We took a look at how to install NGB, and then we created a playground within our application so we can have a place to play (that is, experiment) with these third-party components—including temporarily wiring the playground up to our menu via routing for easy navigational access to our playground. While we could have created a separate project altogether for playing around with components before integrating them into our application for their intended purposes, it is usually more convenient to create a playground within our existing infrastructure. Of course, when the comes for us to deploy our application, we can easily remove the playground and the menu option with its accompanying route.

With our playground all set up, we then dove in and took a look at how to integrate three of NGB's widgets: collapse, modal, and carousel.

Finally, to wrap the chapter up, since we're in the component and layout part of the book (as opposed to the backend data integration and services part of the book), it was a good time to cover a few design principle as well. So, we briefly covered three of the top tenants of good design: keeping it clean, functional, and obvious. We'll be adhering to these design principle as best we can throughout the remainder of the book. 

Now then, keep your component hat firmly on your head, turn the page, and let's take a look at the gorgeously designed components that the Angular team cooked up for our use. Leveraging the Angular Material components in the right proportions and places will help boost our example application's usability and aesthetics. And fortunately, Angular Material plays nicely with Bootstrap, so there's no problem with having both libraries in the same Angular project.