
React Doctor
FreeEnsure your React code is healthy and performant.
Free · Opens the source repo
What React Doctor does
React Doctor is a tool designed to analyze and improve the health of React codebases by identifying security, performance, correctness, and architectural issues. It provides a comprehensive health score ranging from 0 to 100, which helps developers understand the overall quality of their code after changes have been made. This skill is particularly useful for developers who want to maintain high standards in their React applications, ensuring that they are not only functional but also efficient and secure.
When finishing a feature or fixing a bug, React Doctor allows users to run a simple command to check for regressions in their code. By executing npx react-doctor@latest --verbose --scope changed, developers can quickly verify if their changes have negatively impacted the health score. If the score has dropped, it prompts users to address the identified issues before committing their code, thus promoting better coding practices and reducing the likelihood of introducing bugs into the main branch.
In addition to regression checks, React Doctor offers a full codebase scan with npx react-doctor@latest --verbose, which evaluates the entire project for issues categorized by severity. Developers can tackle errors first, followed by warnings, making it easier to prioritize fixes. For a more focused audit, users can run a design-specific check to ensure compliance with UI design standards, covering aspects like accessibility and interaction rules.
The /doctor command initiates a complete local triage workflow, guiding users through a structured process to scan, filter, triage, fix, and validate their code. This ensures that developers can systematically address issues while leveraging a canonical playbook that is kept up to date. Overall, React Doctor is an essential tool for any React developer looking to maintain code quality and ensure robust application performance.
When to use it
Use React Doctor after making changes to your React code to ensure no new issues have been introduced and to maintain a high quality of code.
When not to use it
This tool may not be suitable for non-React projects or for users who do not require detailed diagnostics and scoring of their code quality.
What you can build with it
Post-Feature Check
After implementing a new feature, run React Doctor to ensure no regressions have been introduced.
Code Cleanup
Use React Doctor to scan the entire codebase for issues and prioritize fixes based on severity.
Design Compliance Audit
Run a focused design audit to ensure your UI adheres to accessibility and interaction standards.
How to install React Doctor
View source1. Install with the skills CLI
npx skills add millionco/react-doctor/react-doctor --agent claude-code2. Or install it manually
Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.
Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs
Inside SKILL.md
Written by millioncoReact 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 --scope changed 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 (the default --scope full) to scan the full codebase. Fix issues by severity — errors first, then warnings.
For a focused UI design audit:
Run npx react-doctor@latest design --verbose. This selects only design-tagged UI composition, typography, interaction, accessibility, and motion rules, including focused rules that remain opt-in during a general health scan.
/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:
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), read references/explain.md and follow it. 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
npx react-doctor@latest --verbose --scope changed
| Flag | Purpose |
|---|---|
. | Scan current directory |
--verbose | Show affected files and line numbers per rule |
--scope changed | Only report issues introduced vs the base branch (default: full) |
--scope lines | Only report issues on the changed lines |
--score | Output only the numeric score |
design | Run only the focused UI design diagnostics |
Frequently asked questions about React Doctor
Similar skills
Quality Playbook Generator
Run comprehensive quality audits on any codebase.
PR Draft Summary
Automate PR summary generation for openai-agents-python.
Final Release Review
Streamline your release candidate audits with ease.
Unit Test Vue Pinia
Efficiently write and review unit tests for Vue 3 applications.
Slang Shader Expert
Optimize and integrate Slang shaders with ease.
Telemetry Standards
Ensure consistent event tracking in Supabase Studio.
