.NET MAUI Blazor Hybrid with Web App and Auth

Explore the Visual Studio setup for a .NET MAUI Blazor Hybrid solution, including the Blazor web app, .NET MAUI Blazor Hybrid app, and Razor class library templates in one solution.

Enable authentication in a .NET MAUI Blazor hybrid by using Microsoft’s Maui Blazor Web Identity Project, downloading or cloning the sample to implement shared Razor files for web and mobile.

Open the Maui Blazor Web Identity folder to review the sample project structure, including web app authentication, an API, and SQL-based ASP.NET user authentication.

Explore how the Maui Authentication State Provider handles login, logout, token validation and refresh with secure storage and a shared identity API.

Run the app to auto-create a SQL database for authentication and authorization using the app context and a project-name plus guid, then explore the ASP.NET identity tables.

Set up and run the sample web project to initialize and register the user, then modify the register page to add a bool is admin checkbox, mirroring the login page.

Inject the rule manager, register a user, and add the admin role after creation using the role manager to check existence, then test and verify in the database.

Create a book model in shared class library with id, title required, description, author, publisher, publication date, and price as currency decimal(18,2); enable nulls for database use by both apps.

Scaffold the book model to sql server database in website project using a Blazor Razor component to generate crud pages, and create a bookstore DbContext for future orders and inventory.

Configure a connection string for authentication and bookstore contexts, create migration, update database to add book table, and move razor files to shared razor component library for web and mobile.

Extend the existing authentication API in the Blazor web app to support a new book object. Learn secure mobile data access via an API rather than direct database calls.

Review Razor files and refactor to remove db factory and Entity Framework calls before adding to the shared library, moving data access to an API instead of direct database access.

Create a book service interface in the shared common library and implement add, get, get by id, update, and delete in mobile and web apps.

Update razor files to move get, add, update, and delete operations into the book service, use token-authenticated api calls, and replace dbcontext with a book list, title filter, and pagination.

Test book creation end-to-end by adding a book service, compiling, and running the web and mobile apps; verify login, create a test book, and confirm data in the database.

Troubleshoot mobile and web apps by running the api-backed books feature, using dev tools to view console errors and debug across Windows, Mac, Android, and iOS.

Update the android sdk, create an emulator, run maui blazor web on android, debug the book service error with browser inspect, add the book service reference in Maui Programs.

Create a route builder extension in the web app to expose the book API endpoints (pull all, add, update, delete) and test by rebuilding and running the apps.

Enable admin-only book creation by implementing role-based authorization across web and mobile apps, adding role claims and a user role API, and updating the authentication flow.

Learn how an authorized view in a .NET MAUI Blazor Hybrid app uses a role check to reveal create new link only for admin users by adding a role claim.

Move login and layout pages to the shared library, and implement a mobile‑or‑web login interface. Extend the bookstore with new objects and complete object scaffolding and Razor updates.