React/Next.js 개발 워크플로우 자동화 — Vercel 성능 규칙 기반 Agent, Skill, Hook 모음
새 프로젝트에 CLAUDE.md와 settings.json 자동 생성
React/Next.js 프로젝트를 Vercel 베스트 프랙티스 기준으로 종합 분석하는 스웜 팀을 실행합니다.
compact/세션전환 후 작업 맥락 완전 복원
PreCompact 훅 스크립트를 글로벌 위치에 설치
이 프로젝트에 Supabase + Shadcn MCP 서버를 안전하게 설정합니다.
React 컴포지션 패턴 분석 에이전트. Vercel의 Compound Component, Provider 패턴, React 19 API 규칙을 기준으로 컴포넌트 구조를 분석합니다. 스웜 팀의 아키텍처 분석 담당.
React/Next.js 성능 최적화 분석 에이전트. Vercel의 57개 규칙(워터폴 제거, 번들 최적화, SSR, 리렌더 방지 등)을 기준으로 코드를 분석합니다. 스웜 팀의 성능 분석 담당.
웹 인터페이스 가이드라인 준수 여부를 감사하는 에이전트. Vercel의 Web Interface Guidelines를 기준으로 접근성, UX, 디자인 패턴을 분석합니다. 스웜 팀의 UI/UX 감사 담당.
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
Vercel 배포 전 전체 검증을 실행합니다. 타입체크, lint, 빌드 테스트, 환경변수 확인, Prisma 동기화를 순차적으로 수행합니다.
Pre-push 검증에 필요한 시크릿 패턴, 코드 품질 기준, 프로젝트별 예외 규칙 도메인 지식
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
Supabase 데이터베이스와 Prisma 스키마의 동기화 상태를 확인합니다. 테이블 목록 비교, RLS 정책 확인, 보안/성능 어드바이저 실행을 수행합니다.
Uses power tools
Uses Bash, Write, or Edit tools
React/Next.js 개발 워크플로우를 위한 Claude Code 플러그인. Vercel Engineering 규칙 기반 Agent, Skill, Hook 모음.
claude
/plugin install https://github.com/michaelcho000/claude-dev-toolkit
| Agent | 역할 |
|---|---|
composition-reviewer | React 컴포지션 패턴 분석 (Compound Component, Provider, React 19) |
react-perf-analyzer | React 성능 최적화 분석 (Vercel 57개 규칙) |
ui-ux-auditor | UI/UX 감사 (Web Interface Guidelines) |
| Skill | 설명 |
|---|---|
composition-patterns | Vercel React 컴포지션 패턴 규칙 (8 카테고리, 7 규칙) |
react-best-practices | 57개 React/Next.js 성능 최적화 규칙 |
web-design-guidelines | Web Interface Guidelines 준수 리뷰 |
pre-deploy | Vercel 배포 전 검증 (tsc, lint, build) |
pre-push-checklist | Git push 전 시크릿/코드 품질 검증 |
sync-db | Supabase-Prisma 동기화 확인 |
| Command | 설명 |
|---|---|
/claude-dev-toolkit:init-project | 새 프로젝트 초기 세팅 (CLAUDE.md + settings.json 생성) |
/claude-dev-toolkit:setup-mcp | Supabase+Shadcn MCP 보안 연결 |
/claude-dev-toolkit:setup-hooks | PreCompact 훅 글로벌 설치 |
/claude-dev-toolkit:restore-context | compact 후 작업 맥락 복원 |
/claude-dev-toolkit:react-optimize | React 성능 최적화 스웜 분석 |
/claude-dev-toolkit:theme-analysis | 테마/디자인 시스템 분석 |
| Hook | 트리거 | 동작 |
|---|---|---|
| PreCompact | compact 전 | 세션 맥락을 memory/current-task.md에 자동 백업 |
1. /plugin install (이 플러그인)
2. /claude-dev-toolkit:setup-hooks — 최초 1회, PreCompact 훅 설치
3. /claude-dev-toolkit:init-project — CLAUDE.md + settings.json 생성
4. /claude-dev-toolkit:setup-mcp — DB 연결 (필요 시)
Windows (Git Bash)와 macOS 모두 지원.
MIT
Based on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
npx claudepluginhub michaelcho000/claude-dev-toolkitMulti-model consensus engine integrating OpenAI Codex CLI, Gemini CLI, and Claude CLI for collaborative code review and problem-solving.
Ultra-compressed communication mode. Cuts ~75% of tokens while keeping full technical accuracy by speaking like a caveman.
Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
Curate auto-memory, promote learnings to CLAUDE.md and rules, extract proven patterns into reusable skills.
Memory compression system for Claude Code - persist context across sessions
Standalone image generation plugin using Nano Banana MCP server. Generates and edits images, icons, diagrams, patterns, and visual assets via Gemini image models. No Gemini CLI dependency required.
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claim