docs: STATUS.md — 구현 현황 + 향후 계획 정리

페이지·서비스별 완료/예정 항목 인덱스. CLAUDE.md를 보완.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

STATUS.md

@@ -0,0 +1,126 @@
+# web-ui — 구현 현황 & 로드맵
+
+> 최종 갱신: 2026-05-07
+> 자세한 페이지·API 표는 [CLAUDE.md](./CLAUDE.md) 참조.
+
+---
+
+## 1. 구현 완료
+
+### 1-1. 메인 페이지
+
+| 경로 | 상태 | 비고 |
+|------|------|------|
+| `/` Home | ✅ | 메인 허브 |
+| `/blog` Blog | ✅ | 마크다운 기반 |
+| `/portfolio` Portfolio | ✅ | 프로필·경력·프로젝트·자기소개 |
+| `/todo` Todo | ✅ | 태스크 보드 |
+
+### 1-2. 로또 (`/lotto`)
+
+| 영역 | 상태 |
+|------|------|
+| 3탭 구조 (브리핑 / 분석·통계 / 구매·성과) | ✅ |
+| AI 큐레이터 브리핑 탭 | ✅ |
+| 성과 배너 + ReportPanel + ConfidenceRing | ✅ |
+| 개인 분석 패널 | ✅ |
+| 구매 내역 CRUD + 성과 통계 | ✅ |
+
+### 1-3. 주식 (`/stock`, `/stock/trade`)
+
+| 영역 | 상태 |
+|------|------|
+| 뉴스·지수 | ✅ |
+| 트레이딩 + 잔고 | ✅ |
+| 포트폴리오 (수동 입력 종목 + 예수금 + 자산 추이) | ✅ |
+| 자산 스냅샷 + 7/30/90일 차트 | ✅ |
+| 실현손익(매도이력) Drawer | ✅ |
+| 포트폴리오 카드 모바일 금액 줄바꿈 대응 | ✅ (2026-05-06) |
+
+### 1-4. 청약 (`/realestate`, `/realestate/property`)
+
+| 영역 | 상태 |
+|------|------|
+| 자치구 5티어 (S/A/B/C/D) 드래그&드롭 + 슬라이더 + 토글 | ✅ |
+| 카드/매칭 결과에 district 뱃지 + 5티어 뱃지 | ✅ |
+| AnnouncementDetail 매칭 분석 섹션 | ✅ |
+| 5축 점수 breakdown 시각화 + 알림 대상 카운트 | ✅ |
+| 청약 일정 캘린더 뷰 | ✅ |
+| 프로필 완성도 힌트 배너 + 소득 기준 힌트 | ✅ |
+
+### 1-5. 여행 (`/travel`)
+
+| 영역 | 상태 |
+|------|------|
+| Dark Room 테마 갤러리 | ✅ |
+| 앨범 카드 + Masonry + Lightbox + MiniMap | ✅ |
+| 지역 변경 + 핀 좌표 지정 | ✅ |
+| 영상(VideoTab) | 🚧 준비 중 |
+
+### 1-6. 음악 스튜디오 (`/lab/music` — Sonic Forge)
+
+| 영역 | 상태 |
+|------|------|
+| Create 탭 (장르/무드/악기/BPM/Key) + 트랙 제목 직접 입력 | ✅ |
+| Library 탭 + 트랙 카드 + 삭제/재생 | ✅ |
+| YouTube 탭 (서브탭 4개: VideoProjects / Trends / Revenue / Compile) | ✅ (2026-05-01~05-06) |
+| 다중 트랙 컴파일 (FFmpeg concat → MP4) | ✅ |
+| 시장 트렌드 리포트 (장르/추천수/이력) | ✅ |
+
+### 1-7. 기타 Lab
+
+| 경로 | 상태 |
+|------|------|
+| `/lab/sword-stream` Three.js 파티클 | ✅ |
+| `/lab/day-calc` 날짜 계산기 | ✅ |
+| `/agent-office` 에이전트 가상 오피스 (WebSocket) | ✅ |
+| `/blog-lab` 블로그 마케팅 수익화 대시보드 | ✅ |
+
+### 1-8. 인프라 / DX
+
+| 항목 | 상태 |
+|------|------|
+| Vite 개발 서버 프록시 (`/api`, `/media`, `/ext`) | ✅ |
+| Windows robocopy + macOS SSH/SMB 배포 (`scripts/deploy-nas.cjs`) | ✅ |
+| Mac SSH 배포 + tar\|ssh 전환 (Synology rsync 우회) | ✅ |
+| 반응형 웹 디자인 패스 | ✅ |
+
+---
+
+## 2. 진행 중 / 향후 계획
+
+### 2-1. Travel 영상 탭 완성
+- 현재 "준비 중" 플레이스홀더 → 실제 영상 업로드/재생 UI 구현
+- 백엔드 `travel-proxy`에 영상 메타·썸네일 API 필요
+
+### 2-2. 로또 프리미엄 구독 UI (백엔드 Phase 3 연동)
+- 회원 가입/로그인 UI (JWT)
+- 구독 플랜 선택 + Toss/Stripe 결제 플로우
+- 구독자 전용 리포트·알림 영역
+- 백엔드 로드맵: `web-backend/docs/lotto-premium-roadmap.md`
+
+### 2-3. Music YouTube 탭 후속
+- VideoProjects 실제 렌더링 진행률 시각화 강화
+- Compile 탭에 트랙 트림/페이드 옵션
+- Revenue 대시보드 차트 강화
+
+### 2-4. 청약 후속
+- 알림 dry-run 미리보기 UI (어떤 공고가 매칭됐을지 사전 확인)
+- 모바일 5티어 편집 모드 (현재 PC 전용)
+
+### 2-5. 포트폴리오/주식 후속
+- 종목별 평균 매입가 분할 입력 UI
+- 매도 시뮬레이터 (수익률 시나리오 비교)
+
+### 2-6. 일반
+- 다크/라이트 테마 토글 (현재 다크 단일)
+- PWA 설치 + 홈화면 단축 (모바일 사용 빈도 증가)
+
+---
+
+## 3. 참고 문서
+
+- 페이지·라우트·API 전체 표: [CLAUDE.md](./CLAUDE.md)
+- 워크스페이스 통합 가이드: `../CLAUDE.md`
+- 백엔드 상태: `../web-backend/STATUS.md`
+- 백엔드 Spec/Plan 디렉토리: `../web-backend/docs/superpowers/`