bj.choi - notes

Docker 배포 최적화

개요

배포환경을 단순히 npm start⁠ 를 통한 개발 서버로 시작하기에는 프로덕션 환경에서 최적화 되지않아  너무 느리게 동작합니다.

따라서 프로덕션을 위해 자체 빌드 스크립트를 통해 가져와 코드 컴파일 및 최적화를 수행하고 최적화된 파일만 전달하여 실제로 더 효율적으로 사용할 수 있게 해야합니다.

빌드전용 컨테이너 만들기

React로 개발한 프로젝트에서 기본적으로 개발과 프로덕션 환경은 서로 다르게 실행되어야 합니다.

다시말해, 두 가지의 다른 환경을 설정해야하며 어떠한 환경을 구축해야하는지를 이해해야합니다.

특히 React를 사용하는 프로젝트를 배포하고자 빌드했을 때의 결과물은 nodejs가 필요없는 파일들을 생성하게 되며, 이는 사용자 환경에서 실행되는 것이지 서버의 Node.js 환경에서 실행되는 것이 아닙니다.

현재 컨테이너를 올릴 때 다음과 같은 Dockerfile을 사용하고 있습니다.

FROM node

WORKDIR /app

COPY package.json .

RUN npm install

COPY . .

EXPOSE 3000

CMD [ "npm", "start" ]

해당 환경에서는 빌드 및 배포에 최적화된 Javascript 파일을 만들기 위한 웹서버를 만드는 코드를 작성해야합니다.

FROM node:14-alpine

WORKDIR /app

COPY package.json .

RUN npm install

COPY . .

CMD [ "npm", "run", "build" ]

Multi-Stage Builds

파일 내부에 ‘스테이지’라고 하는 여러 빌드 단계 또는 설정 단계를 정의하는 하나의 Dockerfile을 가질 수 있습니다.

스테이지는 서로의 결과를 복사할 수 있으므로, 최적화된 파일을 생성하는 스테이지와 해당 생성된 파일을 제공하는 스테이지로 나눠지게 되며 위에서 아래로 단계별로 모든 스테이지를 거쳐 전체 Dockerfile을 빌드할 수 있습니다.

또는 빌드 단계를 건너뛰어 빌드하기 위해서 개별 스테이지를 선택할 수 있습니다.

# as를 추가하여 스테이지명을 설정 가능
FROM node:14-alpine as build

WORKDIR /app

COPY package.json .

RUN npm install

COPY . .

RUN npm run build

# 명령 후에 다른 베이스 이미지로 전환
# 빌드 과정에만 node 환경이 필요하기 때문입니다.
# FROM을 통해 새로운 스테이지를 만들며 동일한 이미지를 가져온다 하더라도 새로운 스테이지로 생성됩니다.
FROM nginx:stable-alpine

# 빌드 스테이지를 참조하여 가져옵니다
# 빌드 과정 중 /build 폴더에 저장하기 때문에 따로 경로를 지정  
COPY --from=build /app/build /usr/share/nginx/html

EXPOSE 80

CMD ["nginx", "-g", "daemon off;"]
# 브라우저는 기본적으로 응답을 준 서버의 도메인으로 그대로 전송합니다.
# 만약 다른 도메인으로 요청을 보내야한다면 따로 도메인 변경이 필요합니다.
const domain = "http://localhost/.."

Dockerfile RUN & CMD의 차이

RUN

CMD

요약