mcpField
R
react-doctor

react-doctor

github.com/blogic-czTesting & quality373 installsUpdated 1d ago
Repository

About react-doctor

A command-line diagnostic tool for React codebases, intended for developers assessing code health. It checks security, performance, correctness, architecture, and other areas, then supports a verify, fix, and rescan workflow.

Key features

  1. 0147+ diagnostic rules
  2. 02Security and correctness checks
  3. 03Performance and architecture checks
  4. 04Next.js and server action rules
  5. 05Score-based health summary

Use cases

  1. 01Audit a React codebase for issues
  2. 02Prioritize validated diagnostics for fixes
  3. 03Rescan after applying code changes
  4. 04Check for dead code and bundle concerns

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/blogic-cz/blogic-marketplace --skill react-doctor

After installing, type/react-doctorin Claude Code to confirm it loaded.

Details

From the project README

React Doctor

Use React Doctor to scan a React codebase for security, performance, correctness, and architecture issues. Use the diagnostics to prioritize fixes and improve overall code health.

Usage

npx -y react-doctor@latest . --verbose

Use @latest intentionally to run the newest rule set.

Workflow

  1. Run the command at the project root and capture the full output.
  2. Verify diagnostics before patching: confirm each reported issue against actual runtime behavior, project conventions, and framework constraints.
  3. Fix validated issues, starting with highest severity diagnostics.
  4. Re-run React Doctor and confirm the diagnostics list is reduced.
  5. Re-run project checks (lint, tests, typecheck/build as applicable) to ensure no regressions.

Rule Coverage (47+)

React Doctor includes 47+ rules. The categories below are representative examples, not an authoritative or exhaustive rule list.

  • Security: hardcoded secrets in client bundle, eval()
  • State & Effects: derived state in useEffect, missing cleanup, useState from props, cascading setState
  • Architecture: components inside components, giant components, inline render functions
  • Performance: layout property animations, transition-all, large blur values
  • Correctness: array index as key, conditional rendering bugs
  • Next.js (in projects using Next.js): missing metadata, client-side fetching for server data, async client components
  • Bundle Size: barrel imports, full lodash, moment.js, missing code splitting
  • Server Actions (in projects using Next.js): missing auth in server actions, blocking without after()
  • Accessibility: missing prefers-reduced-motion
  • Dead Code: unused files, exports, types

Score

  • 75+: Great
  • 50-74: Needs work
  • 0-49: Critical

Comments

Markdown supported