How Angular Applications are Boot strapped

 How Angular application is Bootstrapped?

Angular applications are single-page applications. Only one HTML file will be available. only the components will be replaced whenever navigate to different pages.

1. Angular application's startup file is mentioned in angular.json as below
2. "architect": {

           "build": {

             "builder": "@angular-devkit/build-angular:browser",

             "options": {

               "outputPath": "dist/Angular-fundamentals",

               "index": "src/index.html",

               "main": "src/main.ts",

               "polyfills": "src/polyfills.ts",

               "tsConfig": "tsconfig.app.json",

               "aot": true,

               "assets": [

                 "src/favicon.ico",

                 "src/assets"

               ],
3. Module to be loaded will be mentioned in Main.ts as below

platformBrowserDynamic().bootstrapModule(EventAppModule)

  .catch(err => console.error(err));

Component to be loaded first will be mentioned in Module as below

 bootstrap: [EventsAppComponent]

Every component will have selector which will be used as an HTML tag in index.html

Also, it has content to be loaded for the component in template/templateUrl. the style also can be mentioned

Note: AppModule name can be changed to anything. Whichever module is mentioned in Main.ts will be the start-up module