Agent skill

React Doctor

by makeplane in makeplane/plane

Scans React code for lint, accessibility, bundle size and architecture issues, reports a health score and checks that changes do not lower it.

AGPL-3.0Auto-check passedFrontend & Design

Install React Doctor

skills CLI
$ npx skills add makeplane/plane --skill react-doctor -a claude-code

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

GitHub CLI
$ gh skill install makeplane/plane react-doctor --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/makeplane/plane.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/skills/react-doctor .claude/skills/react-doctor && 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
react-doctor
GitHub stars
61k
Used in
12 other repos
Token cost
~657 tokens
SKILL.md length
256 words
Files
1
Skills in repo
5
Repo updated
First seen
Licence
AGPL-3.0

At a glance

Scans React code for lint, accessibility, bundle size and architecture issues, reports a health score and checks that changes do not lower it.

  • Finishing a React feature or bug fix before committing
  • SKILL.md covers After making React code changes:, For general cleanup or code…, /doctor — full local triage… and Configuring or explaining rules, plus 1 more section
  • Calls npx and curl; reaches react.doctor
  • Checking that a change did not lower the project's React health score

What it does

The skill runs react-doctor through npx to scan React codebases for security, performance, correctness and architecture problems and produce a health score from 0 to 100. After React code changes the agent runs it with --verbose and --diff, which scans only files changed against the base branch, and fixes any drop in the score before committing. For general cleanup it runs the scan without --diff and fixes issues by severity, errors first and then warnings.

A /doctor command starts a full local triage. The agent fetches a playbook from the react.doctor website with curl and follows a scan, filter, triage, fix and validate loop that edits the working tree but never commits or opens pull requests. Because the playbook is fetched at run time, its content can change without the skill being updated, and per-rule prompts are fetched on demand inside it.

To explain, tune or disable rules, a companion doctor-explain skill, also called /doctor-config, uses react-doctor's rules commands, which edit doctor.config or the reactDoctor section of package.json.

When your agent uses it

  • Finishing a React feature or bug fix before committing
  • Checking that a change did not lower the project's React health score
  • Running a full cleanup pass over a React codebase's diagnostics
  • Looking into or tuning a react-doctor rule

Example prompts

  • “I am done with the settings page. Run react doctor on my changes before I commit.”
  • “Run a full react-doctor triage of the whole codebase and fix errors first.”
  • “Why does react-doctor flag this component? Explain the rule and help me turn it off for this folder.”
  • “Scan the app and tell me the health score and the three worst issues.”

Requirements

  • npx, from Node.js
  • Network access, for the /doctor triage playbook

What it can do on your machine

Read from SKILL.md and the folder at commit 66c95bd. 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

    Shell commands in SKILL.md call:

    • npx
    • curl

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

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • react.doctor

    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

React Doctor loads about 657 tokens when it runs. Until then it costs about 82 tokens; SKILL.md has 256 words of instructions outside code blocks.

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

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 makeplane/plane at commit 66c95bd, republished under its AGPL-3.0 licence (© makeplane). 256 words, ~657 tokens.

