What is Blazor used for?

Admin | Last updated 10/15/2024

Asp.Net Core Blazor is web and mobile apps framework from Microsoft.

We can create Full Stack Applications, Single Page Application(s), and Hybrid Mobile Applications (with .Net MAUI) using Blazor.

Blazor can also be used to create standalone components which then can be used in different type of asp.net core web applications like MVC and Razor Pages.

Here is the list of flavors of Blazor and their use-cases

Blazor Web Apps

We can create full-stack web apps using Blazor Web App Templates in .Net 8+

Blazor Web Apps can be used with different render modes for user interactivities

These are the available Interactivity Render Modes in Blazor Web Apps

  1. Static Server Side Rendering (SSR) - No Interactivity - These are the apps fully rendered on server (without interactivity), you can use javascript to enable interactivity in these apps though. You can consider these as an alternative for Asp.net Core MVC or Asp.Net Core Razor Pages web apps
  2. Interactive Server - Interactive Server Side Rendered Apps using SignalR - These are the apps rendered on the server with interactivity using SignalR. You do not need to implement SignalR for interactivity, it is by-default with InteractiveServer render mode. This mode was called Blazor Server in previous .Net versions.
  3. Interactive WebAssembly (WASM) - Interactive Client Side Rendered Web Apps - These are the apps initially rendered on the server (called pre-rendering which can be disabled and enabled on demand). We cannot directly access server resources in this render mode, we need to have an Api layer to access the Server Resources like Database or File System.
  4. Interactive Auto - Interactive Server Side Rendered and Client Side Rendered Apps - These are the combination of both Interactive Server and Interactive WebAssembly Apps - The app initially loads using Interactive Server render mode (i.e. SignalR) and initiates downloading WebAssembly in background, and once web assembly is downloaded, the next navigation triggers the switch over from Interactive Server to Interactive WebAssembly (i.e. from SignalR to WASM). Accessing server resources is a bit tricky with this render mode. 

       You can follow this video tutorial to understand this InteractuveAuto render mode in details 



Blazor WebAssembly Standalone Web Apps

We can create fully client side rendered SPAs (Single Page Application) and PWAs (Progressive Web Apps) using Blazor WebAssembly Standalone Apps.

These apps are same as any other SPA framework like Angular, React, Vue, Svelte, Solid etc, with a difference that we use C# instead of Javascript for our UI.

As these are fully rendered in browser, so there is no server, that means we need a separated Api layer if we want to access some server resource like database or file system.


Blazor Hybrid (.Net MAUI Blazor Hybrid)

This is a special type of Blazor Apps which allows us to create Android and iOS Mobile Apps and Windows and macOS Desktop Apps using Blazor inside .Net MAUI.

Very less .Net MAUI knowledge is required. We can build complete UI using HTML, CSS, and C# in Blazor to create these cross platform Mobile and Desktop Apps.

You can checkout these projects to see how to build the Mobile and Desktop apps using .Net MAUI Blazor Hybrid


Trip Expense Manager Andoid iOS Mobile App .Net MAUI Blazor Hybrid + SQLite

Windows and macOS Dekstop App built with .Net MAUI Blazor Hybrid + SQLite


Comments

No comments yet. Be the first to leave a comment

Add a New Comment
An unhandled error has occurred. Reload 🗙