Blazor (DEV-CSHARP-BL)

Leer interactieve webapps bouwen met Blazor en C#. Ontwikkel component-based UI’s met Blazor Server en WebAssembly, inclusief data binding, state management en JS-interop.

In de training leer je interactieve webapplicaties bouwen met Blazor, het .NET-framework voor component-based UI’s. Je ontwikkelt zowel server- als client-side applicaties met Blazor Server en Blazor WebAssembly, volledig in C#. Daarnaast leer je state beheren, dependency injection toepassen en formulieren valideren.

Wat leer je in deze training?

Blazor Fundamentals –Begrijp het verschil tussen Blazor Server en WebAssembly, en start projecten via CLI of Visual Studio.
Componentontwikkeling –Bouw Razor Components met lifecycle-methodes en async initialisatie.
Interactie –Implementeer two-way binding, event handling en formulierverwerking met validatie.
Integratie –Roep JavaScript aan vanuit C# (JS Interop) en vice versa, en beheer gedeelde state en services.
Security & Deployment –Pas authentication toe met IdentityServer en publiceer je apps via IIS of Azure.

Deze training is ideaal voor .NET-developers die moderne webinterfaces willen bouwen zonder JavaScript. Ook geschikt voor teams die Razor Pages of MVC gebruiken en willen overstappen op rijkere, interactieve UI's. Je werkt aan realistische scenario’s met actuele tooling, inclusief Razor IntelliSense en Hot Reload.

Virtueel beschikbaar

Iedere maand starten

Erkende certificaten

Door heel Nederland

Voor wie

Programma

Inclusief AI-Tutor die je tijdens en na de training ondersteunt met slimme tips, antwoorden op vragen en extra uitleg. De tool is altijd en overal beschikbaar.

Dag 1: Blazor Fundamentals en Componenten

Introductie Blazor: Overzicht van Blazor Server vs. WebAssembly, projectstructuren, en tooling (o.a. Visual Studio, CLI).
Razor Components: Opbouw van componenten met Razor-syntax, lifecycle-methoden (OnInitialized, OnParametersSet).
Data Binding en Events: One-way en two-way binding (@bind), event handling (@onclick, @oninput).
Routing en Navigatie: Router-component, @page directive, parameters via [Parameter], NavigationManager.
Basic Form Handling: Formuliervalidatie met DataAnnotations, EditForm en InputBase-componenten.

Dag 2: Geavanceerde Technieken en Integratie

JavaScript Interop: JS-invoke vanuit C# (IJSRuntime), C#-methoden aanroepen vanuit JavaScript (DotNetObjectReference).
State Management: In-memory state (services), persistentie via LocalStorage, state containers.
Dependency Injection: Service registratie (Program.cs), injectie via [Inject], scoped vs. singleton services.
Authentication & Authorization: Integratie met IdentityServer, AuthorizeView en [Authorize]-attributen.
Deployment: Publiceren van Blazor-apps (dotnet publish), hosting-opties (IIS, Azure Static Web Apps).
Razor Pages/MVC vs. Blazor: Korte vergelijking van view-technologieën binnen het ASP.NET Core-ecosysteem.

Programma:

Blazor architectuur: Server vs. WebAssembly, project templates (dotnet new blazorserver, blazorwasm).
Razor Components: @code-blokken, component lifecycle, async initialisatie.
Data binding: @bind:property, @bind:event, @bind:format.
Event handling: PreventDefault, EventCallback.
Routing: Route parameters, route constraints, NavLink-component.
Form validatie: ValidationSummary, ValidationMessage, custom validators.
JavaScript-interop: JS module imports (import statement in wwwroot), Callback methods.
State management: CascadingValue, Flux/REDUX-patterns met Blazor-State.
DI: HttpClient injectie, configuratie van services (AddScoped, AddSingleton).
Security: AuthenticationStateProvider, Policy-based autorisatie.
Deployment: AOT-compilatie, trimming configuratie, Docker-integratie.
Debugging: Browser devtools, .NET logging (ILogger), breakpoints in Razor-components.