메뉴
대시보드 및 통계 차트 컴포넌트 추가 시 준수해야 할 UI 레이아웃, 컬러 통일성 및 필터 컨트롤 패턴
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
프로젝트 구조와 네이밍 컨벤션에 맞게 새 React 컴포넌트를 추가하는 가이드
PDF(인쇄 레이아웃) 및 Excel(xlsx 동적 로딩) 파일 내보내기 구현 및 갱신 패턴 가이드
Gemini 3.1 Flash Lite API를 사용한 계기판 OCR 및 증빙 서류 AI 판별 연동 패턴 가이드
Sentry에 잡힌 환경/브라우저/외부 의존성 발 노이즈 에러를 필터링한다. 사용자가 "Sentry 노이즈", "Sentry 에러 필터", "이 에러 무시", "Sentry에 자꾸 뜨는 X 막아줘" 등을 요청할 때 발동한다.
React 단위 테스트(Vitest) 및 E2E 테스트(Playwright) 작성 컨벤션과 Mocking 가이드
Cloud Functions, 프론트엔드 빌드 및 배포 시 발생하는 다양한 오류(Node 버전, 의존성 충돌, 소스맵)의 해결 패턴을 모아둔 가이드.
| name | dashboard-ui-pattern |
| description | 대시보드 및 통계 차트 컴포넌트 추가 시 준수해야 할 UI 레이아웃, 컬러 통일성 및 필터 컨트롤 패턴 |
📄 단일 원본: .agent/skills/dashboard-ui-pattern/SKILL.md 이 파일은 Claude Code 자동 발동을 위한 포인터다. 내용 수정은 원본에서 하고
npm run sync:agents로 재생성한다.
대시보드 및 통계 차트 컴포넌트 추가 시 준수해야 할 UI 레이아웃, 컬러 통일성 및 필터 컨트롤 패턴
전체 패턴·예시·체크리스트는 위 원본 파일을 읽고 따른다.
