lee-hyeon-cheolandClaude Fable 5.1
72a06d6c07
- LogoMark 는 null 렌더(호출부 6곳 그대로), logo.png·logo-dark.png 삭제, 파비콘 투명 - themeStore·index.html 기본 light. 예전 dark 저장값은 첫 실행 때 한 번만 초기화 - samsung 팔레트 primary/ring/link = #1428A0(브랜드 파랑). 바탕·글씨·면은 실측값 유지 - Message 테스트: 기본 라이트 기준으로 코드블럭 흰 배경 기대 Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2_frontend — React SPA 템플릿
Vite + React + TypeScript + Tailwind + shadcn/ui + Zustand + TanStack Query 기반.
백엔드(1_backend/, FastAPI + SSE + JWT)와 연동.
시작하기
npm install
cp .env.example .env
npm run dev # http://localhost:5173
백엔드도 같이 띄울 것: cd ../1_backend && uv run uvicorn main:app --reload --reload-dir src --port 8001 --app-dir src
주요 명령
| 명령 | 설명 |
|---|---|
npm run dev |
dev 서버 (5173) |
npm run build |
프로덕션 빌드 |
npm run lint |
ESLint |
npm run test |
Vitest 단위 테스트 |
npm run format |
Prettier 포맷 |
자세한 설계: ../docs/superpowers/specs/2026-05-05-frontend-template-design.md
검증 완료 (2026-05-05)
- 부트스트랩 (Vite + TS + Tailwind + ESLint + Prettier 설정)
- core lib (tokenStore, api client + 401 refresh, SSE wrapper, queryClient, cn)
- shared (shadcn/ui core, Layout, ProtectedRoute, ErrorBoundary)
- features/auth (schemas, store, api, hooks, components, pages)
- features/users (api, hooks, MePage)
- features/chat (store, SSE wrapper, hook, components, ChatPage)
- routing + Provider 와이어업
테스트 34개 통과, lint 깨끗, build 성공.
수동 시나리오 검증 (백엔드 8001 + 프론트 5173 같이 띄우고):
/→ ProtectedRoute가/login으로 redirecthappy@pwc.com / a1234로그인 →/chat이동- 헤더에 이메일 보임
/me클릭 → 내 정보 표시/chat메시지 보내면 SSE echo로 토큰 단위 누적- Logout →
/login이동