DM Table Frontend

Local Dev

Run on the host:

npm install
npm run dev

The frontend server proxies backend requests through Next route handlers.

Typical host-side setup:

INTERNAL_API_BASE_URL=http://localhost:8080

Docker Dev

This project includes a frontend-only Docker workflow. It does not join or modify the backend compose stack.

The browser only talks to the frontend origin. The Next.js server then proxies /api/* requests to the backend using INTERNAL_API_BASE_URL.

For the current backend compose project, use:

INTERNAL_API_BASE_URL=http://dnd-app:8080

Create the docker env file:

cp .env.docker.example .env.docker

Make sure the backend stack is already running first:

docker compose -f /home/qingke/DND-AI-BOT/compose.yaml up -d

Start the frontend container:

docker compose --env-file .env.docker -f compose.frontend.yaml up --build

Then open:

http://localhost:3000

Stop the container:

docker compose -f compose.frontend.yaml down

Notes

• The compose file mounts the repository for hot reload.
• node_modules uses a named Docker volume so the bind mount does not clobber container dependencies.
• .next uses its own named Docker volume so host-side next build output does not corrupt the container's dev cache.
• The dev container clears that isolated .next cache on startup to avoid stale server/client build artifacts causing hydration mismatches.
• The frontend container joins the backend Docker network dnd-ai-bot_default.
• The browser no longer needs direct access to port 8080.
• If your backend container name or network changes, update INTERNAL_API_BASE_URL in .env.docker.