From the course: Building Angular and ASP.NET Core Applications

Angular architectural overview

From the course: Building Angular and ASP.NET Core Applications

Start my 1-month free trial

Angular architectural overview

“

- [Narrator] We have already mentioned that the .NET new Angular command created both a web API and an Angular project. So let's go to visual code and see which are the default Angular files that were created. In our solution you can see the client app folder and the all the Angular related code goes in here. Here we have three main folders. The e2e which is used for unit testing related code. We have the node modules where we have all the libraries that we need to use to run our Angular app. And the most important folder in here is the source folder where all the code goes in. Inside the source folder we have the app folder, the assets and the environments. Inside the app we define the modules. Inside the app we have all components like counter, fetch data et cetera. Other than that we have the app.component.html which is know as the entry component file in Angular applications. If we open this file we're going to see in here that we have defined the menu and the body of our application. Then next we have the app.module.ts file and this is know as the configuration file in Angular projects. Because inside here we define all the components that we want to use, we define all the modules that we want to use and also the router for our Angular app. Then next we have the asset folder. This folder is used to generally keep the static files like for example the icon, images, documents et cetera. And inside the environments we have the two environment files like the production environment and the development environment where we define all the specific information that we want to use for each environments. Next we have the index.html which is the file where we define the route component where in this case we have defined the app-route. And then if you scroll down you will see the angular.json file where we define the Angular related configurations like for example where do we get the styles from? Which is the assets folder? Et cetera. Then next we have the package.json file where we define scripts like for example the script to build the Angular app which is the ng build, the script to run the test and even the dependencies like Angular animations, common, compiler et cetera.

Contents