메뉴
BUDDYS-CLIENT의 Next.js App Router 페이지, route, layout과 화면 흐름을 구현하거나 검토합니다. 새 페이지, 동적 route, route-local UI, loading/error/empty 상태, Server/Client Component 경계를 다루는 작업에 사용합니다.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
BUDDYS-CLIENT에서 API 요청, 응답 타입, 인증, 에러, 캐시와 UI 상태를 연결합니다. 새 endpoint 연동, 데이터 fetching 또는 mutation, API helper 위치 결정, 네트워크 오류 처리 검토에 사용합니다.
BUDDYS-CLIENT의 파일 위치, domain/shared 소유권, App Router 경계, Server/Client Component 분리와 의존 방향을 검토합니다. 폴더 구조 변경, 공통화, 새 추상화, 코드 리뷰 또는 리팩터링 판단에 사용합니다.
BUDDYS-CLIENT의 특정 제품 도메인에 속하는 컴포넌트, 훅, 상태 로직과 사용자 흐름을 구현하거나 검토합니다. 새 route가 중심이 아닌 도메인 기능, domain-local component, hook, model 또는 flow의 위치와 경계를 결정할 때 사용합니다.
BUDDYS-CLIENT의 프론트엔드 요청을 페이지, 도메인 기능, 공통 컴포넌트, API, 구조 검토와 검증 흐름으로 분류합니다. 여러 유형이 섞인 기능 구현이나 작업 범위와 검증 수준을 결정해야 할 때 사용합니다.
BUDDYS-CLIENT 저장소에서 새 작업을 시작하기 전에 브랜치, 변경사항, 기술 스택, 폴더 구조, 관련 문서와 기존 구현 패턴을 파악합니다. 기능 구현, 구조 변경, 코드 리뷰처럼 현재 저장소 맥락을 먼저 확인해야 하는 작업에 사용합니다.
BUDDYS-CLIENT에서 여러 도메인이 함께 사용하는 UI 또는 layout 컴포넌트를 구현하거나 검토합니다. `src/shared/components` 추가, 도메인 컴포넌트의 공통화, 공통 컴포넌트 API와 접근성 경계를 판단할 때 사용합니다.
| name | page-feature-workflow |
| description | BUDDYS-CLIENT의 Next.js App Router 페이지, route, layout과 화면 흐름을 구현하거나 검토합니다. 새 페이지, 동적 route, route-local UI, loading/error/empty 상태, Server/Client Component 경계를 다루는 작업에 사용합니다. |
docs/architecture/app-structure.mddocs/conventions/conventions.mdsrc/app에는 route entry와 Next.js 경계만 두고 제품 기능은 src/domains/{domain}에 둡니다."use client"를 추가합니다.verify-frontend로 마무리합니다.src/app/{route}/page.tsx
src/domains/{domain}/
assets/
components/
hooks/
api/
model/
정확한 하위 구조는 기능 복잡도와 기존 패턴에 맞게 조정하며, 도메인이 커지면 실제 필요에 따라 하위 기능 폴더를 추가합니다. 비어 있는 디렉터리를 미리 만들지 않습니다.
새 route나 주요 화면에서는 다음 내용을 Jira와 제공된 자료에서 확인합니다.
필요한 내용이 없고 저장소에서도 확인할 수 없다면 구현 전에 질문합니다.