Phase 0.5: React UI 기반 계층 구축 — API 클라이언트 + TanStack Query + shadcn UI

1. 서버/UI 상태 분리 (선택지 B 채택)
   - ontologySlice: entities/relations 등 서버 상태 제거 → OntologyDraft(편집 폼)만
   - crawlSlice: progress/stats/logs 제거 → CrawlUiState(토글/확장 상태)만
   - 서버 상태는 전부 TanStack Query로 이전

2. API 클라이언트 계층 (src/lib/api/)
   - client.ts: fetch 래퍼 + Zod 스키마 검증 + ApiError
   - projects.ts: projectsApi.list/detail/create + 도메인 스키마

3. TanStack Query 훅 (src/hooks/)
   - useProjects, useProject, useCreateProject
   - queryKeys 팩토리로 키 일관성

4. shadcn 스타일 UI 프리미티브 (src/components/ui/)
   - button, card, skeleton
   - lib/utils.ts: cn() helper (clsx + tailwind-merge)

5. 레이아웃 (src/components/layout/)
   - AppShell: 축소 가능 Sidebar + Header + Outlet
   - App.tsx 라우트를 AppShell로 중첩

6. DashboardPage End-to-end 연결
   - useProjects()로 백엔드 /projects 호출
   - loading skeleton / error+retry / empty state / 카드 그리드 4가지 상태 모두 처리

7. i18n locale 파일 추가
   - public/locales/ko/common.json (한국어)
   - public/locales/en/common.json (영문 fallback)
   - 키: nav.*, dashboard.*, common.*, app.*

8. 레거시 정리
   - vanilla JS/CSS 24개 → src/legacy/로 git mv
   - tailwind content를 *.{ts,tsx}로 좁혀 legacy 제외

다음 단계: Phase 1 — OnboardingPage 파일 업로드 + useCreateProject 연결

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

crawler_platform/app/web/frontend/public/locales/en/common.json

@@ -0,0 +1,33 @@
+{
+  "app": {
+    "title": "Ontology Builder",
+    "subtitle": "AI-powered ontology construction"
+  },
+  "nav": {
+    "dashboard": "Dashboard",
+    "onboard": "Upload Ontology",
+    "sources": "Sources",
+    "crawl": "Crawl",
+    "review": "Review",
+    "toggleSidebar": "Toggle sidebar"
+  },
+  "dashboard": {
+    "title": "Ontology Builder",
+    "subtitle": "Build and manage domain ontologies with AI-powered extraction",
+    "newProject": "New Project",
+    "projects": "Projects",
+    "projectCount": "{{count}} total",
+    "loadFailed": "Failed to load projects",
+    "empty": {
+      "title": "No projects yet",
+      "hint": "Create your first project to start building an ontology"
+    }
+  },
+  "common": {
+    "retry": "Retry",
+    "cancel": "Cancel",
+    "next": "Next",
+    "back": "Back",
+    "complete": "Complete"
+  }
+}

crawler_platform/app/web/frontend/public/locales/ko/common.json

@@ -0,0 +1,33 @@
+{
+  "app": {
+    "title": "온톨로지 빌더",
+    "subtitle": "AI 기반 온톨로지 구축 플랫폼"
+  },
+  "nav": {
+    "dashboard": "대시보드",
+    "onboard": "온톨로지 업로드",
+    "sources": "참고 소스",
+    "crawl": "크롤 진행",
+    "review": "결과 검토",
+    "toggleSidebar": "사이드바 토글"
+  },
+  "dashboard": {
+    "title": "온톨로지 빌더",
+    "subtitle": "도메인 온톨로지를 AI 추출로 구축하고 관리합니다",
+    "newProject": "새 프로젝트",
+    "projects": "프로젝트 목록",
+    "projectCount": "{{count}}개",
+    "loadFailed": "프로젝트를 불러오지 못했습니다",
+    "empty": {
+      "title": "아직 프로젝트가 없습니다",
+      "hint": "첫 프로젝트를 만들어 온톨로지 구축을 시작하세요"
+    }
+  },
+  "common": {
+    "retry": "다시 시도",
+    "cancel": "취소",
+    "next": "다음",
+    "back": "이전",
+    "complete": "완료"
+  }
+}