Download SKILL.mdSave it as .claude/skills/react-doctor/SKILL.md (or your agent's skills folder).
name
react-doctor
description
Use when finishing a feature, fixing a bug, before committing React code, or when the user types `/doctor`, asks to scan, triage, or clean up React diagnostics. Covers lint, accessibility, bundle size, architecture. Includes a regression check and a full local-triage workflow that fetches the canonical playbook.
version
1.1.0

React Doctor

Scans React codebases for security, performance, correctness, and architecture issues. Outputs a 0–100 health score.

After making React code changes:

Run npx react-doctor@latest --verbose --diff and check the score did not regress.

If the score dropped, fix the regressions before committing.

For general cleanup or code improvement:

Run npx react-doctor@latest --verbose (without --diff) to scan the full codebase. Fix issues by severity — errors first, then warnings.

/doctor — full local triage workflow

When the user types /doctor, says "run react doctor", or asks for a full triage / cleanup pass (not just a regression check), fetch the canonical local-triage playbook and follow every step in it:

bash
curl --fail --silent --show-error \
  --header 'Cache-Control: no-cache' \
  https://www.react.doctor/prompts/react-doctor-agent.md

The playbook is the single source of truth — a scan → filter → triage → fix → validate loop that edits the working tree directly (never commits, never opens PRs). Updating the prompt at its source updates every agent on its next fetch — no skill reinstall needed.

Pair it with the matching per-rule prompts at https://www.react.doctor/prompts/rules/<plugin>/<rule>.md (fetched on demand inside the playbook) so each fix uses the canonical, reviewer-tested recipe.

Configuring or explaining rules

When the user wants to understand a rule, disagrees with one, or wants to disable / tune which rules run (not fix code), use the doctor-explain skill (alias /doctor-config). Start with npx react-doctor@latest rules explain <rule>, then apply the narrowest control via npx react-doctor@latest rules disable|set|category|ignore-tag …, which edits your doctor.config.* (or package.json#reactDoctor).

Command

bash
npx react-doctor@latest --verbose --diff
FlagPurpose
.Scan current directory
--verboseShow affected files and line numbers per rule
--diffOnly scan changed files vs base branch
--scoreOutput only the numeric score

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

Files

Just SKILL.md in .claude/skills/react-doctor of makeplane/plane.

Open the folder on GitHubat commit 66c95bd

Used in 12 other repositories

We found 19 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 12 other GitHub owners. This page covers the copy in makeplane/plane, which our catalogue first saw on October 7, 2026.

Compare with similar skills

React Doctor 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.

React Doctor compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
React Doctor this skillmakeplane/plane61k12 repos~657Automated safety check: PassAGPL-3.0
Best Practicestech-leads-club/agent-skills7k—~3.2kAutomated safety check: PassMIT
Frontend Engineer Workflownanocoai/nanoclaw31k—~1.5kAutomated safety check: PassMIT
Senior Frontendborghei/Claude-Skills881—~1.7kAutomated safety check: PassMIT
3D Web Experiencesmadebyaris/advance-minimax-m3-cursor-rules126—~3kAutomated safety check: PassMIT
Frontend Module Standardssiteboon/claudecodeui14k—~2.6kAutomated safety check: PassAGPL-3.0

Similar skills

  • Best Practices

    tech-leads-club/agent-skills

    Apply modern web development best practices for security, compatibility, and code quality.

    7k GitHub stars~3.2k tokensUpdated 17 days ago
    Frontend & DesignAuto-check passed
  • Sets a build, test and verify routine for web projects: write typed, accessible code and never call work done until it is checked in a real browser with screenshots.

    31k GitHub stars~1.5k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Senior Frontend

    borghei/Claude-Skills

    Frontend development for React, Next.js, TypeScript, and Tailwind CSS.

    881 GitHub stars~1.7k tokensUpdated today
    Frontend & DesignAuto-check passed
  • 3D Web Experiences

    madebyaris/advance-minimax-m3-cursor-rules

    Builds 3D web scenes with Three.js and React Three Fiber, with attention to art direction, a performance budget, mobile behavior and fallbacks.

    126 GitHub stars~3k tokensUpdated 3 mo ago
    Game DevelopmentAuto-check passed
  • Frontend Module Standards

    siteboon/claudecodeui

    Enforces one repository's React and TypeScript module layout for code under src/: source-root imports, feature barrels, deliberate exports and no deep imports.

    14k GitHub stars~2.6k tokensUpdated today
    Frontend & DesignAuto-check passed
  • React Frontend Development Guidelines

    diet103/claude-code-infrastructure-showcase

    Guidelines for React 18 and TypeScript apps covering Suspense data fetching, lazy loading, feature folders, MUI v7 styling, TanStack Router and performance.

    10k GitHub starsUsed in 2 repos~2.9k tokens
    Frontend & DesignAuto-check passed

More from makeplane/plane

  • Git Branch Naming

    makeplane/plane

    Names a new Git branch with a type prefix, the lowercased work item ID and a short kebab-case description, so the ID can be extracted later from the branch name.

    61k GitHub stars~594 tokensUpdated today
    Auto-check passed
  • Opens a pull request for the current branch using the repo's template, a work item ID in the title and a description filled in from the actual diff.

    61k GitHub stars~824 tokensUpdated today
    Auto-check passed
  • Plane UI Translation

    makeplane/plane

    Sets the rules for translating and updating Plane's UI strings across locales: do-not-translate terms, plural forms, placeholders and AI translation review.

    61k GitHub stars~16k tokensUpdated today
    Auto-check passed
  • Builds categorized release notes for a Plane release pull request from its commits and writes them into the PR description, for both the plane-cloud and plane-ee repos.

    61k GitHub stars~2.5k tokensUpdated today
    Auto-check passed

Works with

Questions about React Doctor

What does React Doctor do?

Scans React code for lint, accessibility, bundle size and architecture issues, reports a health score and checks that changes do not lower it. The skill runs react-doctor through npx to scan React codebases for security, performance, correctness and architecture problems and produce a health score from 0 to 100. After React code changes the agent runs it with --verbose and --diff, which scans only files changed against the base branch, and fixes any drop in the score before committing.

When should I use React Doctor?

React Doctor fits situations like: finishing a React feature or bug fix before committing; checking that a change did not lower the project's React health score; running a full cleanup pass over a React codebase's diagnostics; looking into or tuning a react-doctor rule.

How do I install React Doctor in Claude Code?

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

How do I install React Doctor in Codex?

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

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

What does React Doctor need to run?

Going by SKILL.md and its folder, React Doctor needs the command-line tools its instructions call (npx and curl). Our summary lists: npx, from Node.js; Network access, for the /doctor triage playbook.

Does React Doctor access the network?

SKILL.md names 1 domain. In commands or code: react.doctor; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is React Doctor 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 React Doctor use?

React Doctor is published under the AGPL-3.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does React Doctor use?

About 657 tokens (SKILL.md is roughly 2.6k 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 React Doctor?

Skills that share tags, products or a category with React Doctor: Best Practices (tech-leads-club/agent-skills, 7k stars), Frontend Engineer Workflow (nanocoai/nanoclaw, 31k stars), Senior Frontend (borghei/Claude-Skills, 881 stars) and 3D Web Experiences (madebyaris/advance-minimax-m3-cursor-rules, 126 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains React Doctor?

makeplane (a GitHub organization) maintains it in makeplane/plane, which has 60,513 GitHub stars. The repository holds 5 skills in this directory. The repository was last updated on October 7, 2026.

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