Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
reactjs avatar

Write

reactjs/react.dev

  • 50 installs
  • 11.8k repo stars
  • Updated July 31, 2026
  • reactjs/react.dev

Helps with ai & agent building tasks.

About

write is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.

  • write
  • AI & Agent Building
  • AI-coding skill

Write by the numbers

  • 50 all-time installs (skills.sh)
  • +3 installs in the week ending Aug 4, 2026 (Skillselion tracking)
  • Ranked #7,298 of 16,546 AI & Agent Building skills by installs in the Skillselion catalog
  • Data as of Aug 5, 2026 (Skillselion catalog sync)
npx skills add https://github.com/reactjs/react.dev --skill write

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs50
repo stars★ 11.8k
Last updatedJuly 31, 2026
Repositoryreactjs/react.dev ↗

What it does

Helps with ai & agent building tasks.

Files

SKILL.mdMarkdownGitHub ↗

Documentation Writer

Orchestrates research, writing, and review for React documentation.

Invocation

/write add optimisticKey              → creates new reference docs
/write update ViewTransition Activity → updates ViewTransition docs to cover Activity
/write transition learn docs          → creates new learn docs for transitions
/write blog post for React 20         → creates a new blog post

Workflow

digraph write_flow {
    rankdir=TB;
    "Parse intent" [shape=box];
    "Research (parallel)" [shape=box];
    "Synthesize plan" [shape=box];
    "Write docs" [shape=box];
    "Review docs" [shape=box];
    "Issues found?" [shape=diamond];
    "Done" [shape=doublecircle];

    "Parse intent" -> "Research (parallel)";
    "Research (parallel)" -> "Synthesize plan";
    "Synthesize plan" -> "Write docs";
    "Write docs" -> "Review docs";
    "Review docs" -> "Issues found?";
    "Issues found?" -> "Write docs" [label="yes - fix"];
    "Issues found?" -> "Done" [label="no"];
}

Step 1: Parse Intent

Determine from the user's instruction:

FieldHow to determine
Action"add"/"create"/"new" = new page; "update"/"edit"/"with" = modify existing
TopicThe React API or concept (e.g., optimisticKey, ViewTransition, transitions)
Doc type"reference" (default for APIs/hooks/components), "learn" (for concepts/guides), "blog" (for announcements)
Target fileFor updates: find existing file in src/content/. For new: determine path from doc type

If the intent is ambiguous, ask the user to clarify before proceeding.

Step 2: Research (Parallel Agents)

Spawn these agents in parallel:

Agent 1: React Expert Research

Use a Task agent (subagent_type: general-purpose) to invoke /react-expert <topic>. This researches the React source code, tests, PRs, issues, and type signatures.

Prompt:

Invoke the /react-expert skill for <TOPIC>. Follow the skill's full workflow:
setup the React repo, dispatch all 6 research agents in parallel, synthesize
results, and save to .claude/research/<topic>.md. Return the full research document.
Agent 2: Existing Docs Audit

Use a Task agent (subagent_type: Explore) to find and read existing documentation for the topic.

Prompt:

Find all existing documentation related to <TOPIC> in this repo:
1. Search src/content/ for files mentioning <TOPIC>
2. Read any matching files fully
3. For updates: identify what sections exist and what's missing
4. For new pages: identify related pages to understand linking/cross-references
5. Check src/sidebarLearn.json and src/sidebarReference.json for navigation placement

Return: list of existing files with summaries, navigation structure, and gaps.
Agent 3: Use Case Research

Use a Task agent (subagent_type: general-purpose) with web search to find common use cases and patterns.

Prompt:

Search the web for common use cases and patterns for React's <TOPIC>.
Focus on:
1. Real-world usage patterns developers actually need
2. Common mistakes or confusion points
3. Migration patterns (if replacing an older API)
4. Framework integration patterns (Next.js, Remix, etc.)

Return a summary of the top 5-8 use cases with brief code sketches.
Do NOT search Stack Overflow. Focus on official docs, GitHub discussions,
and high-quality technical blogs.

Step 3: Synthesize Writing Plan

