본문 바로가기
그냥 코딩!/JAVASCRIPT

Next.JS App Router Docker

by Laeng 2023. 12. 25.

Synology NAS 에 Next.JS 를 올려야 했다. 

최근에 릴리즈한 Next.JS 14 버전이  Node 18.17 버전부터 지원을 하기 시작함에 따라 Node 18.15 까지만 지원하는 Synology NAS에서는 Docker 사용이 강제 되었다.

 

Next.JS에 도커 예제가 있음은 알고 있지만, 내가 사용중인 App Router가 아닌 기존 Page Router 를 기준으로 작성된 예제인줄은 모르고 있었기에... Next.JS 14 및 App Router 에 맞춘 Dockerfile 과 docker-composer.yaml 를 작성하게 되었다.

 

App Router 와 호환되는 Dockerfile 을 해멨을 당신에게 도움이 되면 좋겠다.

 

Dockerfile

# Step 1. 디펜던시를 설치한다.
FROM node:18-alpine AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app

COPY package.json package-lock.json ./
RUN npm install

# Step 2. App 폴더에 디펜던시를 옮기고 빌드한다.
FROM node:18-alpine AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .

ENV NEXT_TELEMETRY_DISABLED 1

RUN npm run build

# Step 3. 빌드한 코드를 app 폴더로 옮기고 3000포트로 실행한다.
FROM node:18-alpine AS runner
WORKDIR /app

ENV NODE_ENV production
ENV NEXT_TELEMETRY_DISABLED 1

RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

COPY --from=builder --chown=nextjs:nodejs /app/.next ./.next
COPY --from=builder --chown=nextjs:nodejs /app/public ./public
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json

USER nextjs

EXPOSE 3000

ENV PORT 3000

CMD ["npm", "start"]

dorker-compose.yml

version: '3'

services:
  dongsimwoo:
    container_name: nextjs
    build:
      context: ./
      dockerfile: Dockerfile
      args:
        ENV_VARIABLE: ${ENV_VARIABLE}
        NEXT_PUBLIC_ENV_VARIABLE: ${NEXT_PUBLIC_ENV_VARIABLE}
    restart: always
    ports:
      - 3000:3000
반응형