Blazor Hands on Lab

This is the Blazor HOL content for the VS Live "Blazor for Web, Desktop, and Mobile" seminar.

• Requirements before attending

Join this information intense 4-day VSLive! hands-on deep dive and learn to use Blazor. Based on the Razor markup syntax, it leverages HTML, CSS, and C# code so you can create compelling user experiences. Behind the markup is the modern cross-platform .NET framework, meaning that all your UI, business, and data access logic can be written in C#. This virtual seminar is a unique opportunity to enhance your skills so that you can build apps with Blazor for web, desktop, and mobile.

Outline

1. Day 1
   1. Welcome and Introduction
   2. What is Blazor?
   3. Blazor Architecture
   4. Understanding Blazor Routing
   5. Data and Event Binding
   6. (LAB 01) Build Your First Blazor App
   7. Razor Components
      1. Razor components
      2. Razor pages vs Razor components
      3. Razor component lifecycle
      4. StateHasChanged method
      5. Composing Razor components
      6. Razor component parameters
      7. Razor component events
      8. Cascading parameters
   8. (LAB 02) Create a Razor Component
   9. Basic Dependency Injection
      1. Registering Services
      2. Consuming Services
      3. Service Lifetimes
      4. This will change with Render Modes!
   10. Blazor Forms
       1. EditForm Component
       2. Blazor Validation
       3. Hand-roll your own form
       4. QuickGrid Component
       5. Enhancing Maintainability with Components
   11. (LAB 03) Create an app to edit data
   12. Understanding Render Modes
       1. Server-Static
       2. Server-Static Streaming
       3. Interactive Server
       4. Interactive WebAssembly
       5. Interactive Auto
       6. Detecting the Current Render Mode
       7. Dependency Injection in Different Render Modes
   13. (LAB 04) Exploring Render Modes
2. Day 2
   1. State management
      1. Server-side storage, URL, and browser storage
      2. PersistentComponentState
      3. State management per render mode
      4. State management across render modes
   2. (LAB 05) State Management
   3. Authentication Fundamentals
      1. ClaimsPrincipal and ClaimsIdentity
      2. Authentication State Provider
      3. Accessing HttpContext
      4. Flowing the Principal to WebAssembly
   4. (LAB 06) Basic Authentication
   5. Authentication via Oauth
   6. (LAB 07) Authentication via Entra Id
   7. Authorization
      1. AuthorizedView Component
      2. Authorized Attribute
      3. Role-based Authorization
      4. Policy-based Authorization
   8. (LAB 08) Authorization
3. Day 3
   1. Testing
      1. Testing with bunit
   2. (LAB 09) Testing with Bunit
   3. Styling Blazor Apps
      1. Blazor Layouts
      2. Global CSS
      3. Per-Component CSS
      4. Generating CSS
   4. (LAB 10) Style your Blazor App
   5. Data Access
      1. Server-side data access
         • Entity Framework
         • Dapper
         • ADO.NET
      2. WebAssembly data access via API (later)
      3. Use dependency injection for connections/transactions
      4. Formalize data access layer for maintainability
      5. (LAB 11) Data Access
      6. Client-side data access
         1. HttpClient
      7. (LAB 12) Client-side Data Access
   6. Blazor and JavaScript Interop
   7. (LAB 13) JavaScript Interop
4. Day 4
   1. Using Web APIs
      1. Using HttpClient
      2. Hosting Web APIs in Blazor Server
      3. Hosting Web APIs Elsewhere
         1. CORS
         2. Authentication with JWT
   2. (LAB 14) Creating and Using APIs
   3. Blazor MAUI Hybrid
      1. Blazor Mobile
      2. Blazor Desktop
   4. (LAB 15) MAUI Hybrid App
   5. Authentication in MAUI
   6. (LAB 16) Authentication in MAUI
   7. Blazor PWA
   8. (LAB 17) Building a PWA