deploy: add frontend service with production Docker setup

- Created production Dockerfile for Next.js frontend (multi-stage build)
- Added frontend service to docker-compose with API env var
- Updated nginx to proxy root path to frontend:3000 service
- Frontend fully integrated with backend at https://mtd.runfoo.run

Job ID: MTAD-IMPL-2025-11-18-CL
This commit is contained in:
admin 2025-11-18 07:00:00 +00:00
parent 913c272fb3
commit 6423df91e3
3 changed files with 69 additions and 9 deletions

View file

@ -75,6 +75,21 @@ services:
retries: 3
start_period: 10s
frontend:
build:
context: ../web
dockerfile: Dockerfile
container_name: mtad-web
restart: unless-stopped
expose:
- "3000"
networks:
- mtad-network
depends_on:
- api
environment:
NEXT_PUBLIC_API_BASE_URL: http://api:8000/api/v1
nginx:
image: nginx:alpine
container_name: mtad-nginx

View file

@ -151,16 +151,17 @@ http {
proxy_set_header Host $host;
}
# Frontend static files
# Proxy frontend requests to Next.js service
location / {
root /usr/share/nginx/html;
try_files $uri $uri/ /index.html;
# Cache static assets
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
expires 1y;
add_header Cache-Control "public, immutable";
}
proxy_pass http://frontend:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_cache_bypass $http_upgrade;
}
# Deny access to sensitive files

44
web/Dockerfile Normal file
View file

@ -0,0 +1,44 @@
# Build stage
FROM node:20-alpine AS builder
WORKDIR /app
# Copy package files
COPY package*.json ./
# Install dependencies
RUN npm ci
# Copy source
COPY . .
# Build the app
RUN npm run build
# Production stage
FROM node:20-alpine
WORKDIR /app
# Copy package files
COPY package*.json ./
# Install production dependencies only
RUN npm ci --omit=dev
# Copy built app from builder
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/public ./public
# Create non-root user
RUN addgroup -g 1001 -S nodejs && adduser -S nextjs -u 1001
# Set permissions
RUN chown -R nextjs:nodejs /app
USER nextjs
# Start the app
CMD ["npm", "run", "start"]
EXPOSE 3000