# frontend

Nuxt 3 기반 프론트엔드 (SSG · 정적 생성 → nginx 정적 호스팅).

## 기술 스택

- **Nuxt 3** (Vue 3 + Vite) — 파일 기반 라우팅, 자동 임포트
- **Pinia** (`@pinia/nuxt`) — 상태 관리
- **Axios** — 중앙 인스턴스 + 응답 인터셉터 (에러코드 매핑)
- **ESLint** (`@nuxt/eslint`) · **oxfmt** — 린트/포맷

## 디렉터리 구조

```
frontend/
├── app.vue                  # 최상위 진입점 (NuxtLayout + NuxtPage)
├── error.vue                # 전역 에러 페이지 (404 등)
├── nuxt.config.ts           # Nuxt 설정 (SSG, runtimeConfig, 모듈)
├── pages/                   # 파일 기반 라우팅 (index.vue = '/')
├── composables/             # useApi(axios), useUser 등 — 자동 임포트
├── stores/                  # Pinia 스토어 (user.store.ts)
├── shared/utils/            # 순수 유틸 함수 (format.ts) — 자동 임포트
└── public/                  # 정적 자원 (favicon 등)
```

## 환경변수

- `NUXT_PUBLIC_API_BASE_URL` — API 베이스 URL (`runtimeConfig.public.apiBaseUrl`).
  - 도커 빌드 시 `docker-compose.yml` 의 `VITE_API_BASE_URL`(=`FRONT_API_URL`) 인자가
    Dockerfile 에서 `NUXT_PUBLIC_API_BASE_URL` 로 매핑됩니다.

## 프로젝트 실행

```sh
npm install
```

### 개발 서버 (HMR)

```sh
npm run dev
```

### 정적 생성 (운영 빌드)

```sh
npm run generate   # 산출물: .output/public
```

`npm run preview` 로 생성 결과를 로컬에서 확인할 수 있습니다.

### 타입 검사 / 린트 / 포맷

```sh
npm run typecheck
npm run lint
npm run format
```

## 참고

- 렌더링 방식은 SSG 입니다. 동적 SSR(Node 서버)이 필요해지면 `nuxt.config.ts` 에서
  `ssr: true` 유지 + `npm run build` 산출물(`.output/server`)을 Node 로 구동하고
  Dockerfile/nginx 구성을 서버 모드로 전환하면 됩니다.