Routes and navigation

Let’s improve our project by creating a home page with a simplified menu for our interface, thereby exploring the possibilities we can have with Angular routes. In the command line, we’ll use the Angular CLI to create a new module and the component page:

ng g m home --routing

In the preceding snippet, we first create a new module, and by using the --routing parameter, we instruct the Angular CLI to create the module along with the routing file. The following command creates the component we are working on:

ng g c home

For more details about the Angular CLI and modules, you can refer to Chapter 2, Organizing Your Application.

First, let’s create the template in the HTML file of the component we just created:

<div class="flex h-screen">
  <aside class="w-1/6 bg-blue-500 text-white">
    <nav class="mt-8">
      <ul class...