AI Instructor Live Labs Included

Building Web Applications with ASP.NET Razor Pages

Master ASP.NET Razor Pages — from routing and forms through authentication, EF Core, AJAX, security, caching, and testing with hands-on labs in VS Code.

Intermediate

1d 14h 0m

32 Lessons

RAZOR

View badge details

About This Course

Master server-side web development with ASP.NET Razor Pages. This comprehensive course covers everything from project structure and routing through forms, validation, EF Core with PostgreSQL, authentication, external API consumption, file uploads, AJAX interactivity, security hardening, caching, and testing. Build real-world web applications using the Page Model pattern with hands-on labs in a browser-based VS Code environment. The capstone project challenges you to build a complete product catalog web application.

Course Curriculum

32 Lessons

AI Lesson

Introduction to Razor Pages & Project Structure

45m

Learn what Razor Pages are, how they differ from MVC, the Page Model pattern, and the anatomy of a Razor Pages project.

Lab Exercise

Introduction to Razor Pages - Lab Exercises

1h 25m 2 Exercises

Create your first Razor Pages project, explore the project structure, and build your first pages.

Your First Razor Pages Project Create a new ASP.NET Razor Pages project, explore the file structure, run with dotnet watch, modify the Index page, and create an About page. ~20 min

Building the BrightShelf Homepage Customize the homepage with BrightShelf branding, add navigation links, and create static product cards in HTML. ~20 min

AI Lesson

Routing, Pages & Handlers

45m

Master convention-based routing, @page directives, route parameters, handler methods, named handlers, and page navigation.

Lab Exercise

Routing & Handlers - Lab Exercises

1h 30m 2 Exercises

Build multi-page navigation with route parameters, named handlers, and redirects.

Multi-Page Navigation Create Products/Index, Products/Details with route parameters, a Contact page, and navigation between pages. ~20 min

Handlers and Named Handlers Implement OnGet/OnPost handlers, named handlers for delete and archive operations, and RedirectToPage with route values. ~25 min

AI Lesson

Forms, Model Binding & POST-Redirect-GET

45m

Learn HTML forms with Razor Pages, model binding with [BindProperty], anti-forgery tokens, and the PRG pattern.

Lab Exercise

Forms & Model Binding - Lab Exercises

1h 35m 2 Exercises

Build product create, edit, and delete forms with model binding and TempData messages.

Product Creation Form Build a Create page with a form, use [BindProperty] for the Product model, save to an in-memory list, and implement PRG redirect. ~25 min

Edit and Delete Forms Create Edit page with pre-populated form, Delete page with confirmation, and TempData success messages. ~25 min

AI Lesson

Validation (Client & Server Side)

45m

Master data annotations, ModelState validation, inline error display, client-side jQuery validation, and custom validation.

Lab Exercise

Validation - Lab Exercises

1h 30m 2 Exercises

Add validation to product forms, display errors, and implement custom cross-field validation.

Adding Validation Rules Apply data annotations to the Product model, check ModelState.IsValid, and display validation errors with asp-validation-for and asp-validation-summary. ~20 min

Custom and Client-Side Validation Implement IValidatableObject for cross-field validation, enable jQuery client-side validation, and add PageRemote for unique name checking. ~25 min

AI Lesson

Layouts, Partial Views & View Components

45m

Learn _Layout.cshtml, @RenderBody, sections, _ViewImports, _ViewStart, partial views, and View Components for reusable UI.

Lab Exercise

Layouts & View Components - Lab Exercises

1h 35m 2 Exercises

Create a site layout, product card partial, category sidebar view component, and breadcrumb navigation.

Site Layout and Navigation Create _Layout.cshtml with header, navigation, and footer. Set up _ViewStart.cshtml, use @RenderBody and @section for scripts. ~25 min

Partials and View Components Create a _ProductCard partial view, build a CategorySidebar view component with InvokeAsync, and add a breadcrumb partial. ~25 min

AI Lesson

Data Access with EF Core & PostgreSQL

50m

Integrate EF Core with Razor Pages — DbContext registration, entity models, migrations, and CRUD page patterns.

Lab Exercise

Data Access with EF Core - Lab Exercises

1h 45m 2 Exercises

Connect to PostgreSQL, create entities, run migrations, and build full CRUD pages for products.

Connecting to PostgreSQL Add EF Core and Npgsql packages, create Product and Category models, configure AppDbContext, register in Program.cs, create and apply migrations, and seed data. ~30 min

