5 minute guide to build an Angular app with Material… in 2019

Say, why do some people think Angular is a deep, dark, complicated framework? And that it is hard to use?

In this guide, we’ll take 5 minutes to show that Angular is a simple framework that anyone can get started with.

I’ll begin by assuming that you’ve already installed Node.js.

Step 1: Install the Angular CLI.

Installing Angular CLI

Step 2: Create initial application

You’ll be asked if you want to add Angular routing. Select No.

You’ll also be asked what type of stylesheet format you want to use. Select the default by typing Enter.

Creating Angular application with CLI

Step 3: Serve the Angular App

Now that the Angular CLI has created your Angular application run the following commands.

This process will build and launch the application. If successful, your browser should open a page like this.

Angular “Hello World” application

Now that we’ve got our Angular application launched and running, the next step is to install Angular Material.

Open a terminal inside of your Angular applications root directory and run the following command.

You’ll be asked to choose a theme of your choice. Select any theme that you like with your arrow keys and then hit Enter.

Next you’ll be asked if you want to set up HammerJS for gesture recognition. Select Yes.

And finally, you’ll be asked if you want to set up browser animations for Angular Material. Select Yes.

The Material components are now installed and ready to use.

Install Angular Material with Angular CLI

If your application is running it should automatically reload. You’ll notice that the font has changed.

Now that you’ve installed Angular Material let’s add a Toolbar to our application.

Open your new Angular project in your favorite code editor. (I use Visual Studio Code.)

Step 1: Import Toolbar Module

We’ll begin by opening the file located at and at the top of the file we’ll add the following line of code to import the .

And then add it to our imports array.

Step 2. Edit

Next we’ll want to replace all the boiler-plate code from with the snippet below.

Your application should now look like this.

Angular “Hello World” with Material Toolbar

Well… ya done done it!

Now you know how to create an Angular application, install Angular Material and use a basic Material component.

Please click that 👏 button. Thank-you.

Follow me on Medium for articles about Angular and feel free to check out some other short, helpful posts.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store