# frontend

Next.js 16 · React 19 · TypeScript. `~/workspace/o2o-ado2-poster-to-video/product/web` 를 옮겨온 것이다.

## 실행

```bash
npm ci
npm run dev          # http://localhost:30100
```

백엔드는 `API_ORIGIN` 으로 지정한다. 기본값은 `http://localhost:30101` 이고,
`next.config.ts` 의 리라이트가 `/api/*` 를 그리로 넘긴다. CORS는 쓰지 않는다.

docker compose 로 띄우면 `API_ORIGIN=http://backend:30101` 이 들어간다.

## 화면

| 경로 | 하는 일 |
| --- | --- |
| `/playreel` | 공연 상품페이지 주소 → 30초 롱컷. 게이트 5회 |
| `/playreel/[id]` | 진행 상황과 게이트 검수 카드 |
| `/` `/poster` `/poster/[id]` | 포스터 업로드 → 8초 숏폼 |
| `/studio` | 포스터 스타일 변환 — **백엔드에 `/api/f2` 가 없다** |
| `/archive` `/playreel/archive` | 아카이브 — **백엔드에 `/api/archive` 가 없다** |

`?mock=<gate>` 를 붙이면 서버 없이 게이트 화면만 볼 수 있다
(`fetch_confirm` `analysis_confirm` `narration_confirm` `clip_confirm` `final_confirm`).