Angular Project Initialization Flow

Tip

Memorizations Techniques: in an ma'am (index, angular.json, main.ts, AppModule.ts)

  1. When an Angular project runs, it first loads index.html, which contains the <app-root></app-root> tag. This tag is used to locate the root component of the application.
  2. Next, it moves to angular.json and looks for the "browser": "src/main.ts" entry, then proceeds to main.ts.
  3. In main.ts, the project bootstraps with AppModule, which is decorated with @NgModule. In app.module.ts, we can see various declarations and configurations within the NgModule.
  4. Finally, the application initializes based on these modules and configurations.