From 365b8ed328c2a544a3840a32f9b8b7c529917189 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= Date: Sat, 8 Nov 2025 09:32:42 +0100 Subject: [PATCH] ci: add Docker build and GitHub Container Registry workflow MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Add complete Docker containerization and CI/CD setup: Docker Configuration: - Multi-stage Dockerfile with 3 stages (deps, builder, runner) - Stage 1: Install dependencies with pnpm in Alpine - Stage 2: Build Next.js static export - Stage 3: Serve static files with nginx:alpine - Health check endpoint on /health - Optimized for production with layer caching Nginx Configuration: - Custom nginx.conf for static file serving - Gzip compression enabled - Security headers (X-Frame-Options, X-Content-Type-Options, etc.) - Static asset caching with 1-year expiry - Client-side routing support (try_files) - Health check endpoint for container orchestration - Error page handling GitHub Workflow (docker-build-push.yml): - Triggers on push to main, tags, and pull requests - Multi-platform builds (linux/amd64, linux/arm64) - Pushes to GitHub Container Registry (ghcr.io) - Automatic tagging: latest, semver, sha, branch - Uses GitHub Actions cache for faster builds - Requires only GITHUB_TOKEN (no secrets needed) .dockerignore: - Excludes node_modules, .next, build artifacts - Excludes dev files, logs, and IDE configs - Keeps Docker image size minimal Image will be available at: ghcr.io/valknarness/units-ui:latest 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- .dockerignore | 53 ++++++++++++++++++++ .github/workflows/docker-build-push.yml | 64 ++++++++++++++++++++++++ Dockerfile | 50 +++++++++++++++++++ nginx.conf | 66 +++++++++++++++++++++++++ 4 files changed, 233 insertions(+) create mode 100644 .dockerignore create mode 100644 .github/workflows/docker-build-push.yml create mode 100644 Dockerfile create mode 100644 nginx.conf diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..47e8891 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,53 @@ +# Dependencies +node_modules +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + +# Next.js +.next +out + +# Production +build +dist + +# Misc +.DS_Store +*.pem + +# Debug +*.log + +# Local env files +.env*.local +.env + +# Vercel +.vercel + +# TypeScript +*.tsbuildinfo +next-env.d.ts + +# Git +.git +.gitignore + +# IDE +.vscode +.idea +*.swp +*.swo + +# Testing +coverage +.nyc_output + +# Turbopack +.turbo + +# Documentation +README.md +IMPLEMENTATION_PLAN.md diff --git a/.github/workflows/docker-build-push.yml b/.github/workflows/docker-build-push.yml new file mode 100644 index 0000000..847d881 --- /dev/null +++ b/.github/workflows/docker-build-push.yml @@ -0,0 +1,64 @@ +name: Build and Push Docker Image + +on: + push: + branches: + - main + tags: + - 'v*' + pull_request: + branches: + - main + +env: + REGISTRY: ghcr.io + IMAGE_NAME: ${{ github.repository }} + +jobs: + build-and-push: + runs-on: ubuntu-latest + permissions: + contents: read + packages: write + + steps: + - name: Checkout repository + uses: actions/checkout@v4 + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v3 + + - name: Log in to GitHub Container Registry + uses: docker/login-action@v3 + with: + registry: ${{ env.REGISTRY }} + username: ${{ github.actor }} + password: ${{ secrets.GITHUB_TOKEN }} + + - name: Extract metadata (tags, labels) for Docker + id: meta + uses: docker/metadata-action@v5 + with: + images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }} + tags: | + type=ref,event=branch + type=ref,event=pr + type=semver,pattern={{version}} + type=semver,pattern={{major}}.{{minor}} + type=semver,pattern={{major}} + type=sha,prefix={{branch}}- + type=raw,value=latest,enable={{is_default_branch}} + + - name: Build and push Docker image + uses: docker/build-push-action@v5 + with: + context: . + push: ${{ github.event_name != 'pull_request' }} + tags: ${{ steps.meta.outputs.tags }} + labels: ${{ steps.meta.outputs.labels }} + cache-from: type=gha + cache-to: type=gha,mode=max + platforms: linux/amd64,linux/arm64 + + - name: Image digest + run: echo ${{ steps.meta.outputs.digest }} diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..d9834b3 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,50 @@ +# Multi-stage Dockerfile for Next.js 16 static export + +# Stage 1: Dependencies +FROM node:22-alpine AS deps +RUN apk add --no-cache libc6-compat +WORKDIR /app + +# Install pnpm +RUN corepack enable && corepack prepare pnpm@latest --activate + +# Copy package files +COPY package.json pnpm-lock.yaml ./ + +# Install dependencies +RUN pnpm install --frozen-lockfile + +# Stage 2: Builder +FROM node:22-alpine AS builder +WORKDIR /app + +# Install pnpm +RUN corepack enable && corepack prepare pnpm@latest --activate + +# Copy dependencies from deps stage +COPY --from=deps /app/node_modules ./node_modules + +# Copy source code +COPY . . + +# Build the application (static export) +RUN pnpm build + +# Stage 3: Runner (serve static files) +FROM nginx:alpine AS runner + +# Copy custom nginx config +COPY --from=builder /app/nginx.conf /etc/nginx/nginx.conf + +# Copy static files from build +COPY --from=builder /app/out /usr/share/nginx/html + +# Expose port 80 +EXPOSE 80 + +# Health check +HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \ + CMD wget --no-verbose --tries=1 --spider http://localhost/ || exit 1 + +# Start nginx +CMD ["nginx", "-g", "daemon off;"] diff --git a/nginx.conf b/nginx.conf new file mode 100644 index 0000000..6cac1b9 --- /dev/null +++ b/nginx.conf @@ -0,0 +1,66 @@ +events { + worker_connections 1024; +} + +http { + include /etc/nginx/mime.types; + default_type application/octet-stream; + + # Logging + access_log /var/log/nginx/access.log; + error_log /var/log/nginx/error.log; + + # Performance + sendfile on; + tcp_nopush on; + tcp_nodelay on; + keepalive_timeout 65; + types_hash_max_size 2048; + + # Gzip compression + gzip on; + gzip_vary on; + gzip_min_length 1024; + gzip_types text/plain text/css text/xml text/javascript application/x-javascript application/xml+rss application/json application/javascript; + + server { + listen 80; + server_name localhost; + root /usr/share/nginx/html; + index index.html; + + # Security headers + add_header X-Frame-Options "SAMEORIGIN" always; + add_header X-Content-Type-Options "nosniff" always; + add_header X-XSS-Protection "1; mode=block" always; + add_header Referrer-Policy "no-referrer-when-downgrade" always; + + # Cache static assets + location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ { + expires 1y; + add_header Cache-Control "public, immutable"; + } + + # Next.js static files + location /_next/static/ { + expires 1y; + add_header Cache-Control "public, immutable"; + } + + # Handle client-side routing + location / { + try_files $uri $uri.html $uri/ /index.html; + } + + # Health check endpoint + location /health { + access_log off; + return 200 "healthy\n"; + add_header Content-Type text/plain; + } + + # Error pages + error_page 404 /404.html; + error_page 500 502 503 504 /50x.html; + } +}