It’s worth dedicating a little bit of time to outline the important files and folders that you will commonly work in — and also understand some of the under-the-hood stuff that makes Angular work.

The folder and file structure looks like this in an Angular project:

project-name/
├── e2e/
│   ├── src/
│   └── protractor.conf.js
├── node_modules/
├── src/
│   ├── app/
│   ├── assets/
│   ├── environments/
│   ├── index.html
│   ├── main.ts
│   ├── polyfills.ts
│   ├── styles.scss
│   └── test.ts
├── .angular.json
├── package.json
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.spec.json
└── tslint.json

• The e2e folder contains an end-to-end testing setup using Protractor.
• The node_modules folder contains all the installed dependencies for the project.
• The src folder contains the source code for the Angular application, including the app folder for components, assets folder for static files, environments folder for environment-specific configurations, index.html as the root HTML file, main.ts as the entry point for the application, polyfills.ts for polyfills, styles.scss for global styles, and test.ts for test setup.
• The .angular.json file contains configuration options for the Angular CLI.
• The package.json file contains metadata about the project, as well as the list of dependencies and scripts to run.
• The tsconfig.app.json file is a TypeScript configuration file for the Angular application.
• The tsconfig.json file is the base TypeScript configuration file for the project.
• The tsconfig.spec.json file is a TypeScript configuration file for the project’s tests.
• The tslint.json file contains the configuration for the linter used in the project.