New: 97,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Official agent skill

Blazor Component Author

by dotnet in dotnet/skills

Writes and reviews Blazor .razor components with correct parameters, EventCallback, lifecycle, async and disposal patterns, for components that need no JavaScript interop.

OfficialMITAuto-check passedFrontend & Design

Install Blazor Component Author

skills CLI
$ npx skills add dotnet/skills --skill author-component -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install dotnet/skills author-component --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/dotnet/skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/dotnet-blazor/skills/author-component .claude/skills/author-component && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
author-component
GitHub stars
5.6k
Used in
1 other repo
Token cost
~830 tokens
SKILL.md length
251 words
Files
4 (incl. references)
Skills in repo
91
Repo updated
First seen
Licence
MIT

At a glance

Writes and reviews Blazor .razor components with correct parameters, EventCallback, lifecycle, async and disposal patterns, for components that need no JavaScript interop.

  • Writing a new Blazor component with parameters and event callbacks
  • SKILL.md covers Core Rules, RenderFragment & Generics, File Patterns and Disposal, plus 2 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
  • Reviewing a .razor file for parameter mutation or missing disposal

What it does

The core rules are that data flows down through parameters and events flow up through EventCallback rather than Action or Func. Parameters are never mutated, so a copy goes into a private field in OnParametersSet, and the agent uses EditorRequired instead of required or init. Components handle loading, empty, loaded and error states, use @key on repeated elements, and take collections as IReadOnlyList. RenderFragment slots and @typeparam cover content and generic templates.

Logic under roughly 50 lines stays in a single .razor file with an @code block, and longer logic moves to a .razor.cs code-behind partial class. A component that owns subscriptions, timers or a CancellationTokenSource implements IAsyncDisposable. Every async call is awaited, with no .Result, .Wait or Task.Run, debouncing uses Task.Delay with a CancellationTokenSource, and external events go through InvokeAsync. Reference notes cover async rules, breaking components down and disposal. New projects, JavaScript interop, forms, prerendering, HTTP data and shared state each have their own sibling skills.

When your agent uses it

  • Writing a new Blazor component with parameters and event callbacks
  • Reviewing a .razor file for parameter mutation or missing disposal
  • Adding debounce, polling or cancellation to a component without timers
  • Deciding when to split a large component into code-behind and child components

Example prompts

  • “Write a ProductCard Blazor component with a Title parameter and an OnSelected callback.”
  • “Review this .razor file for parameter mutation and missing disposal.”
  • “Add debounced search to the SearchBox component without using timers.”
  • “Split this long component into a code-behind file and smaller child components.”

Requirements

  • A Blazor project on .NET

What it can do on your machine

Read from SKILL.md and the folder at commit 8d670fa. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are csharp).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Blazor Component Author loads about 830 tokens when it runs, and up to ~4.1k if it reads all its reference files. Until then it costs about 187 tokens; SKILL.md has 251 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~187
When it runs · the whole SKILL.md, loaded when a task matches
~830
With references · SKILL.md plus every file in references/, read only if the agent opens them
~4.1k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from dotnet/skills at commit 8d670fa, republished under its MIT licence (© dotnet). 251 words, ~830 tokens.

