Web Development · WDC-74

.NET 10 Web API with Angular

.NET 10 Web API with Angular is a full-stack development course in which you build a Web API with ASP.NET Core, connect it to databases through Entity Framework Core and create the user interface with Angular and Angular Material. It suits developers with a C# foundation, and you leave able to build a full-stack data management system deployed with Docker.

Updated 9 Oct 2026

From 8,550 THB / person 9,500 −10% excl. VAT 7% · group rates available

Corporate training quote Join the waiting list

PDFDownload the course outline

Duration18 hours · 3 days
FormatOnsite / live online
Next roundOn request
CertificateIncluded

Course overview

Modern web applications usually separate the frontend from the backend: the backend exposes a Web API and the frontend is a single page application that calls it. ASP.NET Core on .NET 10 (LTS) is a robust choice for enterprise APIs and runs on Windows, macOS and Linux, while Angular 22 offers a clear structure that suits systems with many screens and several teams, with signals and standalone components as its main approach.

This course takes you through a complete full-stack web application in 3 days. You start by building a Web API with ASP.NET Core 10 and OpenAPI documentation, connect it to databases with Entity Framework Core 10 using SQL Server 2025 as the main database, and try switching to PostgreSQL and MongoDB. You then build the screens with Angular 22 and Angular Material, including routing, forms and CRUD pages that call the real API, and finish by securing the system with JWT, writing tests and deploying with Docker. (3 days, 6 hours per day, 18 hours in total, Intermediate level.)

What you’ll gain

Install the .NET 10 SDK, Node.js, the Angular CLI and databases through Docker
Build a Web API with ASP.NET Core 10, with validation and OpenAPI documentation
Use Entity Framework Core 10 code-first with SQL Server 2025
Understand how to switch to PostgreSQL or MongoDB through EF Core providers
Build screens with Angular 22: components, signals, routing and forms
Connect Angular to the Web API and build CRUD pages with Angular Material
Secure the API with JWT and call it safely from Angular
Write basic tests and deploy the whole system with Docker Compose

Who this course is for

Developers who want to build full-stack web applications with .NET and Angular
C# developers moving from classic ASP.NET to a Web API with a single page application
Frontend developers who want to understand how APIs are built on .NET
People maintaining systems on earlier .NET Core versions who want to update to .NET 10

Prerequisites

Basic C# programming, including classes, methods and collections
Basic HTML, CSS and JavaScript
Basic SQL such as SELECT, INSERT, UPDATE and DELETE
A Windows, macOS or Linux laptop with 16 GB of RAM or more, with rights to install software and Docker Desktop

Curriculum

Course Details

This course is the 2026 edition of .NET Core 8 with Angular, which originally taught .NET 8 with Angular 16. It has been rewritten for .NET 10 (LTS) and Angular 22. It runs for 3 days, 6 hours per day (18 hours in total, 09:00-16:00), as lectures with labs. Intermediate level. Day one builds a Web API with ASP.NET Core 10, with validation and OpenAPI documentation, connected to SQL Server 2025 through EF Core 10.

Day two structures the API with services and DTOs, tries PostgreSQL and MongoDB, and starts the screens with Angular 22, Angular Material and Signal Forms. Day three connects Angular to the API, builds CRUD pages, secures the system with JWT, adds tests and deploys with Docker Compose, finishing with a product management workshop. This is the condensed 3-day course; the 5-day version is .NET 10 with Angular. All tools are free on Windows, macOS and Linux.

Day 1 Getting Started with ASP.NET Core 10 Web API

Section 1: Lab: Setting Up Tools on Windows and macOS

An overview of Angular working with an ASP.NET Core Web API
Install the .NET 10 SDK, Node.js LTS and Angular CLI 22
VS Code with the C# Dev Kit and Angular extensions
Run SQL Server 2025, PostgreSQL and MongoDB with Docker Desktop
Lab: check the machine is ready and keep the project in Git

Section 2: C# 14 for Web API Work

Records, nullable reference types and pattern matching
async and await for database work
Everyday LINQ with collections
Dependency injection and interfaces in .NET
Lab: a product list console app as a warm-up before the API

Section 3: Lab: Building an ASP.NET Core 10 Web API

dotnet new webapi and the .NET 10 project structure
Program.cs, middleware and configuration per environment
Controllers versus minimal APIs, and choosing between them
Built-in OpenAPI documents, tested through Swagger UI or Scalar
Lab: a first API tested with .http files

Section 4: Lab: Controllers, Routing and Validation

Attribute routing and route parameters
HTTP methods: GET, POST, PUT and DELETE
ActionResult return types and the right status codes
Validation with data annotations and errors as ProblemDetails
Lab: a full product API with in-memory storage

Section 5: Lab: EF Core 10 with SQL Server 2025

What an ORM is, and DbContext with DbSet
Code-first, migrations and dotnet ef
A one-to-many relationship between categories and products
Async CRUD and queries with LINQ
Lab: move the product API onto SQL Server 2025

Day 2 Multiple Databases and Getting Started with Angular 22

Section 6: Lab: Service Layer, DTOs and Paging

Move business logic into services registered through DI
Send and receive data with DTOs instead of entities
Search, sort and page data
Logging and central error handling
Lab: a product API with search and paging

Section 7: Lab: EF Core with PostgreSQL and MongoDB

