In most cases, you aren't going to write every UI component from scratch. There are many libraries that can save you time and allow you to focus on what matters most—the business logic of your application.

There are many component libraries out there. Among the most popular are the following:

• Angular Material, by Google (https://material.angular.io/)
• PrimeNG, by PrimeTek (https://www.primefaces.org/primeng/#/)

In this section, we are going to use Angular Material by Google, but you can always experiment with additional component libraries later on.

Installing Angular Material into your project is effortless. The ng add command is supported by the Angular CLI and is provided by Angular Material, which makes the process straightforward. Let's learn how to install it:

1. Run the following command:

      ng add @angular/material

2. For our current experiment, select the Indigo/Pink theme if the Angular CLI asks about prebuilt themes:

      Q: Choose a prebuilt theme name, or "custom" for a custom theme:
      A: Indigo/Pink

3. I also suggest enabling HammerJS support for gestures, as well as the browser animations module:

      Q: Set up HammerJS for gesture recognition?
      A: Y

      Q: Set up browser animations for Angular Material?
      A: Y

4. Once you've answered all the questions, the Angular CLI will install the corresponding dependencies and even modify a few files to integrate the library with your project:

      UPDATE src/main.ts (391 bytes)
      UPDATE src/app/app.module.ts (502 bytes)
      UPDATE angular.json (4158 bytes)
      UPDATE src/index.html (522 bytes)
      UPDATE src/styles.scss (181 bytes)

You can take a look at the files the Angular CLI generated for you and check out their content if you wish. In the next section, we are going to discuss the project's structure and the modifications that the Angular CLI makes now that we've installed Angular Material.