ASP.NET Core 5 and Angular

Full-stack web development with .NET 5 and Angular 11, 4th Edition

Valerio De Sanctis

• Publisher: Packt Publishing
• Year: 2021
• eBook ISBN: 9781800562219
• Edition: 4
• Topic: Computer Science
• Subtopic: Microsoft Programming
• Index: Computer Science

Build robust modern web applications using.NET 5, Entity Framework Core, and Angular 11

Key Features

• Updated with the latest features and additions in ASP.NET Core 5 and Angular 11
• Design, build, and deploy a Single Page Application or Progressive Web App
• Adopt a full stack approach to handle data management, Web APIs, application design, testing, SEO, security, and deployment

Book Description

Learning full-stack development calls for knowledge of both front-end and back-end web development. ASP.NET Core 5 and Angular, Fourth Edition will enhance your ability to create, debug, and deploy efficient web applications using ASP.NET Core and Angular. This revised edition includes coverage of the Angular routing module, expanded discussion on the Angular CLI, and detailed instructions for deploying apps on Azure, as well as both Windows and Linux.

Taking care to explain and challenge design choices made throughout the text, Valerio teaches you how to build 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 5) and Jasmine, as well as Karma for Angular. After adding authentication and authorization to your apps, you will explore progressive web applications (PWAs), learning about their technical requirements, testing, and converting SWAs to PWAs.

By the end of this book, you will understand how to tie together the front end and back end to build and deploy secure and robust web applications.

What you will learn

• Implement a web API interface with ASP.NET Core and consume it with Angular using RxJS observables
• Set up an SQL database server using a local instance or a cloud data store
• Perform C# and TypeScript debugging using Visual Studio 2019
• Create TDD and BDD unit tests using xUnit, Jasmine, and Karma
• Perform DBMS structured logging using third-party providers such as SeriLog
• Deploy web apps to Windows and Linux web servers, or Azure App Service, using IIS, Kestrel, and nginx

Who this book is for

This book is for experienced ASP.NET developers who already possess some familiarity with ASP.NET Core and Angular and are looking to learn how to use them effectively together.

The fully documented code samples (also available on GitHub) and the step-by-step implementation tutorials make this book easy to follow.

6

Forms and Data Validation

In this chapter, we'll mostly deal with forms, data input, and validation techniques. As we already know, HTML forms are one of the most important and delicate aspects of any business application. Nowadays, forms are used to fulfill almost any task involving user-submitted data, such as registering or logging in to a website, issuing a payment, reserving a hotel room, ordering a product, performing and retrieving search results, and more.

If we were asked to define a form from a developer's perspective, we would come out with the statement that a form is a UI-based interface that allows authorized users to enter data that will be sent to a server for processing. The moment we accept this definition, two additional considerations should come to mind:

• Each form should provide a data entry experience good enough to efficiently guide our users through the expected workflow; otherwise, they won't be able to use it properly.
• Each form, as long as it brings potentially insecure data to the server, could have a major security impact in terms of data integrity, data security, and system security, unless the developer possesses the required know-how to adopt and implement the appropriate countermeasures.

These two considerations provide a good summary of what we'll do in this chapter: we'll do our best to guide our users into submitting data in the most appropriate way, and we'll also learn how to check these input values properly to prevent, avoid, and/or minimize a wide spectrum of integrity and security threats. It's also important to understand that these two considerations are frequently intertwined with each other; hence, we'll often deal with them at the same time.

In this chapter, we'll cover the following topics:

• Angular forms, where we'll deal with Template-Driven Forms as well as Reactive Forms, all while understanding the pros and cons of both approaches and looking at which is the most suitable to use in various common scenarios.
• Data validation, where we'll learn how to double-check our users' input data in the front-end and also from the back-end, as well as the various techniques to give visual feedback when they send incorrect or invalid values.
• Form builder, where we'll implement another Reactive Form using some factory methods instead of manually instantiating the various form model elements.

At the end of each task, we'll also take some time to verify the result of our work using our web browser.

Technical requirements

In this chapter, we're going to need all the technical requirements that we mentioned in the previous chapters, with no additional resources, libraries, or packages.

The code files for this chapter can be found at: https://github.com/PacktPublishing/ASP.NET-Core-5-and-Angular/tree/main/Chapter_06

Exploring Angular forms

If we take a look at our current .NET Core with Angular projects, we will see how none of them allow our users to interact with the data:

• For the HealthCheck app, this is expected since there's simply no data to deal with: this is a monitor app that doesn't store anything and requires no input from the user.
• The WorldCities app, howeve...

Table of contents

• Preface
• Getting Ready
• Looking Around
• Front-End and Back-End Interactions
• Data Model with Entity Framework Core
• Fetching and Displaying Data
• Forms and Data Validation
• Code Tweaks and Data Services
• Back-End and Front-End Debugging
• ASP.NET Core and Angular Unit Testing
• Authentication and Authorization
• Progressive Web Apps
• Windows, Linux, and Azure Deployment
• Other Books You May Enjoy
• Index