code-quality

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/**`

Review the $ARGUMENTS code for bugs, security problems, and performance issues. Be specific about what could go wrong.

변경된 코드의 웹 접근성(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 관점에서 성능 문제를 탐지하고 개선안을 제시합니다.

변경된 코드의 렌더링 성능 패턴을 read-only로 검증하는 에이전트. LCP, CLS, FCP, INP 관점에서 코드 패턴을 점검하여 체크리스트 리포트를 생성한다.

Security vulnerability detection and remediation specialist. Use PROACTIVELY after writing code that handles user input, authentication, API endpoints, or sensitive data. Flags secrets, SSRF, injection, unsafe crypto, and OWASP Top 10 vulnerabilities.

변경된 코드의 보안 취약점을 read-only로 검증하는 에이전트. OWASP Top 10, 시크릿 노출, 입력 검증, 인증/인가 패턴을 점검하여 체크리스트 리포트를 생성한다.

Use when refactoring Tailwind CSS class order in React/Next.js components, when className strings feel disorganized, or when establishing consistent CSS ordering conventions across a codebase