feat (deployment): containerizing frontend

Author: itsskofficial

.github/workflows/deploy-dev.yaml

@@ -37,7 +37,4 @@ jobs:
             docker compose down
 
             # Build new images if the Dockerfile has changed, and start the new containers in the background.
-            docker compose up --build -d
-
-            # Optional: This cleans up any old, unused Docker images to save disk space.
-            docker image prune -af
+            docker compose up --build -d

.github/workflows/deploy-stag.yaml

@@ -37,7 +37,4 @@ jobs:
             docker-compose down
 
             # Build new images if the Dockerfile has changed, and start the new containers in the background.
-            docker-compose up --build -d
-
-            # Optional: This cleans up any old, unused Docker images to save disk space.
-            docker image prune -af
+            docker-compose up --build -d

src/client/.dockerignore

@@ -0,0 +1,23 @@
+# src/client/.dockerignore
+
+# Git
+.git
+.gitignore
+
+# Docker
+Dockerfile
+.dockerignore
+docker-compose.yml
+
+# Node
+node_modules
+npm-debug.log
+
+# Next.js build artifacts
+.next
+out
+
+# Environment files (these should be passed in at runtime)
+.env
+.env.local
+.env.template

src/client/Dockerfile

@@ -0,0 +1,37 @@
+# src/client/Dockerfile
+
+# 1. Builder Stage: Installs dependencies and builds the app
+FROM node:20-slim AS builder
+WORKDIR /app
+
+# Copy package.json and lock file to leverage Docker cache
+COPY package.json ./
+RUN npm install
+
+# Copy the rest of the application source code
+COPY . .
+
+# Build the Next.js application for production
+# This creates the .next/standalone folder
+RUN npm run build
+
+
+# 2. Runner Stage: Creates the final, lightweight image
+FROM node:20-alpine AS runner
+WORKDIR /app
+
+# Set the environment to production
+ENV NODE_ENV=production
+ENV PORT=3000
+
+# Copy the standalone Next.js server from the builder stage
+COPY --from=builder /app/.next/standalone ./
+# Copy public assets and static build artifacts
+COPY --from=builder /app/public ./public
+COPY --from=builder /app/.next/static ./.next/static
+
+# Expose the port the app will run on
+EXPOSE 3000
+
+# The command to start the optimized Next.js server
+CMD ["node", "server.js"]

src/client/docker-compose.yaml

@@ -0,0 +1,15 @@
+# src/client/docker-compose.yml
+
+services:
+  sentient-client:
+    # Build the image from the Dockerfile in the current directory
+    build: .
+    container_name: sentient-client
+    # Always restart the container unless it is explicitly stopped
+    restart: unless-stopped
+    # Map port 80 on the VM to port 3000 inside the container
+    ports:
+      - "80:3000"
+    # Load environment variables from a .env file in the same directory
+    env_file:
+      - .env

src/client/next.config.js

@@ -5,4 +5,8 @@ const nextConfig = {
 	}
 }
 
+if (process.env.NODE_ENV === "production") {
+	nextConfig.output = "standalone"
+}
+
 export default nextConfig