Add Dockerfile and docker-compose.yml

.dockerignore

@@ -0,0 +1,7 @@
+Dockerfile
+.dockerignore
+node_modules
+npm-debug.log
+README.md
+.next
+.git

Dockerfile

@@ -0,0 +1,69 @@
+FROM node:20-alpine AS base
+
+# Install dependencies only when needed
+FROM base AS deps
+# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
+RUN apk add --no-cache libc6-compat
+WORKDIR /app
+
+# Get PNPM version from package.json
+RUN export PNPM_VERSION=$(cat package.json | jq '.engines.pnpm' | sed -E 's/[^0-9.]//g')
+
+COPY package.json pnpm-lock.yaml ./
+RUN yarn global add pnpm@$PNPM_VERSION
+RUN pnpm i --frozen-lockfile --prefer-offline
+
+# Rebuild the source code only when needed
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+
+# Next.js collects completely anonymous telemetry data about general usage.
+# Learn more here: https://nextjs.org/telemetry
+# Uncomment the following line in case you want to disable telemetry during the build.
+# ENV NEXT_TELEMETRY_DISABLED 1
+
+ENV NEXT_OUTPUT=standalone
+ARG NEXT_PUBLIC_SALEOR_API_URL
+ENV NEXT_PUBLIC_SALEOR_API_URL=${NEXT_PUBLIC_SALEOR_API_URL}
+ARG NEXT_PUBLIC_STOREFRONT_URL
+ENV NEXT_PUBLIC_STOREFRONT_URL=${NEXT_PUBLIC_STOREFRONT_URL}
+
+# Get PNPM version from package.json
+RUN export PNPM_VERSION=$(cat package.json | jq '.engines.pnpm' | sed -E 's/[^0-9.]//g')
+RUN yarn global add pnpm@$PNPM_VERSION
+
+RUN pnpm build
+
+# Production image, copy all the files and run next
+FROM base AS runner
+WORKDIR /app
+
+ENV NODE_ENV production
+# Uncomment the following line in case you want to disable telemetry during runtime.
+# ENV NEXT_TELEMETRY_DISABLED 1
+
+ARG NEXT_PUBLIC_SALEOR_API_URL
+ENV NEXT_PUBLIC_SALEOR_API_URL=${NEXT_PUBLIC_SALEOR_API_URL}
+ARG NEXT_PUBLIC_STOREFRONT_URL
+ENV NEXT_PUBLIC_STOREFRONT_URL=${NEXT_PUBLIC_STOREFRONT_URL}
+
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+
+# COPY --from=builder /app/public ./public
+
+# Set the correct permission for prerender cache
+RUN mkdir .next
+RUN chown nextjs:nodejs .next
+
+# 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
+
+USER nextjs
+
+
+CMD ["node", "server.js"]

docker-compose.yml

@@ -0,0 +1,21 @@
+version: "3"
+
+services:
+  saleor-storefront:
+    container_name: saleor-storefront
+    build:
+      dockerfile: Dockerfile
+      args:
+        NEXT_PUBLIC_SALEOR_API_URL: ${NEXT_PUBLIC_SALEOR_API_URL}
+        NEXT_PUBLIC_STOREFRONT_URL: ${NEXT_PUBLIC_STOREFRONT_URL}
+    restart: always
+    ports:
+      - 3000:3000
+    networks:
+      - saleor_network
+
+  # Add more containers below (nginx, postgres, etc.)
+
+networks:
+  saleor_network:
+    external: false

next.config.js

@@ -10,6 +10,13 @@ const config = {
 	experimental: {
 		typedRoutes: false,
 	},
+	// used in the Dockerfile
+	output:
+		process.env.NEXT_OUTPUT === "standalone"
+			? "standalone"
+			: process.env.NEXT_OUTPUT === "export"
+			  ? "export"
+			  : undefined,
 };
 
 export default config;

package.json

@@ -16,9 +16,9 @@
 	},
 	"dependencies": {
 		"@adyen/adyen-web": "5.53.2",
-		"@adyen/api-library": "14.4.0",
+		"@adyen/api-library": "15.0.0-beta",
 		"@headlessui/react": "1.7.17",
-		"@saleor/auth-sdk": "0.14.0",
+		"@saleor/auth-sdk": "1.0.1",
 		"@stripe/react-stripe-js": "2.3.2",
 		"@stripe/stripe-js": "2.1.11",
 		"clsx": "2.0.0",
@@ -27,14 +27,15 @@
 		"libphonenumber-js": "1.10.49",
 		"lodash-es": "4.17.21",
 		"lucide-react": "0.292.0",
-		"next": "14.0.2",
+		"next": "14.0.3",
 		"query-string": "8.1.0",
 		"react": "18.2.0",
 		"react-dom": "18.2.0",
 		"react-error-boundary": "4.0.11",
 		"react-spinners": "0.13.8",
 		"react-test-renderer": "18.2.0",
 		"react-toastify": "9.1.3",
+		"sharp": "0.32.6",
 		"ts-invariant": "0.10.3",
 		"url-join": "5.0.0",
 		"urql": "4.0.6",
@@ -46,21 +47,21 @@
 		"@graphql-codegen/cli": "5.0.0",
 		"@graphql-codegen/client-preset": "4.1.0",
 		"@graphql-typed-document-node/core": "3.2.0",
-		"@next/env": "14.0.2",
+		"@next/env": "14.0.3",
 		"@parcel/watcher": "2.3.0",
-		"@playwright/test": "1.39.0",
+		"@playwright/test": "1.40.0",
 		"@tailwindcss/forms": "0.5.7",
 		"@tailwindcss/typography": "0.5.10",
 		"@types/lodash-es": "4.17.11",
-		"@types/node": "20.9.0",
+		"@types/node": "20.9.1",
 		"@types/react": "18.2.37",
 		"@types/react-dom": "18.2.15",
 		"@types/url-join": "4.0.3",
 		"@typescript-eslint/eslint-plugin": "6.11.0",
 		"@typescript-eslint/parser": "6.11.0",
 		"autoprefixer": "10.4.16",
 		"eslint": "8.53.0",
-		"eslint-config-next": "14.0.2",
+		"eslint-config-next": "14.0.3",
 		"eslint-config-prettier": "9.0.0",
 		"eslint-plugin-import": "2.29.0",
 		"eslint-plugin-playwright": "0.18.0",