CRUD Pages with EF Core Build Products Index, Create, Edit, Delete, and Details pages using async EF Core queries with Include for Category navigation. ~30 min

AI Lesson

Tag Helpers & Razor Syntax

45m

Master built-in tag helpers (asp-for, asp-items, asp-page, asp-route-*), select lists, environment tag helper, and custom tag helpers.

Lab Exercise

Tag Helpers & Razor Syntax - Lab Exercises

1h 35m 2 Exercises

Convert raw HTML to tag helpers, build select dropdowns, and create a custom price-display tag helper.

Converting to Tag Helpers Replace raw HTML with Tag Helpers: asp-page for links, asp-for for inputs, asp-page on forms, and asp-items for select lists. ~25 min

Custom Tag Helper Create a PriceDisplayTagHelper that formats prices with optional sale price strikethrough, and register it in _ViewImports. ~25 min

AI Lesson

Dependency Injection, Configuration & Middleware

45m

Learn service registration, injecting into PageModels and views, appsettings.json, IConfiguration, and custom middleware.

Lab Exercise

DI, Configuration & Middleware - Lab Exercises

1h 35m 2 Exercises

Extract services with DI, configure app settings, add request logging middleware, and custom error pages.

Extracting Services Create IProductService interface, implement with EF Core, register as scoped, and inject into PageModels. ~25 min

Middleware and Configuration Create RequestLoggingMiddleware, add to pipeline, configure app settings with IOptions, and create custom error pages. ~25 min

AI Lesson

Authentication & Authorization

50m

Implement cookie authentication, ASP.NET Identity, login/register flows, [Authorize], policies, and role-based access.

Lab Exercise

Authentication & Authorization - Lab Exercises

1h 40m 2 Exercises

Set up Identity, build login/register pages, protect pages with [Authorize], implement role-based access.

Setting Up Identity Add ASP.NET Identity packages, scaffold Identity pages, create IdentityDbContext with PostgreSQL, run migrations, and implement a register/login flow. ~30 min

Protecting Pages Apply [Authorize] and [AllowAnonymous] attributes, implement role-based access control, and create authorization policies. ~25 min

AI Lesson

Consuming External APIs

45m

Use HttpClient and IHttpClientFactory to call REST APIs from Razor Pages, with typed clients, error handling, and retry policies.

Lab Exercise

Consuming External APIs - Lab Exercises

1h 35m 2 Exercises

Build typed HTTP clients, display external API data in pages, handle errors gracefully, and add retry logic.

Building a Typed HTTP Client Create a typed HttpClient for consuming external APIs, register it with AddHttpClient, and display data in a Razor Page. ~25 min

Error Handling and Resilience Handle HttpRequestException, add retry policies with AddStandardResilienceHandler, implement timeout handling, and display user-friendly errors. ~25 min

AI Lesson

File Uploads & Static File Management

45m

Handle file uploads with IFormFile, validate file size and type, store and serve files, and manage product images.

Lab Exercise

File Uploads & Static Files - Lab Exercises

1h 35m 2 Exercises

Build product image upload, validate files, store to disk, display in gallery, and handle multiple uploads.

Product Image Upload Add file upload to product forms using IFormFile, validate size and type, save to wwwroot/uploads, and display uploaded images. ~25 min

Gallery and Multiple Uploads Implement multiple file uploads, build an image gallery display, add delete functionality, and create a drag-and-drop upload area. ~25 min

AI Lesson

AJAX, JavaScript Interop & Partial Updates

45m

Use Fetch API with Razor Page handlers, return JSON from handlers, anti-forgery with AJAX, and partial page updates.

Lab Exercise

AJAX & JavaScript Interop - Lab Exercises

1h 35m 2 Exercises

Add live product search, add-to-cart without reload, infinite scroll, and real-time stock checking.

Live Product Search Build a live search feature with debounced input, fetch API calls to a Razor Page handler, anti-forgery token handling, and dynamic DOM updates. ~25 min

Add to Cart and Infinite Scroll Implement AJAX add-to-cart with cart count updates and infinite scroll product listing using Skip/Take pagination. ~25 min

AI Lesson

Filters, Security & Error Handling

45m

Learn page filters, global exception handling, CSRF deep dive, XSS prevention, Content Security Policy, and custom error pages.

Lab Exercise

