By window-ook
코드 품질 도구 번들: Tailwind CSS 클린업, security/performance/a11y 리뷰 에이전트, convention/architecture 검증, 리팩토링 커맨드, 코딩 룰
src: `@lib/apiPaths.ts`
src: `@/app/globals.css`
Look through the $ARGUMENTS files and clean up any leftover debug logs, annotation(`//`) in function, commented code, or unused imports.
$ARGUMENTS
`@components/**`
변경된 코드의 웹 접근성(a11y)을 read-only로 검증하는 에이전트. 시맨틱 HTML, ARIA 속성, 키보드 접근성, 색상/콘트라스트 패턴을 점검하여 체크리스트 리포트를 생성한다.
Use this agent when you need to review recently written code for adherence to best practices, architectural consistency, and system integration. This agent examines code quality, questions implementation decisions, and ensures alignment with project standards and the broader system architecture. Examples: <example> Context: The user has just implemented a new API endpoint and wants to ensure it follows project patterns. user: "I've added a new workflow status endpoint to the form service" assistant: "I'll review your new endpoint implementation using the code-architecture-reviewer agent" <commentary> Since new code was written that needs review for best practices and system integration, use the Task tool to launch the code-architecture-reviewer agent. </commentary> </example> <example> Context: The user has created a new React component and wants feedback on the implementation. user: "I've finished implementing the WorkflowStepCard component" assistant: "Let me use the code-architecture-reviewer agent to review your WorkflowStepCard implementation" <commentary> The user has completed a component that should be reviewed for React best practices and project patterns. </commentary> </example> <example> Context: The user has refactored a service class and wants to ensure it still fits well within the system. user: "I've refactored the AuthenticationService to use the new token validation approach" assistant: "I'll have the code-architecture-reviewer agent examine your AuthenticationService refactoring" <commentary> A refactoring has been done that needs review for architectural consistency and system integration. </commentary> </example>
Use this agent when you need to refactor code for better organization, cleaner architecture, or improved maintainability. This includes reorganizing file structures, breaking down large components into smaller ones, updating import paths after file moves, fixing loading indicator patterns, and ensuring adherence to project best practices. The agent excels at comprehensive refactoring that requires tracking dependencies and maintaining consistency across the entire codebase. <example> Context: The user wants to reorganize a messy component structure with large files and poor organization. user: "This components folder is a mess with huge files. Can you help refactor it?" assistant: "I'll use the code-refactor-master agent to analyze the component structure and create a better organization scheme." <commentary> Since the user needs help with refactoring and reorganizing components, use the code-refactor-master agent to analyze the current structure and propose improvements. </commentary> </example> <example> Context: The user has identified multiple components using early returns with loading indicators instead of proper loading components. user: "I noticed we have loading returns scattered everywhere instead of using LoadingOverlay" assistant: "Let me use the code-refactor-master agent to find all instances of early return loading patterns and refactor them to use the proper loading components." <commentary> The user has identified a pattern that violates best practices, so use the code-refactor-master agent to systematically find and fix all occurrences. </commentary> </example> <example> Context: The user wants to break down a large component file into smaller, more manageable pieces. user: "The Dashboard.tsx file is over 2000 lines and becoming unmaintainable" assistant: "I'll use the code-refactor-master agent to analyze the Dashboard component and extract it into smaller, focused components." <commentary> The user needs help breaking down a large component, which requires careful analysis of dependencies and proper extraction - perfect for the code-refactor-master agent. </commentary> </example>
프로젝트 코드 컨벤션(CLAUDE.md, 디렉토리 구조, 스타일 패턴) 준수 여부를 엄격하게 검증하는 에이전트. 구현 완료 후 컨벤션 위반을 찾아 체크리스트 리포트를 생성한다.
Next.js/React 렌더링 성능 리뷰 전문가. 코드 리뷰 및 기존 서비스 성능 점검 시 사용. LCP, CLS, FCP, INP 관점에서 성능 문제를 탐지하고 개선안을 제시합니다.
Uses power tools
Uses Bash, Write, or Edit tools
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 claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
클로드 코드로 워크플로우 자동화 & 단순화를 고민하며 여러가지 시도를 하고 있습니다.
프로젝트에서 사용하고 있는 에이전트/커맨드/스킬/룰/문서/훅 스크립트를 업데이트하고 있습니다!
/plugin marketplace add https://github.com/window-ook/claude-code-lab
CLI에서 직접 설치:
개별 스킬 16개 + 번들 4개, 총 20개 플러그인을 제공합니다.
/plugin install zustand@claude-code-lab
또는 /plugin → Marketplaces 탭 → Browse plugins → 원하는 플러그인 선택 후 Install
특정 워크플로우를 자동화하기 위해 만든 skill입니다.
특정 반복적 & 병렬 가능 업무에 특화된 sub-agent입니다.
클로드가 컨텍스트로 참고할 지침을 세분화 해둔 rule입니다.
자주 사용하는 프롬프트를 작은 단위로 분리한 command입니다.
다양한 주제의 클로드 코드 관련 문서입니다.
ex) docs/best-practices/** -> 여러 상황에서 발견한 베스트 프랙티스
특정 이벤트 발생 시 자동으로 실행되는 훅 스크립트입니다.
© 2026 github.com/window-ook/claude-code-lab
npx claudepluginhub window-ook/claude-code-lab --plugin code-qualityValidation and quality enforcement for Tailwind CSS projects with comprehensive utility-first CSS patterns and best practices.
Find unused CSS and consolidate stylesheets
A caring skill pack for vibe coders. Encodes engineering discipline — refactor verification, minimal security audit, repo rot detection, AI-friendly docs, CI/CD basics, secrets lifecycle, project conventions, repo bloat diagnosis, and design-system unification — as a set of portable agent skills.
Expert code review specialist. Proactively reviews code for quality, security, and maintainability. Use immediately after writing or modifying code.
24 parallel audit agents + 6 workflow skills for Claude Code. Complete E2E development workflow for solo devs.
Curator - Ancient guardian of code excellence. Orchestrates 5 quality gates (Static Analysis, Test Coverage, Security Scanning, Complexity Analysis, Dependency Health) in a unified flow. Ensures pristine code through Forerunner precision and automated enforcement.
코드 플로우 시각화 인터랙티브 웹 리포트 생성
Next.js 16 App Router 개발 가이드. params Promise, Server/Client Components, Cache Components, Proxy 패턴
Feature-Sliced Design(FSD) 아키텍처 방법론 가이드. 레이어/슬라이스/세그먼트 설계, 의존성 규칙, Public API 패턴
React/Next.js 성능 최적화 가이드. 워터폴 제거, 번들 최적화, 렌더링 개선
Figma 디자인-투-코드 자동화 번들: 디자인 분석, 구현 계획, 참조 기반 계획, 실행 스킬 및 Figma MCP 통합