# Docker Configuration Design

## Goal

Add Docker support for both production deployment and local development of the Vite React app, while making the default production path minimize Docker downloads.

## Architecture

Production builds the static app on the host using the already-installed npm dependencies, then uses a single-stage `nginx:stable-alpine3.23-slim` Dockerfile to copy and serve `dist` on port `80`. This avoids downloading a Node image and reinstalling npm packages during the Docker deployment.

Development remains an optional separate Dockerfile and compose file. It installs dependencies, runs `npm run dev`, exposes Vite on port `3000`, and mounts source files from the host while keeping `node_modules` inside the container. It is not the low-download production path.

## Files

- `.dockerignore` excludes dependencies, unrelated build output, logs, and local env files from Docker build context, while retaining `dist` for the production image.
- `Dockerfile` creates a small production image from the host-built static output.
- `nginx.conf` serves static assets and falls back to `index.html` for React Router routes.
- `docker-compose.yml` runs the production image on host port `8080`.
- `Dockerfile.dev` runs the Vite dev server.
- `docker-compose.dev.yml` runs the development container on host port `3000`.
- `README.md` documents the Docker commands.

## Environment

The current Vite config injects `GEMINI_API_KEY` during build. Production therefore reads `.env.local` during the host-side `npm run build` command and copies the resulting static bundle into the container. Development reads environment values from `.env.local` when present.

## Verification

- Run `npm run lint`.
- Run `npm run build`.
- Build the production Docker image after a host-side `npm run build`.
- Optionally run the compose services if Docker is available.