After all research agents complete, create a writing plan that includes:

1. Page type (from docs-writer-reference decision tree or learn/blog type) 2. File path for the new or updated file 3. Outline with section headings matching the appropriate template 4. Content notes for each section, drawn from research:

  • API signature and parameters (from react-expert types)
  • Usage examples (from react-expert tests + use case research)
  • Caveats and pitfalls (from react-expert warnings/errors/issues)
  • Cross-references to related pages (from docs audit)

5. Navigation changes needed (sidebar JSON updates)

Present this plan to the user and confirm before proceeding.

Step 4: Write Documentation

Dispatch a Task agent (subagent_type: general-purpose) to write the documentation.

The agent prompt MUST include:

1. The full writing plan from Step 3 2. An instruction to invoke the appropriate skill:

  • /docs-writer-reference for reference pages
  • /docs-writer-learn for learn pages
  • /docs-writer-blog for blog posts

3. An instruction to invoke /docs-components for MDX component patterns 4. An instruction to invoke /docs-sandpack if adding interactive code examples 5. The research document content (key findings, not the full dump)

Prompt template:

You are writing React documentation. Follow these steps:

1. Invoke /docs-writer-<TYPE> to load the page template and conventions
2. Invoke /docs-components to load MDX component patterns
3. Invoke /docs-sandpack if you need interactive code examples
4. Write the documentation following the plan below

PLAN:
<writing plan from Step 3>

RESEARCH FINDINGS:
<key findings from Step 2 agents>

Write the file to: <target file path>
Also update <sidebar JSON> if adding a new page.

Step 5: Review Documentation

Invoke /review-docs on the written files. This dispatches parallel review agents checking:

  • Structure compliance (docs-writer-*)
  • Voice and style (docs-voice)
  • Component usage (docs-components)
  • Sandpack patterns (docs-sandpack)

Step 6: Fix Issues

If the review finds issues: 1. Present the review checklist to the user 2. Fix the issues identified 3. Re-run /review-docs on the fixed files 4. Repeat until clean

Important Rules

  • Always research before writing. Never write docs from LLM knowledge alone.
  • Always confirm the plan with the user before writing.
  • Always review with /review-docs after writing.
  • Match existing patterns. Read neighboring docs to match style and depth.
  • Update navigation. New pages need sidebar entries.

Related skills

mattpocockSetup Matt Pocock SkillsScaffold the per-repo configuration that Matt Pocock’s engineering agent skills rely on so they understand the issue tracker, triage labels, and domain documentation la495k196kopen.feishu.cnLark AppsConnect Claude, Cursor or custom agents directly to Lark (Feishu) for messaging, document automation, approval workflows and enterprise data access.402kjuliusbrusseeCavemanSlash token usage by roughly 75% while keeping every technical detail intact when working with Claude Code, Cursor or similar agents.391k94.7klarksuiteLark Skill MakerQuickly turn any Lark/Feishu OpenAPI call or multi-step workflow into a reusable agent skill with its own SKILL.md.386k16kxixu-meRunning Claude Code Via Litellm CopilotRun Claude Code at a fraction of the cost by routing requests through LiteLLM to the GitHub Copilot Chat API.270k72runcomfy-comCodex PetGenerate a complete Codex Pet spritesheet and metadata from one reference image without needing an OpenAI key or Codex Pro.246k10
AI & Agent Buildingagents
Browse by category
AI & AgentsFrontend & DesignBackend & DataDev ToolsAutomationTesting & ReviewSecurityMonitoring & CloudDocs & Planning
Design & frontend
Design systemsAnimation & motionAccessibility (a11y)CSS & TailwindUI designUXDesign to codeshadcn/uiLanding pagesBest design skills
Most searched skills
find-skillscavemanfrontend-designbrainstormingsystematic-debuggingstop-slopemil-design-engui-ux-pro-maxkarpathy-guidelinesweb-design-guidelinesreact-best-practicesgrill-meimprovemicrosoft-foundryagent-browser
Browse all listings
All agent skillsAll MCP serversAll marketplacesAll plugins

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.