Filters & Security - Lab Exercises

1h 35m 2 Exercises

Implement page filters, global error handling, security headers, and custom 404/500 error pages.

Page Filters and Error Handling Create a LoggingPageFilter using IAsyncPageFilter, register it globally, implement custom error pages with UseExceptionHandler, and configure ProblemDetails. ~25 min

Security Headers Build SecurityHeadersMiddleware adding CSP, X-Frame-Options, X-Content-Type-Options, and HSTS headers. Test with browser dev tools and verify CSRF protection. ~25 min

AI Lesson

Caching & Performance

45m

Master in-memory caching, response caching, output caching, EF Core query optimization, and static asset bundling.

Lab Exercise

Caching & Performance - Lab Exercises

1h 35m 2 Exercises

Add memory caching to product pages, configure response caching, optimize database queries, and measure performance.

Memory and Response Caching Use IMemoryCache for caching category lists with GetOrCreate and expiration, apply [ResponseCache] on product listing pages, and measure performance with Stopwatch. ~25 min

Output Caching and Query Optimization Configure OutputCache middleware with policies, use VaryByQuery for pagination, apply AsNoTracking for read pages, and optimize with Select projections. ~25 min

AI Lesson

Testing Razor Pages

45m

Unit test PageModels with mocked services, integration test with WebApplicationFactory, and test forms, validation, and auth flows.

Lab Exercise

Testing Razor Pages - Lab Exercises

1h 45m 2 Exercises

Write unit tests for PageModels, mock services, build integration tests with WebApplicationFactory, and test auth flows.

Unit Testing PageModels Set up an xUnit test project, mock IProductService with Moq, test OnGetAsync populates Products, and test OnPostAsync with valid and invalid model state. ~30 min

Integration Tests Set up WebApplicationFactory, configure test PostgreSQL database, test product CRUD endpoints, and test authentication (anonymous redirect, authenticated access). ~30 min

AI Lesson

Capstone Briefing: BrightShelf Product Catalog

30m

Review all concepts and receive the capstone project brief — build BrightShelf's complete product catalog web application.

Lab Exercise

Capstone: BrightShelf Product Catalog

2h 15m 1 Exercises

Build a complete product catalog web application with CRUD, auth, search, file uploads, AJAX, caching, and tests.

BrightShelf Product Catalog Full capstone project integrating all course concepts: Product/Category/User models, EF Core with PostgreSQL migrations and seed data, Identity authentication, CRUD pages, AJAX search, file uploads, caching, page filters, and a minimum of 10 tests. ~90 min

Start Free Trial

This course includes:

24/7 AI Instructor Support
Live Lab Environments
16 Hands-on Lessons
Completion Badge

Earn Your Badge

Complete all lessons to unlock the ASP.NET Razor Pages Developer achievement badge.

Category Developer

Skill Level Intermediate

Total Duration 1d 14h 0m

Building Web Applications with ASP.NET Razor Pages

About This Course

Course Curriculum

Introduction to Razor Pages & Project Structure

Introduction to Razor Pages - Lab Exercises

Routing, Pages & Handlers

Routing & Handlers - Lab Exercises

Forms, Model Binding & POST-Redirect-GET

Forms & Model Binding - Lab Exercises

Validation (Client & Server Side)

Validation - Lab Exercises

Layouts, Partial Views & View Components

Layouts & View Components - Lab Exercises

Data Access with EF Core & PostgreSQL

Data Access with EF Core - Lab Exercises

Tag Helpers & Razor Syntax

Tag Helpers & Razor Syntax - Lab Exercises

Dependency Injection, Configuration & Middleware

DI, Configuration & Middleware - Lab Exercises

Authentication & Authorization

Authentication & Authorization - Lab Exercises

Consuming External APIs

Consuming External APIs - Lab Exercises

File Uploads & Static File Management

File Uploads & Static Files - Lab Exercises

AJAX, JavaScript Interop & Partial Updates

AJAX & JavaScript Interop - Lab Exercises

Filters, Security & Error Handling

Filters & Security - Lab Exercises

Caching & Performance

Caching & Performance - Lab Exercises

Testing Razor Pages

Testing Razor Pages - Lab Exercises

Capstone Briefing: BrightShelf Product Catalog

Capstone: BrightShelf Product Catalog

This course includes:

Earn Your Badge

ASP.NET Razor Pages Developer

Skills You'll Earn