Looking Around
Now that our project has been created, it's time to take a quick look around and try to understand some of the hard work that the .NET and Angular SPA template has done to make it work.
...Hey, wait a minute! Shouldn't we skip all these setup technicalities and just jump into coding?
As a matter of fact, yes, we'll definitely be doing that in a little while. However, before doing that, it's wise to highlight a couple of aspects of the code that have been put in place already so that we'll know how to move effectively within our project in advance: where to find the server-side and client-side code, where to put new content, how to change our initialization parameters, and so on. It will also be a good chance to review our basic knowledge of the Visual Studio environment and the packages we will need.
That's precisely what we're going to do in this chapter. More precisely, the following are the main topics we're going to cover:
- Solution overview: A high-level summary of what we'll be dealing with
- The ASP.NET back-end: Razor Pages, controllers, configuration files, and so on
- The Angular front-end: The workspace, the
ClientApp
folder, the Angular initialization cycle, and so on - Creating a new app with the Angular CLI: Installation, creation, and testing
- Getting to work: Caching concepts, removing some .NET controllers and Angular components that we no longer require, and so on
IMPORTANT! The sample code we're reviewing here is the code that comes with the default Angular SPA Visual Studio template shipped by .NET 5 SDK at the time of writing—the one created with the dotnet new angular
command. In the (likely) event that this sample code is updated in future releases, ensure you get the former source code from the web using this book's official GitHub repository and use it to replace the contents of your project folder.
Caution: failing to do this could result in you working with different sample code from the code featured in this book.