blazor-patterns

Standardize Blazor component patterns for render modes, state, and interop.

4|Updated Apr 20, 2026
One-click install
npx skills add https://github.com/zdanovichnick/dotnet-pilot --skill blazor-patterns
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: blazor-patterns
Source: https://github.com/zdanovichnick/dotnet-pilot/tree/main/skills/blazor-patterns
Command: npx skills add https://github.com/zdanovichnick/dotnet-pilot --skill blazor-patterns

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you avoid common Blazor component pitfalls by providing clear, reusable patterns for render modes, state, and interop.

Core Features & Use Cases

  • Render mode-ready component structure: Guide component design for Server and WebAssembly render modes (and future Auto handling).
  • State management patterns: Establish maintainable approaches using cascading parameters and Fluxor-style patterns.
  • Practical interop and forms guidance: Apply JS interop best practices and structure forms with EditForm and FluentValidation.
  • Auth integration direction: Prepare components for AuthenticationStateProvider-based authentication patterns.

Quick Start

Ask the Skill to outline a Blazor Server and WebAssembly-compatible component pattern for managing state and calling JavaScript interop.

Frequently Asked Questions about blazor-patterns

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

FAQPage Schema
How do I structure Blazor components for both Server and WebAssembly render modes?

To structure Blazor components for both Server and WebAssembly render modes, apply v2-ready component patterns that standardize lifecycle design and render-mode selection, ensuring architectural compatibility across different Blazor hosting models.

What is the best way to manage state in Blazor using cascading parameters and Fluxor?

The best way to manage state in Blazor involves establishing maintainable patterns using cascading parameters for hierarchical data flow and Fluxor-style patterns for predictable state management across complex component workflows.

How do I handle JavaScript interop and form validation in Blazor components?

To handle JavaScript interop and form validation in Blazor, apply JS interop best practices for browser API calls and structure forms using EditForm combined with FluentValidation to ensure robust data validation.

Can I use AuthenticationStateProvider for auth integration in Blazor components?

Yes, you can use AuthenticationStateProvider for auth integration in Blazor components by preparing component structures with established authentication patterns that map to relevant Blazor scenarios and implementation responsibilities.

Why does my Blazor component architecture break across different render modes?

Blazor component architecture breaks across render modes when standard patterns are not applied to lifecycle design and render-mode selection, causing architectural issues that reusable Server and WebAssembly patterns prevent.

Do I need Fluxor to implement state management patterns in Blazor?

No, you do not need Fluxor to implement state management patterns in Blazor, as standard maintainable approaches can be established using cascading parameters alone, with Fluxor-style patterns as an optional enhancement.