OpenUI를 기반으로 모델 답변을 대화형 지도, 차트, 폼, 실제로 작동하는 도구로 스트리밍해 표시하는 오픈소스 Next.js 데모입니다.
millionco/react-doctor
React 코드베이스의 상태, 성능, 보안, 접근성, 유지보수성 문제를 검사하는 CLI 및 에이전트 스킬입니다.
- 스타
- 15,016
- 포크
- 490
- 열린 이슈
- 314
- 마지막 커밋
- 6시간 전
어떤 프로젝트인가요?
React Doctor는 React 코드를 결정론적으로 검사해 상태와 effect, 성능, 아키텍처, 보안, 접근성, 유지보수성 문제를 보고하는 명령줄 도구입니다. Next.js, Vite, Astro, TanStack, React Native, Expo 기반 프로젝트에서 사용할 수 있으며, 프로젝트 루트에서 npx로 실행합니다.
일회성 검사 외에도 Claude Code, Cursor, Codex, OpenCode 같은 코딩 에이전트가 React 문제를 찾아 수정하도록 돕는 스킬을 설치할 수 있습니다. 또한 각 pull request를 검사하고 변경 사항으로 새로 발생한 문제만 보고하는 CI 모드도 제공합니다.
doctor.config.ts 파일에서 규칙을 설정해 개별 검사를 활성화하거나 비활성화할 수 있습니다. 실행 중인 React 앱의 특정 로컬 URL에서 Chrome DevTools 성능 트레이스를 기록하는 기능도 있습니다.
핵심 기능
- 01상태와 effect, 성능, 아키텍처, 보안, 접근성, 유지보수성을 검사합니다.
- 02Next.js, Vite, Astro, TanStack, React Native, Expo 프로젝트를 지원합니다.
- 03Claude Code, Cursor, Codex, OpenCode를 비롯한 코딩 에이전트용 스킬을 설치합니다.
- 04CI에서 실행해 각 pull request로 새로 발생한 문제만 보고합니다.
- 05doctor.config.ts를 통해 규칙을 설정할 수 있습니다.
- 06실행 중인 앱의 Chrome DevTools 성능 트레이스를 기록합니다.
활용 사례
- 병합 전에 React 코드베이스의 성능 및 상태 관련 버그를 찾아냅니다.
- 코딩 에이전트가 자신이 작성한 React 코드를 검사하고 수정하도록 합니다.
- CI에서 pull request를 검사해 새로운 React 문제를 조기에 발견합니다.
- 성능 트레이스를 기록해 로컬에서 실행 중인 React 앱을 프로파일링합니다.
빠른 시작
- 1
프로젝트 루트에서 스캔을 실행하세요
npx react-doctor@latest - 2
코딩 에이전트에 skill을 설치하세요
npx react-doctor@latest install
사용 전 알아둘 점
- CLI는 기본적으로 충돌 보고서와 익명 사용 데이터를 수집하며, 수집을 거부하려면 플래그를 지정해야 합니다.
- 저장소 메타데이터에는 라이선스가 NOASSERTION으로 표시되어 있지만 README에는 MIT라고 적혀 있습니다. 이에 의존하기 전에 라이선스 파일을 확인하세요.
토픽
자주 묻는 질문
- react-doctor은(는) 무엇인가요?
- React 코드베이스의 상태, 성능, 보안, 접근성, 유지보수성 문제를 검사하는 CLI 및 에이전트 스킬입니다. React Doctor는 React 코드를 결정론적으로 검사해 상태와 effect, 성능, 아키텍처, 보안, 접근성, 유지보수성 문제를 보고하는 명령줄 도구입니다. Next.js, Vite, Astro, TanStack, React Native, Expo 기반 프로젝트에서 사용할 수 있으며, 프로젝트 루트에서 npx로 실행합니다.
- react-doctor은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
- react-doctor은(는) Other 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
- react-doctor은(는) 아직 유지보수되고 있나요?
- 활발히 유지보수 중. react-doctor의 마지막 커밋은 2026년 10월 19일입니다.
- react-doctor은(는) 어디에 사용할 수 있나요?
- 병합 전에 React 코드베이스의 성능 및 상태 관련 버그를 찾아냅니다. 코딩 에이전트가 자신이 작성한 React 코드를 검사하고 수정하도록 합니다. CI에서 pull request를 검사해 새로운 React 문제를 조기에 발견합니다. 성능 트레이스를 기록해 로컬에서 실행 중인 React 앱을 프로파일링합니다.
- react-doctor는 어떻게 설치하나요?
- 프로젝트 루트에서 스캔을 실행하세요: npx react-doctor@latest 코딩 에이전트에 skill을 설치하세요: npx react-doctor@latest install
- react-doctor은(는) 어디서 받을 수 있나요?
- 소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/millionco/react-doctor
요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.
관련 프로젝트
AI 코딩 에이전트의 계획과 코드 변경 사항을 브라우저에서 검토하고 피드백을 전달하는 로컬 도구입니다.
접근성과 성능 지침이 내장된 React, Next.js, Svelte, Astro용 Motion.dev 애니메이션을 생성하는 Claude Code 스킬
Claude Code, Codex, OpenCode 같은 코딩 에이전트를 병렬 worktree에서 실행하고 조율하는 데스크톱·모바일·웹·CLI 앱입니다.
Material 3 Expressive 앱 화면을 스케치하고 AI 코딩 도구용 프롬프트로 변환하는 브라우저 스케치패드입니다.
Playwright로 웹사이트를 분석해 디자인 시스템을 Tailwind v4 설정, React 컴포넌트, 디자인 토큰 또는 DESIGN.md 보고서로 내보냅니다.