Download SKILL.mdSave it as .claude/skills/author-component/SKILL.md (or your agent's skills folder). This skill also uses 3 other files; get the full folder from GitHub.
name
author-component
description
Create or review Blazor components (.razor files) with correct architecture. USE FOR: writing new Blazor components that do NOT involve JavaScript interop, implementing parameters and EventCallback, RenderFragment slots, component lifecycle (OnInitializedAsync, OnParametersSet), async patterns, IAsyncDisposable, CancellationToken, CSS isolation, code-behind. DO NOT USE FOR: creating new projects (use create-blazor-project), JavaScript interop or calling browser APIs from Blazor (use use-js-interop), forms and validation (use collect-user-input), prerendering issues (use support-prerendering), HTTP data fetching patterns (use fetch-and-send-data), coordinating state between unrelated components (use coordinate-components).
license
MIT

Author Blazor Component

Core Rules

  • Data flows down via [Parameter]. Events flow up via EventCallback<T> (never Action/Func).
  • Never mutate [Parameter] properties. Copy to a private field in OnParametersSet.
  • Use [Parameter] public T Prop { get; set; } — never required or init (causes BL0007).
  • Use [EditorRequired] for required parameters.
  • Handle all states: loading, empty, loaded, error — each with @if/@else.
  • Use @key on repeated elements in loops for efficient diffing.
  • Use IReadOnlyList<T> (not IEnumerable<T>) for collection parameters.

RenderFragment & Generics

csharp
[Parameter] public RenderFragment? ChildContent { get; set; }
[Parameter] public RenderFragment<TItem>? RowTemplate { get; set; }  // generic template

Use @typeparam TItem for generic components.

File Patterns

  • Single-file: .razor with @code block when logic < ~50 lines.
  • Code-behind: .razor + .razor.cs with partial class when logic > ~50 lines.

Disposal

Implement IAsyncDisposable (not IDisposable) when the component owns subscriptions, timers, or CTS. In DisposeAsync: unsubscribe (-=), cancel CTS, dispose resources. Never call StateHasChanged.

Async Patterns

  • await every async operation. Never use .Result, .Wait(), Task.Run, ContinueWith, Thread.Start.
  • Debounce: Task.Delay + CancellationTokenSource. Cancel old CTS, create new, await delay, do work. Never use System.Threading.Timer or System.Timers.Timer.
  • Polling: Loop in OnInitializedAsync with await Task.Delay(interval, token) — stays on sync context.
  • External events (Action<T>): Use async void handler + await InvokeAsync(() => { state++; StateHasChanged(); }) + catch → DispatchExceptionAsync. Never _ = InvokeAsync(...).
  • Cancel CTS in DisposeAsync. Don't catch ObjectDisposedException — use CTS cancellation.

Don'ts

  • required/init on [Parameter] — runtime failure
  • Mutate [Parameter] — copy to private field in OnParametersSet
  • Action/Func for events — use EventCallback<T>
  • Task.Run/.Result/.Wait()/Timer for debounce — deadlock or thread-pool escape
  • Inline style attributes — use CSS classes or data-* attributes
  • catch { throw; } — use when guard or let exceptions propagate
  • Gold-plating: ARIA, wrapper divs, accessibility features not requested
  • _ = InvokeAsync(...) — swallows exceptions; use async void + DispatchExceptionAsync

© dotnet, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 3 other files (references) in plugins/dotnet-blazor/skills/author-component of dotnet/skills.

  • SKILL.md
  • references/async-programming-rules.md
  • references/breaking-down-components.md
  • references/component-disposal.md

Open the folder on GitHubat commit 8d670fa

Used in 1 other repository

We found 2 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in dotnet/skills, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Blazor Component Author next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Blazor Component Author compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Blazor Component Author this skilldotnet/skills5.6k1 repos~830Automated safety check: PassMIT
C# and .NET DeveloperJeffallan/claude-skills12k—~1.3kAutomated safety check: PassMIT
Code Reviewdotnet/macios2.9k—~1.7kAutomated safety check: PassCustom licence
Code Reviewjonathanpeppers/dotnes780—~2.1kAutomated safety check: PassMIT
Tsp Csharpquerylenshq/ef-querylens225—~1.3kAutomated safety check: PassMIT
Akka.NET Best PracticesAaronontheweb/dotnet-skills1.2k1 repos~3.3kAutomated safety check: PassMIT

Similar skills

  • C# and .NET Developer

    Jeffallan/claude-skills

    Guides C# work on .NET 8+: ASP.NET Core APIs, Entity Framework Core data access, Blazor apps and CQRS with MediatR, following a five-step build workflow.

    12k GitHub stars~1.3k tokensUpdated 4 days ago
    Backend & APIsAuto-check passed

  • Code Review

    dotnet/macios

    Official

    Review dotnet/macios PRs against established rules. An agent skill from dotnet/macios.

    2.9k GitHub stars~1.7k tokensUpdated today
    DevelopmentAuto-check passed

  • Code Review

    jonathanpeppers/dotnes

    Review dotnes pull requests against established repository rules.

    780 GitHub stars~2.1k tokensUpdated 13 days ago
    DevelopmentAuto-check passed

  • Tsp Csharp

    querylenshq/ef-querylens

    Comprehensive C and .NET development skill for TSP projects.

    225 GitHub stars~1.3k tokensUpdated 1 mo ago
    Backend & APIsAuto-check passed

  • Akka.NET Best Practices

    Aaronontheweb/dotnet-skills

    Guidance for Akka.NET actor systems covering EventStream versus DistributedPubSub, supervision, Props versus DependencyResolver, work distribution and testable cluster code.

    1.2k GitHub starsUsed in 1 repo~3.3k tokens
    DevelopmentAuto-check passed

  • Dotnet10 Features

    runceel/ReactiveProperty

    Reference for the .NET 10 / C 14 features that are relevant to the ReactiveProperty repository.

    944 GitHub stars~2.7k tokensUpdated 1 mo ago
    DevelopmentAuto-check passed

More from dotnet/skills

All 91 skills in this repo

  • Apple Crash Log .NET Symbolication

    dotnet/skills

    Official

    Resolves .NET runtime frames in Apple .ips crash logs to function names, source files and line numbers using dSYM symbols, atos and the Microsoft symbol server.

    5.6k GitHub starsUsed in 1 repo~2.4k tokens
    Auto-check passed

  • Android Tombstone Symbolication

    dotnet/skills

    Official

    Resolves native crash frames from .NET Android tombstones to function names, source files and line numbers using BuildIds, Microsoft's symbol server and llvm-symbolizer.

    5.6k GitHub starsUsed in 1 repo~2.1k tokens
    Auto-check passed

  • Analyzing .NET Performance

    dotnet/skills

    Official

    Scans C# and .NET code for about 50 performance anti-patterns and reports prioritized findings with concrete fixes, at a scan depth you choose.

    5.6k GitHub starsUsed in 3 repos~3.1k tokens
    Auto-check passed

  • Find Untested Sources

    dotnet/skills

    Official

    Statically pairs source files with test files to list code that no test references, using Roslyn for C# or tree-sitter for many languages, with no build.

    5.6k GitHub starsUsed in 1 repo~3.3k tokens
    Auto-check passed

  • Microbenchmarking

    dotnet/skills

    Official

    Activate this skill when BenchmarkDotNet (BDN) is involved in the task — creating, running, configuring, or reviewing BDN benchmarks.

    5.6k GitHub starsUsed in 3 repos~3.3k tokens
    Auto-check passed

  • .NET Native AOT Compatibility

    dotnet/skills

    Official

    Makes .NET projects compatible with Native AOT and trimming by resolving IL trim and AOT analyzer warnings through annotations rather than suppressions.

    5.6k GitHub starsUsed in 2 repos~4.2k tokens
    Auto-check passed

Works with

Categories

Questions about Blazor Component Author

What does Blazor Component Author do?

Writes and reviews Blazor .razor components with correct parameters, EventCallback, lifecycle, async and disposal patterns, for components that need no JavaScript interop. The core rules are that data flows down through parameters and events flow up through EventCallback rather than Action or Func. Parameters are never mutated, so a copy goes into a private field in OnParametersSet, and the agent uses EditorRequired instead of required or init.

When should I use Blazor Component Author?

Blazor Component Author fits situations like: writing a new Blazor component with parameters and event callbacks; reviewing a .razor file for parameter mutation or missing disposal; adding debounce, polling or cancellation to a component without timers; deciding when to split a large component into code-behind and child components.

How do I install Blazor Component Author in Claude Code?

Run `npx skills add dotnet/skills --skill author-component -a claude-code`. Or copy the skill folder (plugins/dotnet-blazor/skills/author-component in dotnet/skills) into .claude/skills/author-component in your project. Claude Code loads it when a task matches its description.

How do I install Blazor Component Author in Codex?

Run `npx skills add dotnet/skills --skill author-component -a codex`. Or copy the skill folder (plugins/dotnet-blazor/skills/author-component in dotnet/skills) into .agents/skills/author-component in your project. Codex loads it when a task matches its description.

Can I use Blazor Component Author in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add dotnet/skills --skill author-component -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/author-component, .gemini/skills/author-component, .github/skills/author-component and .opencode/skills/author-component in your project.

What does Blazor Component Author need to run?

SKILL.md names no scripts, command-line tools or credentials: Blazor Component Author is instructions for the agent only. Our summary lists: A Blazor project on .NET.

Does Blazor Component Author access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Blazor Component Author safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Blazor Component Author use?

Blazor Component Author is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Blazor Component Author use?

About 830 tokens (SKILL.md is roughly 3.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 3.3k tokens, read only when the agent opens those files.

What are the alternatives to Blazor Component Author?

Skills that share tags, products or a category with Blazor Component Author: C# and .NET Developer (Jeffallan/claude-skills, 12k stars), Code Review (dotnet/macios, 2.9k stars), Code Review (jonathanpeppers/dotnes, 780 stars) and Tsp Csharp (querylenshq/ef-querylens, 225 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Blazor Component Author?

dotnet (a GitHub organization, an official publisher) maintains it in dotnet/skills, which has 5,568 GitHub stars. The repository holds 91 skills in this directory. The repository was last updated on October 7, 2026.

Source: dotnet/skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.