lasta
|
aaaaa054a7
|
Phase 1.3: 시드 크롤 — by-project 엔드포인트 + CrawlPage 폼/폴링/취소
세션 영구화: UI_REBUILD_PLAN.md 신설
- 사용자 비전 5가지 흐름 + Phase 보드 + 작업 재개 가이드
- 세션이 끊겨도 이 파일 + git log로 어디까지 했는지 즉시 복원
백엔드 (crawler_platform/app/api/):
- routes.py: POST /crawl-site/by-project 추가 — config_path 의존 제거
- SiteCrawlByProjectRequest: project_name 기반, DB project.config 재구성
- run_site_crawl_job이 __config_dict 메타키 인식하도록 최소 변경
- config/loader.py: project_config_from_dict() 헬퍼 추출 (DB dict ↔ ProjectConfig)
프론트엔드 API (src/lib/api/):
- crawl.ts: crawlApi.startByProject/getJob/cancel + Zod 스키마
- 종료 상태 판정 헬퍼 isCrawlTerminal()
TanStack Query 훅 (src/hooks/):
- useCrawl.ts: useStartSiteCrawl, useCrawlJob (2초 폴링, 종료 시 자동 중단), useCancelCrawl
- queryKeys에 crawl.job 키
UI 프리미티브 (src/components/ui/):
- select.tsx, progress.tsx, badge.tsx (success/warning/destructive variants 포함)
CrawlPage 완전 교체 (src/pages/):
- 2열 레이아웃: 좌측 크롤 설정 폼 + 우측 진행 상태
- 폼: 소스 선택 (드롭다운, 비어있으면 소스 추가 안내) + 시드 URL + max_depth/max_pages + same_domain_only
- react-hook-form + zod 검증
- 진행 상태: 상태 배지, 진행률 바, visited/queued/analyzed 카운터, 최근 페이지, 에러 details
- 크롤 종료시 폴링 자동 중단, 완료시 "결과 검토" 버튼
- 취소 버튼 → /crawl-site/jobs/{id}/cancel
- sonner 토스트
i18n: crawl.* 키 (한/영)
다음 단계: Phase 1.4 — 자율 연구 (POST /research/run by-project 마이그레이션 + ResearchPage)
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
|
2026-05-14 15:04:41 +09:00 |
|
lasta
|
1be2c7d3a3
|
Phase 0: React environment setup + project initialization
구현 사항:
1. React + TypeScript 마이그레이션 시작
- package.json: React, Redux Toolkit, TanStack Query, shadcn/ui dependencies 추가
- vite.config.js: React 플러그인 + Phase 5/7 API 프록시 추가
- tsconfig.json, tsconfig.node.json 추가
2. Redux 스토어 설정
- stores/ontologySlice.ts: 온톨로지 상태 관리
- stores/crawlSlice.ts: 크롤링 진행 상태
- stores/uiSlice.ts: UI 상태
3. 리액트 진입점 및 기본 컴포넌트
- src/main.tsx: React 앱 초기화
- src/App.tsx: 라우팅 설정 (대시보드, 온보딩, 소스, 크롤, 검증)
- 5개 페이지 컴포넌트 (placeholder)
4. 스타일 및 설정
- tailwind.config.js: Tailwind 설정
- src/styles/globals.css: 글로벌 스타일
- postcss.config.js: PostCSS 설정
- src/i18n.ts: i18next 다국어 설정
- src/lib/queryClient.ts: React Query 설정
5. TypeScript 타입 정의
- src/stores/slices: 각 Redux slice의 TypeScript 타입
프로젝트 구조:
crawler_platform/app/web/frontend/
├── src/
│ ├── main.tsx (React 진입점)
│ ├── App.tsx (라우팅)
│ ├── pages/ (4개 페이지 컴포넌트)
│ ├── stores/ (Redux 스토어 + slices)
│ ├── lib/ (유틸리티)
│ ├── styles/ (CSS)
│ └── i18n.ts (다국어 설정)
├── index.html (업데이트: React root)
├── package.json (의존성 추가)
├── vite.config.js (React 플러그인)
├── tsconfig.json (TypeScript 설정)
├── tailwind.config.js (Tailwind 설정)
└── postcss.config.js (PostCSS 설정)
다음 단계:
- npm install로 의존성 설치
- Phase 1: 온톨로지 업로더 구현
- Phase 1: 참고 사이트 매니저 구현
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
|
2026-05-14 13:52:45 +09:00 |
|