maui-blazor-development

Guide .NET MAUI Blazor Hybrid development with architecture and BlazorWebView configuration.

3|1|Updated Nov 28, 2025
One-click install
npx skills add https://github.com/iButters/ClaudeCodePlugins --skill maui-blazor-development
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: maui-blazor-development
Source: https://github.com/iButters/ClaudeCodePlugins/tree/main/plugins/maui-blazor-development/skills/maui-blazor-development
Command: npx skills add https://github.com/iButters/ClaudeCodePlugins --skill maui-blazor-development

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill simplifies the complex process of building native mobile and desktop applications by allowing you to reuse your existing Blazor web UI code. It reduces development time and effort by providing expert guidance on cross-platform integration and Blazor Hybrid specifics.

Core Features & Use Cases

  • Blazor Hybrid Expertise: Guides you through combining .NET MAUI for native app capabilities with Blazor for web UI.
  • Cross-Platform Integration: Provides patterns for accessing device APIs, managing permissions, and writing platform-specific code.
  • State & Navigation Management: Offers strategies for handling component state, MVVM, and navigating between MAUI pages and Razor components.
  • Use Case: You need to create a new application that runs natively on iOS, Android, and Windows, but you want to leverage your team's existing Blazor web development skills and codebase for the user interface.

Quick Start

Help me set up a new .NET MAUI Blazor Hybrid project and integrate a shared Blazor component.

Frequently Asked Questions about maui-blazor-development

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
Can I reuse my Blazor web UI code to build native iOS and Android apps?

Yes, .NET MAUI Blazor Hybrid lets you reuse existing Blazor components for native mobile and desktop applications. You combine MAUI's native capabilities with Blazor's web UI framework, reducing development time by leveraging your team's existing web codebase.

How do I set up a .NET MAUI Blazor Hybrid project from scratch?

Create a new MAUI project, add Blazor Hybrid via NuGet, configure BlazorWebView in your MAUI layout, and register Blazor services with dependency injection. The Skill provides step-by-step guidance on project structure, component integration, and initial configuration.

How do I access device APIs and platform-specific features in a MAUI Blazor app?

Use MAUI's platform abstraction layer and JavaScript interop to bridge Blazor components with native device APIs. The Skill covers permission management, platform-specific code patterns, and secure integration of device capabilities like sensors and hardware.

What's the best approach to manage state and navigation between MAUI pages and Razor components?

Implement MVVM patterns with centralized state management and coordinate navigation between native MAUI pages and Blazor Razor components. The Skill addresses component lifecycle patterns, dependency injection lifetimes, and cross-platform state consistency.

Can I build a cross-platform app that runs on iOS, Android, and Windows with a single codebase?

Yes, MAUI Blazor Hybrid enables true cross-platform development with shared Blazor UI across iOS, Android, Windows, and macOS. Write once using C# and Blazor, then deploy natively to all platforms with platform-specific adjustments as needed.

What dependency injection patterns should I use in a MAUI Blazor application?

Configure service lifetimes carefully—use scoped for component-specific state, singleton for app-wide services, and transient for stateless utilities. The Skill guides proper DI setup to avoid lifecycle conflicts between MAUI pages and Blazor components.