Learning courses or books for "building .NET MAUI Blazor Hybirdand web app"

john john Pter 1,590 Reputation points
2026-11-12T23:41:33.6966667+00:00

I want to create a new project using this visual studio template:-

User's image

but i am having troubles finding online courses, books or online documentation targeting this specific template? any advice and help in my learning journey ?

Thanks

Developer technologies | .NET | .NET Multi-platform App UI
0 comments No comments

2 answers

Sort by: Oldest
  1. AI answer

    2026-11-12T23:43:39.3133333+00:00

    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^

    1. 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^
    2. 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
      It assumes familiarity with C#, .NET, and basic web concepts.^6^
    3. 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^
      The CLI equivalent is:
         dotnet workload install maui
         dotnet new maui-blazor-web -o MauiBlazorWeb -I Server
      
      Replace Server with WebAssembly or Auto if that is the required web interactivity model. Server creates a single web project; WebAssembly and Auto also create a .Client project.^1^
    4. 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^
    5. 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

    1. Build a .NET MAUI Blazor Hybrid app with a Blazor Web App
    2. What's new in .NET MAUI for .NET 9
    3. ASP.NET Core Blazor Hybrid
    4. Build your first web app with Blazor - Training
    5. Build a Blazor todo list app
    6. Build a mobile and desktop app with Blazor Hybrid and .NET MAUI - Training
    7. Build reusable components with Blazor - Training
    8. Combine Blazor Hybrid with .NET MAUI and Razor class libraries (RCLs)
    9. Build mobile and desktop apps with .NET MAUI - Training
    10. Resources for learning .NET MAUI
    11. Share assets across web and native clients using a Razor class library (RCL)
    AI-generated content may be incorrect. Read our transparency notes for more information.

    Was this answer helpful?

  2. Harry Nguyen (WICLOUD CORPORATION) 690 Reputation points Microsoft External Staff Moderator
    2026-11-13T08:04:07.89+00:00

    Hi @john john Pter ,

    The template you are referring to is the .NET MAUI Blazor Hybrid and Web App template. It combines a .NET MAUI app for native mobile and desktop platforms, a Blazor Web App, and a Razor class library (RCL) containing the UI shared by both apps. Here are a few resources that may help you get started.

    First, Microsoft provides the official tutorial Build a .NET MAUI Blazor Hybrid app with a Blazor Web App. Although it is a tutorial rather than a complete course, it covers the exact solution template, including the MAUI app, Blazor Web App, shared RCL, dependency injection for platform-specific implementations, and the available Server, WebAssembly, and Auto interactivity options.

    If Blazor Hybrid is new to you, the Microsoft Learn module Build a mobile and desktop app with Blazor Hybrid and .NET MAUI is a useful introduction to the architecture, Razor components, data binding, native platform features, and deployment from Visual Studio.

    For a structured third-party course, you can also consider the Udemy course .NET MAUI Blazor Hybrid with Web App and Authentication. Its topics are closely related to the solution you want to build, particularly the integration of a MAUI Blazor Hybrid client, a web app, and authentication. Before purchasing, I recommend reviewing the course curriculum and its target .NET version so that you can account for any differences from the current template.

    For a larger hands-on project, Abhay Prince's Fullstack Notes App using .NET MAUI Blazor Hybrid and Web App is another close match. The associated project and source-code page explicitly states that it uses the .NET MAUI Blazor Hybrid and Web App Template with .NET 9. The project builds a full-stack notes application for web, Windows, macOS, Android, and iPhone using EF Core, SQL Server, ASP.NET Core Minimal APIs, and JWT/cookie authentication. The video tutorial is available separately from the paid source-code download.

    Because this project targets .NET 9, some generated files, package versions, screens, or configuration steps may differ if you use a newer .NET version.

    A practical learning order would be to review the official template tutorial first, complete the Microsoft Learn module if you need the fundamentals, and then choose the Udemy course for a structured course format or the .NET 9 video for a larger end-to-end project. If you found my response helpful or informative, I would greatly appreciate it if you could follow this guide for your confirmation

    Thank you.

    Was this answer helpful?

    0 comments No comments

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.