docker prod

Author: ehsanghaffar

.dockerignore

@@ -1,7 +1,7 @@
-node_modules/
-.next/
-.build/
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
+Dockerfile
+.dockerignore
+node_modules
+npm-debug.log
+README.md
+.next
+.git

.env

@@ -1,6 +1,7 @@
 # DO NOT ADD SECRETS TO THIS FILE. This is a good place for defaults.
 # If you want to add secrets use `.env.local` instead.
 
-ENV_VARIABLE="server_only_variable"
-NEXT_PUBLIC_ENV_VARIABLE="public_variable"
-DB_LOCAL_URL=mongodb://mongo:27017/denizpaz
+ENV_VARIABLE=production_server_only_variable
+NEXT_PUBLIC_ENV_VARIABLE=production_public_variable
+DB_LOCAL_URL=mongodb://mongo:27017/denizpaz
+PORT=3000

.env.development

@@ -3,3 +3,4 @@
 
 DEVELOPMENT_ENV_VARIABLE="server_only_development_variable"
 NEXT_PUBLIC_DEVELOPMENT_ENV_VARIABLE="public_development_variable"
+PORT=3000

.env.local.example

@@ -1,3 +1,4 @@
 MONGODB_URI=
 ENV_LOCAL_VARIABLE="server_only_variable_from_env_local"
-NEXT_PUBLIC_ENV_LOCAL_VARIABLE="public_variable_from_env_local"
+NEXT_PUBLIC_ENV_LOCAL_VARIABLE="public_variable_from_env_local"
+PORT=3000

.env.production

@@ -3,4 +3,5 @@
 
 PRODUCTION_ENV_VARIABLE="server_only_production_variable"
 NEXT_PUBLIC_PRODUCTION_ENV_VARIABLE="public_production_variable"
-DB_LOCAL_URL=mongodb://mongo:27017/denizpaz
+DB_LOCAL_URL=mongodb://mongo:27017/denizpaz
+PORT=3000

Dockerfile

@@ -1,23 +1,73 @@
-FROM node:18-alpine
+FROM node:18-alpine AS base
 
-RUN mkdir -p /usr/src/app
+# Step 1. Rebuild the source code only when needed
+FROM base AS builder
 
-WORKDIR /usr/src/app
+WORKDIR /app
 
-COPY package.json /usr/src/app/
+# Install dependencies based on the preferred package manager
+COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
+# Omit --production flag for TypeScript devDependencies
+RUN \
+  if [ -f yarn.lock ]; then yarn --frozen-lockfile; \
+  elif [ -f package-lock.json ]; then npm ci; \
+  elif [ -f pnpm-lock.yaml ]; then yarn global add pnpm && pnpm i; \
+  # Allow install without lockfile, so example works even without Node.js installed locally
+  else echo "Warning: Lockfile not found. It is recommended to commit lockfiles to version control." && yarn install; \
+  fi
 
-RUN npm install -g next
+COPY . .
+COPY public ./public
+COPY next.config.js .
+COPY tsconfig.json .
 
-RUN npm install
+# Environment variables must be present at build time
+# https://github.com/vercel/next.js/discussions/14030
+ARG ENV_VARIABLE
+ENV ENV_VARIABLE=${ENV_VARIABLE}
+ARG NEXT_PUBLIC_ENV_VARIABLE
+ENV NEXT_PUBLIC_ENV_VARIABLE=${NEXT_PUBLIC_ENV_VARIABLE}
 
-COPY . /usr/src/app
+# Next.js collects completely anonymous telemetry data about general usage. Learn more here: https://nextjs.org/telemetry
+# Uncomment the following line to disable telemetry at build time
+# ENV NEXT_TELEMETRY_DISABLED 1
 
-RUN npm run build
+# Build Next.js based on the preferred package manager
+RUN \
+  if [ -f yarn.lock ]; then yarn build; \
+  elif [ -f package-lock.json ]; then npm run build; \
+  elif [ -f pnpm-lock.yaml ]; then pnpm build; \
+  else yarn build; \
+  fi
 
-COPY --chown=10101 ./public /usr/src/app/public
+# Note: It is not necessary to add an intermediate step that does a full copy of `node_modules` here
 
-ENV DB_LOCAL_URL=mongodb://mongo:27017/denizpaz
+# Step 2. Production image, copy all the files and run next
+FROM base AS runner
 
-EXPOSE 3000
+WORKDIR /app
+
+# Don't run production as root
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+USER nextjs
+
+COPY --from=builder /app/public ./public
+
+# Automatically leverage output traces to reduce image size
+# https://nextjs.org/docs/advanced-features/output-file-tracing
+# COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
+COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
+
+# Environment variables must be redefined at run time
+ARG ENV_VARIABLE
+ENV ENV_VARIABLE=${ENV_VARIABLE}
+ARG NEXT_PUBLIC_ENV_VARIABLE
+ENV NEXT_PUBLIC_ENV_VARIABLE=${NEXT_PUBLIC_ENV_VARIABLE}
+
+# Uncomment the following line to disable telemetry at run time
+# ENV NEXT_TELEMETRY_DISABLED 1
+
+# Note: Don't expose ports here, Compose will handle that for us
 
 CMD npm run launch

develop.Dockerfile

@@ -0,0 +1,23 @@
+FROM node:18-alpine
+
+RUN mkdir -p /usr/src/app
+
+WORKDIR /usr/src/app
+
+COPY package.json /usr/src/app/
+
+RUN npm install -g next
+
+RUN npm install
+
+COPY . /usr/src/app
+
+RUN npm run build
+
+COPY --chown=10101 ./public /usr/src/app/public
+
+ENV DB_LOCAL_URL=mongodb://mongo:27017/denizpaz
+
+EXPOSE 3000
+
+CMD npm run launch

docker-compose.yml

@@ -1,17 +1,22 @@
 version: "3.8"
 services:
   web:
-    build: .
+    build:
+      context: .
+      dockerfile: Dockerfile
+      args:
+        ENV_VARIABLE: ${ENV_VARIABLE}
+        NEXT_PUBLIC_ENV_VARIABLE: ${NEXT_PUBLIC_ENV_VARIABLE}
     volumes:
-      - .:/usr/src/app
-      - /usr/src/app/node_modules
-      - /usr/src/app/.next
-      - /usr/src/app/public
+      - .:/app
+      - ./public:/app/public
+      # - /app/node_modules
+      # - /app/.next
     command: npm run launch
+    restart: always
     ports:
-      - "3000:3000"
+      - "${PORT}:${PORT}"
     environment:
-      NODE_ENV: production
       DB_LOCAL_URL: mongodb://mongo:27017/denizpazs
     depends_on:
       - mongo
@@ -30,8 +35,8 @@ services:
 
 networks:
   asgard:
-    ipam:
-      driver: default
+    external: true
 
 volumes:
   data:
+    driver: local

next.config.js

@@ -1,6 +1,7 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  reactStrictMode: true
+  reactStrictMode: true,
+  // output: 'standalone',
 }
 
 module.exports = nextConfig