임시 단일 HTML 콘솔을 걷어내고 5페이지 관리자 앱으로 교체(협의:
모니터링+필수 액션, negodata 계열 경량 스택 — Vite+React+TS+Tailwind
+recharts+react-query+react-router).
- 대시보드: /ops 5초 폴링 스탯 타일 8종 + 임계 배너(서버 AlertConfig
기본값 미러) + 세션 내 누적 큐 추이.
- 작업 큐: 상태 탭·상품 검색·페이지네이션·상세 패널(결과/원가/오류),
DEAD 재큐 버튼.
- 상품·가격: 가격 추이 3선 + 몰별 최저가 바 + 검증 링크 + 수동 재검색.
시리즈 색 엔터티 고정 — 네이버 #008a43 은 쿠팡 적색과의 적록색약
분리(ΔE 14.5)·3:1 대비를 검증해 톤다운한 값.
- 크롤 상태: 종료사유 도넛(의미 기반 상태색)·세션당 요청 수 분포
+차단 시작 기준선(예산 튜닝 뷰)·차단 추이/이력·세션 테이블.
- 비용: 시간별 원가 스택(AI vs 프록시)·건당 평균·평균 소요(축이 달라
별도 차트 — 이중축 금지).
- 설정: API 주소·guard 키(localStorage → X-API-Key 자동 첨부).
서버 설정 변경 UI 없음(toml 단일 소스 원칙).
- dev 는 vite 프록시(:9600)로 CORS 불필요. 5페이지 실렌더 스크린샷 검증.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- 임시 FE: 총 비용 타일에 AI·DECODO 분해, 크롤 트래픽에 프록시 경유 바이트(과금분)
- config.local.toml.example: DecodoConfig.cost_per_gb 안내
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
작업 카드에 result.metrics 렌더: 소요시간(+소스별), AI 비용$·호출수, AI 토큰(in/out),
크롤 트래픽(html bytes·fetch수·크롤 몰).
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
by_mall/top 에 등장하는 gmarket·auction·st11 을 소스 색상 태그(+‘크롤’ 뱃지)로 표기.
몰별 최저가 막대도 소스별 색. 폴백으로 크롤된 몰임을 UI에서 구분.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
API 통신 확인용 단일 파일 프론트(외부 CDN 0, SVG 차트 자체 구현).
검색 요청 → 잡 폴링(파이프라인 퍼널·소스별 건수) → 최저가 히어로/상품표,
최저가 이력 3선 그래프(네이버·쿠팡·최종), 몰별 최저가 막대, 배송 뱃지,
헤더 헬스·큐 상태 실시간. CORS 매칭 위해 :5173 서빙(serve.sh, 대화형).
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
