도커 & CI (6) 도커로 배포

단일 컨테이너

• 리액트 프레임워크를 사용하여 리액트 프로젝트를 도커에 올리려고 한다. 먼저 Dockerfile을 정의해둔다.

FROM node:alpine

WORKDIR /usr/src/app

COPY package.json ./

RUN npm install

COPY ./ ./

CMD [ "npm" , "run",'start']

• 이제 빌드를 해야 하는데 Dockerfile은 dev와 prod 버전으로 나뉠 것이다. 그래서 빌드 시 옵션으로 어떤 파일을 사용할 것인지 명시해야 한다.

docker build -f Dockerfile.dev ./

node_modules

• 빌드시 node module이 중복될 수도 있다. 즉 Dockerfile 중

...

// 아래가 실행되면서 node_modules 생성
RUN npm install

// 그런데 COPY를 하면서 로컬의 node_modules을 한번더 가져옴 
COPY ./ ./

...

• 그래서 docker 환경에서 개발할 때는 node_modules를 제거해도 된다!

port

• 3000번 포트에서 동작할 수 있도록 run 할 때 포트 맵핑을 해줘야 한다

docker run -it -p 3000:3000 이미지이름

볼륨으로 소스 변경

• 도커 컨테이너에서 로컬 머신에 있는 파일을 참조하는 방식을 볼륨이라한다.

docker run -it -p 3000:3000 -v /usr/src/app/node_modules -v $(pwd):/usr/src/app <이미지 아이디>

위 스크립트에서

-v /usr/src/app/node_modules

는 node_modules의 참조는 건너뛰라는 뜻이고

${pwd}:/usr/src/app

는 현재 경로에 있는 디렉토리를 /usr/src/app경로에서 참조하라는 것

컴포즈로 명령어 간단하게

• docker-compose.yml을 작성하여 명령어를 단축시킨다

version: "3"
services:
  react:
    build:
      context: .
      dockerfile: Dockerfile.dev
    ports: 
    - "3000:3000"
    volumes:
      - /usr/src/app/node_modules
      - ./:/usr/src/app
    stdin_open: true

• docker-compose up으로 실행

• test도 관련 스크립트도 추가

  tests:
    build:
      context: .
      dockerfile: Dockerfile.dev
    volumes:
      - /usr/src/app/node_modules
      - ./:/usr/src/app
    command: ["npm","run","test"]

운영 환경

• 운영 환경에서 도커 파일은 2가지 단계로 나뉨
• 먼저 빌드 파일 생성(Builder Stage)
• 그리고 Nginx를 실행시켜 전 단계에서 생성한 빌드 파일을 뒙브라우저의 요청에 따라 제공(Run Stage)

// 다음 FROM 전까지는 빌더 단계임
FROM node:alpine as builder

WORKDIR /usr/src/app

COPY package.json ./

RUN npm install

COPY ./ ./

CMD ["npm", "run", "start"]

FROM nginx
COPY --from=builder /usr/src/app/build /usr/share/nginx/html

• 이제 재빌드를 해보자

docker build .

• 이제 run을 해보자

docker run -p 8080:80 이미지 이름

** Nginx 기본 포트는 80임

run까지 해보면 8080포트에서 작동함을 확인할 수 있다