Book Image

ASP.NET Core 6 and Angular - Fifth Edition

By : Valerio De Sanctis
Book Image

ASP.NET Core 6 and Angular - Fifth Edition

By: Valerio De Sanctis

Overview of this book

Every full-stack ninja needs the tools to operate on front-end and back-end application development. This web app development book takes a hands-on, project-based approach to provide you with all the tools and techniques that web developers need to create, debug, and deploy efficient web applications using ASP.NET Core and Angular. The fifth edition has been updated to cover advanced topics such as Minimal APIs, Web APIs with GraphQL, real-time updates with SignalR, and new features in .NET 6 and Angular 13. You begin by building a data model with Entity Framework Core, alongside utilizing the Entity Core Fluent API and EntityTypeConfiguration class. You'll learn how to fetch and display data and handle user input with Angular reactive forms and front-end and back-end validators for maximum effect. Later, you will perform advanced debugging and explore the unit testing features provided by xUnit.net (.NET 6) and Jasmine, as well as Karma for Angular. After adding authentication and authorization to your apps, you will explore progressive web applications, learning about their technical requirements, testing processes, and how to convert a standard web application to a PWA. By the end of this web development book, you will understand how to tie together the front-end and back-end to build and deploy secure and robust web applications.
Table of Contents (18 chapters)
16
Other Books You May Enjoy
17
Index

To get the most out of this book

These are the software packages (and relevant version numbers) used to write this book and test the source code:

  • Visual Studio 2022 Community Edition 17.0.4 with the optional ASP.NET and web development workload (it can be selected from the Workloads section within the Visual Studio installer app)
  • Microsoft .NET 6 SDK 6.0.101
  • TypeScript 4.3
  • NuGet package manager 6.0
  • Node.js 14.15.0 (we strongly suggest installing it using Node Version Manager, also known as nvm)
  • Angular 13.0.1

For deployment on Windows:

  • Internet Information Services (IIS) (Windows Server)
  • ASP.NET Core Runtime 5 and Windows Hosting Bundle Installer for Win64 (ASP.NET official website)

For deployment on Linux:

  • ASP.NET Core Runtime 5 for Linux (YUM package manager)
  • .NET 5 CLR for Linux (YUM package manager)
  • Nginx HTTP Server (YUM package manager)

Download the example code files

The code bundle for the book is hosted on GitHub at https://github.com/PacktPublishing/ASP.NET-Core-6-and-Angular. We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out!

Download the color images

We also provide a PDF file that has color images of the screenshots/diagrams used in this book. You can download it here: https://static.packt-cdn.com/downloads/9781803239705_ColorImages.pdf.

Conventions used

There are a number of text conventions used throughout this book:

CodeInText: Indicates code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles. For example: “Navigate to the /ClientApp/src/app/cities folder.”

A block of code is set as follows:

<mat-form-field [hidden]="!cities">
<input matInput (keyup)="loadData($event.target.value)"
placeholder="Filter by name (or part of it)...">
</mat-form-field>

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are highlighted:

import { FormGroup, FormControl } from '@angular/forms';
class ModelFormComponent implements OnInit {
    form: FormGroup;
    ngOnInit() {
        this.form = new FormGroup({
            title: new FormControl()
        });
    }
}

Any command-line input or output is written as follows:

> dotnet new angular -o HealthCheck

Bold: Indicates a new term, an important word, or words that you see on screen. For example, words in menus or dialog boxes appear in the text like this. Here is an example: “A simple Add a new City button will fix both these issues at once.”

Warnings or important notes appear like this.

Tips and tricks appear like this.