Official agent skill

Write

A skill your agent uses when creating new React documentation pages or updating existing ones.

OfficialCC-BY-4.0Auto-check passedAgent Workflows

Install Write

skills CLI

$ npx skills add reactjs/ar.react.dev --skill write -a claude-code

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

GitHub CLI

$ gh skill install reactjs/ar.react.dev write --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/reactjs/ar.react.dev.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/skills/write .claude/skills/write && 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/

Paste into Claude Code

Install the "write" agent skill from https://github.com/reactjs/ar.react.dev/tree/main/.claude/skills/write into .claude/skills/write/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "write", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/reactjs/ar.react.dev/tree/main/.claude/skills/write

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add reactjs/ar.react.dev --skill write -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install reactjs/ar.react.dev write --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/reactjs/ar.react.dev.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.claude/skills/write .agents/skills/write && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "write" agent skill from https://github.com/reactjs/ar.react.dev/tree/main/.claude/skills/write into .agents/skills/write/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "write", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add reactjs/ar.react.dev --skill write -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install reactjs/ar.react.dev write --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/reactjs/ar.react.dev.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.claude/skills/write .cursor/skills/write && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "write" agent skill from https://github.com/reactjs/ar.react.dev/tree/main/.claude/skills/write into .cursor/skills/write/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "write", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/reactjs/ar.react.dev.git --path .claude/skills/write

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add reactjs/ar.react.dev --skill write -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install reactjs/ar.react.dev write --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/reactjs/ar.react.dev.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.claude/skills/write .gemini/skills/write && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "write" agent skill from https://github.com/reactjs/ar.react.dev/tree/main/.claude/skills/write into .gemini/skills/write/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "write", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install reactjs/ar.react.dev write

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add reactjs/ar.react.dev --skill write -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/reactjs/ar.react.dev.git skills-src && mkdir -p .github/skills && cp -r skills-src/.claude/skills/write .github/skills/write && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "write" agent skill from https://github.com/reactjs/ar.react.dev/tree/main/.claude/skills/write into .github/skills/write/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "write", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add reactjs/ar.react.dev --skill write -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install reactjs/ar.react.dev write --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/reactjs/ar.react.dev.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.claude/skills/write .opencode/skills/write && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "write" agent skill from https://github.com/reactjs/ar.react.dev/tree/main/.claude/skills/write into .opencode/skills/write/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "write", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: write
GitHub stars: 164
Token cost: ~1.6k tokens
SKILL.md length: 450 words
Files: 2
Skills in repo: 10
Repo updated: Oct 5, 2026
First seen: Oct 7, 2026
Licence: CC-BY-4.0

At a glance

A skill your agent uses when creating new React documentation pages or updating existing ones.

Works in 6 steps: Parse Intent → Research (Parallel Agents) → Synthesize Writing Plan → …
Creating new React documentation pages
SKILL.md covers Invocation, Workflow and Important Rules
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Write is an agent skill from reactjs/ar.react.dev, published by the product's own GitHub organization. Use when creating new React documentation pages or updating existing ones. Accepts instructions like "add optimisticKey reference docs", "update ViewTransition with Activity", or "transition learn docs".

Its SKILL.md is about 1.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files.

It sits in Agent Workflows. It works with React. The repository describes itself as: React documentation website in Arabic 📘⚛️ — وثائق React باللغة العربية. The licence is CC-BY-4.0.

When your agent uses it

Creating new React documentation pages
Updating existing ones

Example prompts

“add optimisticKey reference docs”
“update ViewTransition with Activity”
“transition learn docs”
“/write”

Workflow steps

6 steps, taken from the step headings in SKILL.md.

Parse Intent
Research (Parallel Agents)
Synthesize Writing Plan
Write Documentation
Review Documentation
Fix Issues

What it can do on your machine

Read from SKILL.md and the folder at commit 2da48d6. 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 dot).
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

Write loads about 1.6k tokens when it runs. Until then it costs about 52 tokens; SKILL.md has 450 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~52
When it runs · the whole SKILL.md, loaded when a task matches: ~1.6k

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 reactjs/ar.react.dev at commit 2da48d6, republished under its CC-BY-4.0 licence (© reactjs). 450 words, ~1,580 tokens.

Download SKILL.mdSave it as .claude/skills/write/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.

name: write
description: Use when creating new React documentation pages or updating existing ones. Accepts instructions like "add optimisticKey reference docs", "update ViewTransition with Activity", or "transition learn docs".

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

dot

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:

Field	How to determine
Action	"add"/"create"/"new" = new page; "update"/"edit"/"with" = modify existing
Topic	The 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 file	For 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:

Page type (from docs-writer-reference decision tree or learn/blog type)
File path for the new or updated file
Outline with section headings matching the appropriate template
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)
Navigation changes needed (sidebar JSON updates)

Present this plan to the user and confirm before proceeding.

Show full SKILL.md (189 more words)Show less

Step 4: Write Documentation

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

The agent prompt MUST include:

The full writing plan from Step 3
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
An instruction to invoke /docs-components for MDX component patterns
An instruction to invoke /docs-sandpack if adding interactive code examples
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:

