In this article I am going to discuss all you need to know about Angular routing when you develop single page application. So you can study how to route among components and how to route among modules

Angular has built-in routing library you can use to develop single page application. Angular routing comes with the package @angular/router

I am going to use simple example project which can be used to manage products. Product grid will display the list of products and when you click on the product SKU you can see the single product details

You will have following URL structure

http://localhost:4200/products
This URL will display the list of products fetching from the REST API
http://localhost:4200/products/20
This URL will display the single product where product_id=20

Objectives

You can cover the following objectives when you compete reading this tutorial

1. Understand how to create Single Page Application
2. How to consume REST API with Angular
3. Angular routing

Steps to follow

Now you can follow the following steps to build simple application and understand the routing

1. Create new Angular Project

Create new Angular Project

You can use the Angular CLI to create new project.