OverviewHistoryStatsSecurity
npx skills add ...
Documentation
SKILL.md
npx skills add markpitt/claude-skills --skill blazor-expert
Comprehensive Blazor development expertise covering Blazor Server, WebAssembly, and Hybrid apps. Use when building Blazor components, implementing state management, handling routing, JavaScript interop, forms and validation, authentication, or optimizing Blazor applications. Includes best practices, architecture patterns, and troubleshooting guidance.
npx skills add markpitt/claude-skills --skill blazor-expert
Expert-level guidance for developing applications with Blazor, Microsoft's framework for building interactive web UIs using C# instead of JavaScript.
| Task | Load Resource | Key Topics |
|---|---|---|
| Build components, handle lifecycle events | components-lifecycle.md | Component structure, lifecycle methods, parameters, cascading values, RenderFragment composition |
| Manage component state, handle events | state-management-events.md | Local state, EventCallback, data binding, cascading state, service-based state |
| Configure routes, navigate between pages | routing-navigation.md | Route parameters, constraints, navigation, NavLink, query strings, layouts |
| Build forms, validate user input | forms-validation.md | EditForm, input components, DataAnnotations validation, custom validators |
| Setup authentication & authorization | authentication-authorization.md | Auth setup, AuthorizeView, Authorize attribute, policies, claims |
| Optimize performance, use JavaScript interop | performance-advanced.md | Rendering optimization, virtualization, JS interop, lazy loading, WASM best practices |
Identify your primary objective:
Open the recommended resource file(s) and search for your specific need using Ctrl+F. Each resource is organized by topic with working code examples.
Decision: Choose based on deployment environment, offline requirements, and server constraints.
{id:int})✅ Single Responsibility - Each component has one clear purpose
✅ Composition - Use RenderFragments for flexible layouts
✅ Parameter Clarity - Use descriptive names, mark required with [EditorRequired]
✅ Proper Disposal - Implement IDisposable to clean up resources
✅ Event-Based Communication - Use EventCallback for child-to-parent updates
✅ EventCallback Over Action - Proper async handling ✅ Immutable Updates - Create new objects/collections, don't mutate ✅ Service-Based State - Use scoped services for shared state ✅ Unsubscribe from Events - Prevent memory leaks in Dispose ✅ InvokeAsync for Background Threads - Thread-safe state updates
✅ Route Constraints - Use :int, :guid, etc. to validate formats
✅ NavLink Component - Automatic active state highlighting
✅ forceLoad After Logout - Clear client-side state
✅ ReturnUrl Pattern - Redirect back after login
✅ Query Strings - Preserve filters/pagination across navigation
✅ EditForm + DataAnnotationsValidator - Built-in validation ✅ ValidationMessage - Show field-level errors ✅ Custom Validators - Extend for complex rules ✅ Async Validation - Check server availability before submit ✅ Loading State - Disable submit button while processing
✅ Server Validation - Never trust client-side checks alone ✅ Policies Over Roles - More flexible authorization rules ✅ Claims for Details - Store user attributes in claims ✅ Cascading AuthenticationState - Available in all components ✅ Error Boundaries - Graceful error handling
✅ @key on Lists - Optimize item matching ✅ ShouldRender Override - Prevent unnecessary renders ✅ Virtualization for Large Lists - Only render visible items ✅ JS Module Isolation - Load and cache JS modules efficiently ✅ AOT for WASM - Production deployments
items = items.Append(item).ToList()StateHasChanged() manuallyfirstRender check, verify JS file pathawait JS.InvokeAsync("import", "./script.js")await AuthStateTask! in code blockCircuitOptions.DisconnectedCircuitRetentionPeriodComplete guide to component structure, lifecycle methods, parameters, cascading values, and composition patterns. Essential for understanding Blazor component fundamentals.
Comprehensive coverage of local and service-based state, event handling with EventCallback, data binding patterns, and component communication. Core for interactive UI building.
Complete routing reference including route parameters, constraints, programmatic navigation, query strings, and layout management. Essential for multi-page apps.
Full forms API with EditForm component, input controls, DataAnnotations validation, custom validators, and form patterns. Required for data entry scenarios.
Complete auth setup for Server and WASM, AuthorizeView, policies, claims-based access control, and login/logout patterns. Necessary for secured applications.
Performance optimization techniques including ShouldRender, virtualization, JavaScript interop patterns, lazy loading, and WASM best practices. Vital for production apps.
When implementing Blazor features:
Version: 2.0 - Modular Orchestration Pattern
Last Updated: December 4, 2025
Status: Production Ready ✅