Different part of Angular 6 application

•      e2e:- Contains end-to-end tests and their configuration files.

Ø src:- As the name implies, this folder contains all our angular project source code. Components, templates, pipes, services, images, styles etc that our angular application needs are present in this folder. The rest of the files and folders that are present outside this folder, are there to support building our angular application

1 app.e2e-spec.ts:-

2 app.po.ts:-

3 protractor.conf.js:- Protractor is an end-to-end test framework for Angular applications. As the name implies, protractor.conf.js is the configuration file for Protractor.

4 tsconfig.e2e.json:-

•     node_modules:- The packages specified in package.json file are installed into this folder when we run npm install command
• 
  
•     src:- Root directory of the application

Ø app:- The selector prefix to apply for the generated components. The default is "app". This can be changed by using the "prefix" option when generating a new angular project using the "ng new" command

1 app-routing.module.ts:- The routing component 

2 app.component.html:- The root component 

3 app.component.spec.ts:- The root component 

4 app.component.ts:- The root component (AppComponent) TypeScript, HTML template, StyleSheet and Spec files

5 app.module.ts:- This is the root application module (AppModule)

Ø assets:- List of application assets that you want to copy when building your project. As the name implies, the assets folder contains the assets of your application like images and anything else to be copied when you build your application

1 gitkeep:-

Ø environments:- This folder contains the environment files. By default, we have 2 environment files. environment.ts is for the development environment. Notice production property in this file is set to false. environment.prod.ts is for production. Notice in this file production property is set to true as expected. The build system defaults to the dev environment which uses `environment.ts`, but if we do a production build environment.prod.ts will be used. The file and environment mapping is in Angular CLI configuration file (.angular.json)

1 environment.prod.ts:-

2 environment.ts:-

Ø browserslist:-

Ø favicon.ico:- This is the favorite icon for your application which is typically displayed in the browser address bar and next to the page name in a list of bookmarks. Angular CLI provides this favorite icon out of the box. You may replace this favicon with your own company favicon

Ø index.html:- The name of the start HTML file which is index.html by default. The main HTML page that is served when someone visits your site

Ø karma.conf.js:- Karma is the unit test runner for angular applications. As the name implies, karma.conf.js is the configuration file for Karma.

Ø main.ts:- The name of the main entry-point file. main.ts by default. This file contains the code to bootstrap the application root module (AppModule)

Ø polyfills.ts:-The name of the polyfills file. Angular is built on the latest standards of the web platform. Targeting such a wide range of browsers is challenging because not all browsers support all features of modern browsers. This can be compensated by using polyfill scripts that implement missing features in JavaScript

Ø styles.css:- Global styles to be included in the build. The default is styles.css. We can also use less or scss. To change to less or scss, use the "style" option when generating a new angular project using the "ng new" command

Ø test.ts:- This file is the main entry point for unit tests and loads all the .spec and framework files

Ø tsconfig.app.json:- TypeScript compiler configuration for the Angular app

Ø tsconfig.spec.json:- TypeScript compiler configuration for the unit tests

Ø tslint.json:- Angular has a linting tool that checks our TypeScript code for programmatic and stylistic errors as well as non-adherence to coding standards and conventions. tslint.json is the configuration file for linting. 

•     .editorconfig:- Configuration file for Visual Studio Code. The settings in this file let you set certain code style guidelines. For example what indent_style do you want - spaces or tabs and what should be the indent size etc? You can share this editorconfig file with other developers to maintain consistent coding styles.
• 
  
•     .gitignore:- This file is used to determine files and folders you don't want to check in to source control. For example one of the folders we do not want to check in to source control is /dist folder which is auto-generated when we build the application. So this folder is listed in this file. So, all the files and folders listed in this file are ignored, when a changeset is checked in to source control.
• 
  
•     {} angular.json:-Angular CLI configuration file
• 
  
•     {} package-lock.json:-
• 
  
•     {} package.json:- This file contains the packages to build and run our application. It contains two sets of packages, dependencies, and devDependencies. The dependencies are essential for running the application. The devDependencies are only required to develop the application. These packages are installed into the node_modules folder by the Node Package Manager (npm), when npm install command is executed. You can also add your own custom scripts here. 
  
  "scripts" property in package.json file contains the useful npm commands. Notice we have "start": "ng serve". This means when we execute npm start it executes ng serve which builds and starts the server. In addition, if you also want to launch the browser and open the application 
  CHANGE "start": "ng serve" TO "start": "ng serve --open"
• 
  
•     {} README.md:- This is a README file which contains the commonly used Angular CLI commands out of the box. You may enhance it with your own project documentation so that anyone checking out the repo knows the commands to use to build, run and test your app.
• 
  
•     {} tsconfig.json:- This is the TypeScript compiler configuration file. This file has several TypeScript compiler configuration settings. For example, to compile TypeScript to JavaScript on saving a TypeScript file set compileOnSave setting to true. If you do not want .map files to be generated, set sourceMap to false. .map files are used for debugging your application.
• 
  
•     {} tslint.json:- Angular has a linting tool that checks our TypeScript code for programmatic and stylistic errors as well as non-adherence to coding standards and conventions. tslint.json is the configuration file for linting.