[DP-405] 마이페이지 라우트 생성 및 레이아웃 스켈레톤 구현

[uiuuoq]

연결된 Jira 티켓

• DP-405

작업 내용

• /my-page 라우트 생성 (app/(main)/my-page/page.tsx)
• 마이페이지 메인 레이아웃 스켈레톤 구현 (components/features/my-page/MyPage.tsx)
• TopNavVariant에 마이페이지 메뉴 항목 추가 (LayoutDashboard 아이콘)

주요 변경점

• SectionHeader 컴포넌트: href?: string prop으로 전체보기 링크조건부 렌더 (DP-2~5 연동 대비)
• 4개 섹션 구조: 로드맵 / 스크랩한 글들 / 틀린 퀴즈들 / 추천(홈 글·유튜브·서적)
• 모든 섹션에 전체 보기 UI 배치, 실제 href는 후속 티켓에서 연결 예정
• mock 데이터·카드 리스트·상세 페이지 없음 — 뼈대(skeleton)만 구성

테스트 방법

1. 탑네비 마이페이지 클릭 → /my-page 진입 확인
2. 4개 섹션(로드맵, 스크랩한 글들, 틀린 퀴즈들, 추천) 노출 확인
3. 추천 섹션 내 홈 글 / 유튜브 / 서적 3개 서브섹션 확인
4. 모바일 하단 탭바에서도 마이페이지 진입 가능 확인

AI 사용 여부

• Claude Code 사용

체크리스트

• 빌드/테스트 확인
• 리뷰어 지정
• 라벨 지정