feat: implement routing with NoTaskComponent and update app structure

Author: aimxnaim

14-routing/01-starting-project/src/app/app.component.html

@@ -4,6 +4,6 @@
   <app-users />
 
   <div>
-    <p>Todo ...</p>
+    <router-outlet></router-outlet>
   </div>
 </main>

14-routing/01-starting-project/src/app/app.component.ts

@@ -2,12 +2,13 @@ import { Component } from '@angular/core';
 
 import { HeaderComponent } from './header/header.component';
 import { UsersComponent } from './users/users.component';
+import { RouterOutlet } from '@angular/router';
 
 @Component({
   selector: 'app-root',
   standalone: true,
   templateUrl: './app.component.html',
   styleUrl: './app.component.css',
-  imports: [HeaderComponent, UsersComponent],
+  imports: [HeaderComponent, UsersComponent, RouterOutlet],
 })
 export class AppComponent {}

14-routing/01-starting-project/src/app/app.routes.ts

@@ -1,7 +1,12 @@
 import { Routes } from "@angular/router";
 import { TaskComponent } from "./tasks/task/task.component";
+import { NoTaskComponent } from "./tasks/no-task/no-task.component";
 
 export const routes: Routes = [
+    {
+        path: '',
+        component: NoTaskComponent
+    },
     {
         path: 'tasks',
         component: TaskComponent