From d0b4644669cba1e02c7ee1e238db9fd6c48635b8 Mon Sep 17 00:00:00 2001 From: mota Date: Mon, 13 Oct 2025 07:42:12 +0900 Subject: [PATCH] =?UTF-8?q?header=20=EC=9E=91=EC=97=85=EB=A6=AC=EC=8A=A4?= =?UTF-8?q?=ED=8A=B8=20md?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .cursor/.prompt/header_navigation작업.md | 38 ++- .cursor/ref/headerref01.html | 326 +++++++++++++++++++++++ 2 files changed, 362 insertions(+), 2 deletions(-) create mode 100644 .cursor/ref/headerref01.html diff --git a/.cursor/.prompt/header_navigation작업.md b/.cursor/.prompt/header_navigation작업.md index c6f2401..592be7d 100644 --- a/.cursor/.prompt/header_navigation작업.md +++ b/.cursor/.prompt/header_navigation작업.md @@ -1,2 +1,36 @@ -1. /public/logo.png 로고 넣기 -2. \ No newline at end of file +### 헤더 네비 작업 체크리스트 (순서) + +1) 레퍼런스 분석 +- [ ] ref/headerref01.html 구조/스타일 패턴 분석 (접근성/반응형 확인) + +2) 기본 골격/리소스 준비 +- [ ] 로고 파일 경로 확인(`/public/logo.png`) 및 Next Image 적용 여부 결정 +- [ ] 헤더 컨테이너/레이아웃 골격 생성(`src/app/components/AppHeader.tsx` 확장) + +3) 데이터 연동 설계 +- [ ] 대분류 소스 결정: `GET /api/boards?category=...` 또는 카테고리 전용 API 사용 +- [ ] 소분류(보드) 매핑 규칙 정의(현재 시드 트리 기준) + +4) 대분류 네비 구현 +- [ ] 상단에 대분류 탭 렌더링(정렬/활성 상태 반영) +- [ ] hover 시 소분류 드롭다운 표시(키보드 포커스 접근성 포함) +- [ ] 현재 페이지 경로와 활성 대분류 동기화 + +5) 소분류(보드) 드롭다운 구현 +- [ ] 소분류 리스트 렌더링(이름/slug 링크) +- [ ] 보드 타입/승인필요 등 뱃지 표기 여부 결정 및 적용 + +6) 검색창 구현 +- [ ] 헤더 검색 입력 UI 추가(placeholder, 키보드 액션) +- [ ] 검색 엔드포인트/페이지 연동(`src/app/search/page.tsx`) + +7) 스타일/반응형/테마 +- [ ] 모바일 메뉴 토글(햄버거) 및 접근성 속성(aria-* ) 적용 +- [ ] 라이트/다크 모드 색상 대응 + +8) 연동/테스트 +- [ ] API 호출 캐시/키 구성(`src/lib/queryKeys.ts`) 및 훅 사용 +- [ ] 주요 플로우 스모크 테스트(대분류 hover, 소분류 클릭, 검색) + +9) 문서/정리 +- [ ] 헤더 네비 구조/데이터 의존성/확장 포인트 간단 문서화 \ No newline at end of file diff --git a/.cursor/ref/headerref01.html b/.cursor/ref/headerref01.html new file mode 100644 index 0000000..532423e --- /dev/null +++ b/.cursor/ref/headerref01.html @@ -0,0 +1,326 @@ + \ No newline at end of file