Blazor is an ASP.NET Core programming model for interactive web interfaces built with C# and Razor Components. Blazor Server runs application code on the server: JavaScript receives browser events, forwards them over a persistent connection, and displays the resulting changes. Blazor WebAssembly runs the C# application code in the browser. The two approaches have different trade-offs; neither fits every project. section 1.1.3 section 33.0
The practical attraction is keeping interface behavior in C# rather than adopting a JavaScript framework. For Blazor Server, that choice depends on reliable connectivity and modern browsers: interaction stops when the connection is lost. A line-of-business application with known browsers and network quality is a better candidate than a public-facing site where neither can be assumed. section 33.2.1 section 33.2.3
A Blazor Server interface is assembled from components and ASP.NET Core configuration:
- Configure Blazor services and its endpoint with AddServerSideBlazor and MapBlazorHub, and include the required JavaScript file. section 33.0
- Use Razor Components for markup and C# behavior. The @page directive makes a component routable; event attributes connect browser interactions to handlers. Components also support data binding and code-behind classes. section 10.4 section 33.0
- Use a Router to select a component from the current URL, a layout for shared structure, and NavLink for navigation without a new HTTP request. section 10.1.3
Listing 10.4 The Routed.razor File in the SportsStore/Pages/Admin Folder
<Router AppAssembly="typeof(Program).Assembly">
<Found>
<RouteView RouteData="@context"
DefaultLayout="typeof(AdminLayout)" />
</Found>
<NotFound>
<h4 class="bg-danger text-white text-center p-2">
No Matching Route Found
</h4>
</NotFound>
</Router>
The administration router shows the decision point: render the matched component with a default layout, or display a no-match message. section 10.1.3
Build an administration interface
For a product catalog, provide a list interface and an edit interface to create, read, update, and delete products. Built-in form components support the edit side: EditForm contains input components, while validation attributes and form events handle validation. Align repository and component lifetimes with OwningComponentBase<T> when the component owns the service it uses. section 10.3 section 36.0 section 10.4
Watch what rendering does to data access. Blazor rerenders a component after a state change to determine what must change in the browser. If its markup reads an Entity Framework Core query-backed property, even an unrelated button click can execute the query again. In a list example, checking Count and iterating the same property produces two identical database queries per render. Manage query execution explicitly rather than treating a LINQ query as an already-loaded result. section 36.3.2 section 36.0
Plan for the Server connection to fail. A custom components-reconnect-modal element and CSS can distinguish reconnection attempts, failures, and rejected connections; stopping or restarting the server makes those states observable. To protect an entire application, apply Authorize to its entry-point Razor Page so unauthenticated requests reach the login prompt instead. section 34.4.1 section 39.4