EF Core providers and choosing package versions that match
Switch to PostgreSQL with Npgsql and a new set of migrations
Use MongoDB through the MongoDB EF Core Provider, and how it differs from relational databases
Options for MySQL and checking which provider versions are supported
Lab: switch the API's database through connection strings and configuration

Section 8: Lab: Getting Started with Angular 22

Create a project with ng new and explore the files
Standalone components and template syntax
signal(), computed() and zoneless change detection
Control flow with @if, @for and @switch
Lab: a product list page from mock data

Section 9: Lab: Routing and Layout with Angular Material

Install Angular Material with ng add and choose a theme
Layout with a toolbar, sidenav and menus
Routes, RouterLink and lazy loading
Route parameters through component inputs
Lab: an admin layout with menus for every page

Section 10: Lab: Forms with Signal Forms

Build a form from a signal model with form()
Built-in validation and custom rules
Use Angular Material form fields with Signal Forms
Compare with Reactive Forms, still common in existing systems
Lab: add and edit product forms with validation

Day 3 Full-Stack Integration, Security and Deployment

Section 11: Lab: Calling the API with HttpClient and httpResource

Configure provideHttpClient and per-environment settings
Write a service that calls the API with HttpClient
Load data reactively with httpResource, with loading and error states
Enable CORS in ASP.NET Core so Angular can call the API
Lab: show the product list from the real API

Section 12: Lab: CRUD Pages with Angular Material

A data table with sorting, search and paging from the API
Dialogs for adding and editing data
Confirm before deleting and report results with a snackbar
Split components and pass data with input() and output()
Lab: complete product and category management pages

Section 13: Lab: Securing the System with JWT

Authentication and authorisation for single page applications
Issue and validate JWTs with JWT bearer authentication
Permissions with roles and policies
A functional interceptor that attaches the token, and route guards in Angular
Lab: a login page and permission-based access to the management pages

Section 14: Testing and Deploying with Docker

Unit tests in .NET with xUnit
Test Angular components and services with Vitest
Build Angular for production and create a container image for the API
Combine Angular, the API and the database with Docker Compose
Lab: run the whole system with one command

Section 15: Workshop: A Full-Stack Product Management System

Design the API and screens from a business scenario
Workshop: product, category and user management, from the database to the screens
A security checklist before going live
Present the result and next steps

Schedule & training options

For individuals — public rounds

No public rounds are open right now. Join the waiting list and we will contact you first when the next round opens, or ask us on LINE. Or call 02-570-8449 or 088-807-9770

Join the waiting list Ask about rounds

For organisations — in-house / private

Tailor the content to your team’s tools and projects
Your dates, at your office or live online
Quotation with tax ID for procurement

Corporate training quote

Instructors

Samit KoyomFounder & CEO, IT Genius Engineering

Frequently asked questions

How do code-first migrations work in Entity Framework Core?

With code-first, you write your models as C# classes and a DbContext with a DbSet for each, and EF Core creates the tables from that code. Install the database provider package that matches EF Core 10 and the dotnet-ef tool, run dotnet ef migrations add with a name to generate a migration describing the changes, then run dotnet ef database update to apply it. Whenever you change a model, repeat those two commands.

Where do you start when building a Web API with ASP.NET Core 10?

Create the project with dotnet new webapi and choose controllers or minimal APIs to suit the work. Add your data models, write a controller marked with [ApiController] and [Route], and map actions with [HttpGet], [HttpPost], [HttpPut] and [HttpDelete], returning ActionResult and using async when calling the database. Move business logic into services registered for dependency injection, and test with ASP.NET Core's built-in OpenAPI document together with Swagger UI or Scalar, or with .http files.

How does Angular call a Web API?

Angular calls APIs with HttpClient, enabled with provideHttpClient in the app configuration. Generate a service with ng generate service, inject HttpClient and write methods such as getAll, create, update and delete. For loading data to display, Angular 22 offers httpResource, now stable, which returns a signal with loading and error states and reloads automatically when the values it depends on change. The ASP.NET Core side must allow the Angular origin through CORS during development.

Who is the .NET 10 Web API with Angular course for, and what should I know beforehand?

It suits developers who want to build full-stack web applications with ASP.NET Core on the backend and Angular on the frontend, C# developers moving on from classic ASP.NET, and people maintaining systems on earlier .NET Core versions. You should be able to write basic C#, know basic HTML, CSS, JavaScript and SQL, and bring a laptop that can run Docker Desktop.

What will I be able to do after the .NET 10 Web API with Angular course?

You will be able to build a Web API with ASP.NET Core 10 with validation and OpenAPI documentation, connect it to SQL Server 2025 with EF Core 10 and understand how to switch to PostgreSQL or MongoDB, build screens with Angular 22 and Angular Material including menus, forms, routing and CRUD pages that call the real API, secure the system with JWT, write basic tests and deploy everything with Docker Compose. Participants who complete the training receive a Certificate of Completion with its own number, which can be verified online.

What software does the .NET 10 Web API with Angular course use?

The course uses the .NET 10 SDK, Node.js LTS, Angular CLI 22 and VS Code with the C# Dev Kit, on Windows, macOS or Linux. SQL Server 2025, PostgreSQL and MongoDB run in Docker Desktop, so they do not need to be installed directly, and Git keeps the project. All tools are free; a laptop with 16 GB of RAM or more is recommended so several databases run smoothly.

Articles are published in Thai.