A Microsoft open-source framework for building native device applications spanning mobile, tablet, and desktop.
Start with Microsoft’s template-specific tutorial, Build a .NET MAUI Blazor Hybrid app with a Blazor Web App; it documents the exact Visual Studio template shown and explains its projects, shared UI, dependency injection, and web render-mode choices.^1^
What this template creates
The .NET MAUI Blazor Hybrid and Web App template creates:
- A .NET MAUI Blazor Hybrid app for Android, iOS, macOS, and Windows.
- A Blazor Web App for browsers.
- A shared Razor class library (RCL) containing reusable Razor components and web assets.
The template was added in .NET MAUI 9.^2^
“Hybrid” doesn't mean that the native application runs WebAssembly. Its Razor components execute inside the native .NET process and render through an embedded Web View. The browser project separately uses the Blazor render mode selected when creating the solution.^3^
Recommended learning order
- Learn basic Razor components and Blazor Web Apps Complete Build your first web app with Blazor. It covers project creation, Razor components, and component logic.^4^ Follow it with the Blazor todo tutorial for practical work with components, events, data binding, and routing.^5^
- Learn Blazor Hybrid and native-device integration Complete Build a mobile and desktop app with Blazor Hybrid and .NET MAUI. This is the closest formal training module for the native half of the template. It covers:
- Development-environment setup
- Hybrid architecture
- Razor components
- Data binding and events
- Access to native platform features
- Deployment from Visual Studio
- Work through the exact combined-template tutorial Return to the template-specific tutorial and run both startup projects:
- Select the MAUI project in Solution Explorer, choose a Windows or emulator/device target, and run it.
- Select the web project and run its HTTPS profile.
- Modify a component in the shared RCL and confirm that the change appears in both applications.^1^
Replacedotnet workload install maui dotnet new maui-blazor-web -o MauiBlazorWeb -I ServerServerwithWebAssemblyorAutoif that is the required web interactivity model.Servercreates a single web project;WebAssemblyandAutoalso create a.Clientproject.^1^ - Learn how shared UI should be structured Complete Build reusable components with Blazor to understand the RCL used by this template.^7^ Keep shared components independent of MAUI APIs. Define interfaces in the RCL, then register separate web and MAUI implementations through dependency injection. This allows the same component to work in both hosts.^8^
- Fill in MAUI-specific knowledge as needed The beginner .NET MAUI learning path covers application architecture, XAML, navigation, REST services, and SQLite.^9^ For this template, prioritize architecture, platform services, lifecycle, permissions, and deployment; most shared screens are Razor components rather than XAML pages.
Books and larger samples
There may be fewer books devoted specifically to this combined template because it joins three established subjects: Blazor, Blazor Hybrid, and .NET MAUI. The Microsoft learning-resources page includes workshops, samples, videos, and the free Enterprise Application Patterns Using .NET MAUI book, which is useful for dependency injection, navigation, configuration, and maintainable application architecture.^10^
After completing a small application, inspect the eShop reference application for a larger example containing a .NET MAUI Blazor Hybrid client.^11^
A suitable first project is a small CRUD application with:
- Shared list, edit, and validation components in the RCL.
- An in-memory service initially.
- Separate web and MAUI service registrations.
- One native-only feature, such as device information.
- Later replacement of the in-memory service with an ASP.NET Core API.
References
- Build a .NET MAUI Blazor Hybrid app with a Blazor Web App
- What's new in .NET MAUI for .NET 9
- ASP.NET Core Blazor Hybrid
- Build your first web app with Blazor - Training
- Build a Blazor todo list app
- Build a mobile and desktop app with Blazor Hybrid and .NET MAUI - Training
- Build reusable components with Blazor - Training
- Combine Blazor Hybrid with .NET MAUI and Razor class libraries (RCLs)
- Build mobile and desktop apps with .NET MAUI - Training
- Resources for learning .NET MAUI
- Share assets across web and native clients using a Razor class library (RCL)