Present the review checklist to the user
Fix the issues identified
Re-run /review-docs on the fixed files
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.

Files

SKILL.md and 1 other file in .claude/skills/write of reactjs/ar.react.dev.

SKILL.md
diagrams/write_flow.svg

Open the folder on GitHubat commit 2da48d6

Used in 3 other repositories

We found 3 copies of this SKILL.md (exact, near-identical or edited) in other folders. This page covers the copy in reactjs/ar.react.dev, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Write 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.

Write compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Write this skillreactjs/ar.react.dev	164	—	~1.6k	Automated safety check: Pass	CC-BY-4.0	2 days ago
MCP Server Builder with mcp-usemcp-use/mcp-use	11k	—	~923	Automated safety check: Pass	Apache-2.0	today
Manage Skills Hubqufei1993/skills-hub	1.7k	—	~3.2k	Automated safety check: Pass	MIT	today
Plate Plugin Creatorudecode/plate	17k	—	~2.3k	Automated safety check: Pass	Custom licence	today
Chatgpt App Builderalpic-ai/skybridge	2.1k	—	~1k	Automated safety check: Pass	MIT	yesterday
Spec Driven Developzhu1090093659/deepseek-pp	1.9k	—	~6.9k	Automated safety check: Pass	Apache-2.0	1 mo ago

Similar skills

MCP Server Builder with mcp-use
mcp-use/mcp-use
Builds, modifies, debugs, migrates and verifies TypeScript MCP servers and MCP Apps with the mcp-use framework, treating the installed package's types as the source of truth.
11k GitHub stars~923 tokensUpdated today
Agent WorkflowsAuto-check passed
Manage Skills Hub
qufei1993/skills-hub
A skill your agent uses whenever an Agent needs to query, find, install, deploy, update, tag, adopt, diagnose, or safely remove Skills Hub content, including natural-language requests to manage…
1.7k GitHub stars~3.2k tokensUpdated today
Agent WorkflowsAuto-check passed
Plate Plugin Creator
udecode/plate
Build new Plate plugins with Slate-first architecture, sane typing, and explicit React/Plate wrapper boundaries.
17k GitHub stars~2.3k tokensUpdated today
Agent WorkflowsAuto-check passed
Chatgpt App Builder
alpic-ai/skybridge
Guide developers through creating and updating ChatGPT plugins.
2.1k GitHub stars~1k tokensUpdated yesterday
Agent WorkflowsAuto-check passed
Spec Driven Develop
zhu1090093659/deepseek-pp
Automates pre-development workflow for large-scale complex tasks.
1.9k GitHub stars~6.9k tokensUpdated 1 mo ago
Agent WorkflowsAuto-check passed
Commonly
Team-Commonly/commonly
You are a member of a Commonly workspace — a shared space where humans and AI agents from any origin collaborate in pods (chat rooms with memory).
1.4k GitHub stars~2.9k tokensUpdated today
Agent WorkflowsAuto-check passed

Questions about Write

What does Write do?

A skill your agent uses when creating new React documentation pages or updating existing ones. dev, published by the product's own GitHub organization. Use when creating new React documentation pages or updating existing ones.

When should I use Write?

Write fits situations like: creating new React documentation pages; updating existing ones.

How do I install Write in Claude Code?

Run `npx skills add reactjs/ar.react.dev --skill write -a claude-code`. Or copy the skill folder (.claude/skills/write in reactjs/ar.react.dev) into .claude/skills/write in your project. Claude Code loads it when a task matches its description.

How do I install Write in Codex?

Run `npx skills add reactjs/ar.react.dev --skill write -a codex`. Or copy the skill folder (.claude/skills/write in reactjs/ar.react.dev) into .agents/skills/write in your project. Codex loads it when a task matches its description.

Can I use Write 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 reactjs/ar.react.dev --skill write -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/write, .gemini/skills/write, .github/skills/write and .opencode/skills/write in your project.

What does Write need to run?

SKILL.md names no scripts, command-line tools or credentials: Write is instructions for the agent only.

Does Write 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 Write 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 Write use?

Write is published under the CC-BY-4.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Write use?

About 1.6k tokens (SKILL.md is roughly 6.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Write?

Skills that share tags, products or a category with Write: MCP Server Builder with mcp-use (mcp-use/mcp-use, 11k stars), Manage Skills Hub (qufei1993/skills-hub, 1.7k stars), Plate Plugin Creator (udecode/plate, 17k stars) and Chatgpt App Builder (alpic-ai/skybridge, 2.1k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Write?

reactjs (a GitHub organization, an official publisher) maintains it in reactjs/ar.react.dev, which has 164 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on October 5, 2026.

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

Install Write

Facts

At a glance

What it does

When your agent uses it

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Documentation Writer

Invocation

Workflow

Step 1: Parse Intent

Step 2: Research (Parallel Agents)

Agent 1: React Expert Research

Agent 2: Existing Docs Audit

Agent 3: Use Case Research

Step 3: Synthesize Writing Plan

Step 4: Write Documentation

Step 5: Review Documentation

Step 6: Fix Issues

Important Rules

Files

Used in 3 other repositories

Compare with similar skills

Similar skills

More from reactjs/ar.react.dev

Related

Questions about Write