Implement complete Docker setup for Next.js 16 frontend with multi-stage builds, hot reload support, and production optimizations. Changes: - Add Dockerfile with multi-stage build (deps, builder, development, production) - Add .dockerignore to exclude unnecessary files from Docker context - Add .env.local.example template for environment configuration - Update next.config.ts with standalone output for production builds - Add Docker convenience scripts to package.json for easy container management - Support hot reload in development with volume mounts - Use Node.js 20 Alpine for smaller image size - Implement security best practices (non-root user in production) Technical Details: - Development stage: Full source mounted with hot reload via Turbopack - Production stage: Standalone build with optimized static assets - Image size: ~1.17GB (development), smaller for production - Port: 3000 (maps to container port 3000) Testing: - Docker build verified for development target - Container startup successful with Next.js 16.0.1 - HTTP 200 response confirmed on localhost:3000 - Hot reload functional with volume mounts 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
89 lines
2.2 KiB
Docker
89 lines
2.2 KiB
Docker
# ============================================
|
|
# Stage 1: Dependencies Installation
|
|
# ============================================
|
|
FROM node:20-alpine AS deps
|
|
WORKDIR /app
|
|
|
|
# Install libc6-compat for compatibility
|
|
RUN apk add --no-cache libc6-compat
|
|
|
|
# Copy dependency files
|
|
COPY package.json package-lock.json* ./
|
|
|
|
# Install dependencies with legacy peer deps flag for Next.js 16
|
|
RUN npm ci --legacy-peer-deps
|
|
|
|
# ============================================
|
|
# Stage 2: Build Stage
|
|
# ============================================
|
|
FROM node:20-alpine AS builder
|
|
WORKDIR /app
|
|
|
|
# Copy dependencies from deps stage
|
|
COPY --from=deps /app/node_modules ./node_modules
|
|
|
|
# Copy all source files
|
|
COPY . .
|
|
|
|
# Disable Next.js telemetry
|
|
ENV NEXT_TELEMETRY_DISABLED=1
|
|
|
|
# Build the application
|
|
RUN npm run build
|
|
|
|
# ============================================
|
|
# Stage 3: Development Environment (Default)
|
|
# ============================================
|
|
FROM node:20-alpine AS development
|
|
WORKDIR /app
|
|
|
|
# Set environment variables
|
|
ENV NODE_ENV=development
|
|
ENV NEXT_TELEMETRY_DISABLED=1
|
|
|
|
# Install libc6-compat for compatibility
|
|
RUN apk add --no-cache libc6-compat curl
|
|
|
|
# Copy dependencies from deps stage
|
|
COPY --from=deps /app/node_modules ./node_modules
|
|
|
|
# Copy source code (will be overridden by volume mount in docker-compose)
|
|
COPY . .
|
|
|
|
# Expose Next.js default port
|
|
EXPOSE 3000
|
|
|
|
# Use turbo mode for faster development
|
|
CMD ["npm", "run", "dev"]
|
|
|
|
# ============================================
|
|
# Stage 4: Production Environment
|
|
# ============================================
|
|
FROM node:20-alpine AS production
|
|
WORKDIR /app
|
|
|
|
# Set environment variables
|
|
ENV NODE_ENV=production
|
|
ENV NEXT_TELEMETRY_DISABLED=1
|
|
|
|
# Install libc6-compat
|
|
RUN apk add --no-cache libc6-compat
|
|
|
|
# Create non-privileged user for security
|
|
RUN addgroup --system --gid 1001 nodejs && \
|
|
adduser --system --uid 1001 nextjs
|
|
|
|
# Copy build artifacts from builder stage
|
|
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
|
|
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
|
|
COPY --from=builder --chown=nextjs:nodejs /app/public ./public
|
|
|
|
# Switch to non-privileged user
|
|
USER nextjs
|
|
|
|
# Expose port
|
|
EXPOSE 3000
|
|
|
|
# Start the standalone server
|
|
CMD ["node", "server.js"]
|