간단히 react 프로젝트를 Docker로 이미지화

프런트 앤드와 백앤드를 동시에 하면서

Docker에 대해 공부하게 되어 다음에 프런트 프로젝트에 사용하기 위해 정리해요

 

프런트 앤드만 하다가 백앤드까지 하려고 하니

무지가 너무 많이 발목을 잡아 힘드네요~

 

 

그래서 한 가지 한 가지씩 작업할 때마다 정리하려고 해요

 

내가 하는 게 정답이 아니고 아직 배우고 공부하는 중이라 한번 정리로 끝내지 않을 예정이다.

 

Docker 정리하기

1. Docker 설치하기
    OS에 맞게 Docker를 아래 사이트에서 다운로드하여 설치

    https://www.docker.com/

Docker: Accelerated, Containerized Application Development

 

2. react 프로젝트 root 폴더에 Dockerfile 파일 제작

  root 폴더에 Docker 만들어서 아래 내용 붙여 넣기

FROM node:16

# 앱 디렉터리 생성
WORKDIR /app

# 앱 의존성 설치
# 가능한 경우(npm@5+) package.json과 package-lock.json을 모두 복사하기 위해
# 와일드카드를 사용
COPY package*.json ./

RUN yarn install
# 프로덕션을 위한 코드를 빌드하는 경우
# RUN npm ci --only=production

# 앱 소스 추가
COPY . .

RUN yarn build

CMD ["yarn", "start"]

# docker run --restart always -p 3002:3002 -d inome/test01 <- 재부팅시 실행
# docker ps 실행중인 도커 확인
# docker images 이미지 목록

 

3. react root폴더에 .dockerignore 파일 제작

  도커로 이미지를 화 할 경우 불필요한 파일을 이미지화에서 제거하기 위해 설정

.git
.gitignore
node_modules
build
Dockerfile
README.md

 

4. 이미지 제작

  작업이 완료된 후 도커 명령어를 이용해 이미지 제작

  - docker build . -t 프로젝트명

  예시) docker build . -t inome/test01_v3

  프로젝트명을 설정하여 위 명령어를 실행하면 이미지가 생성됨.

 

 

 

5. 이미지 제작 확인

  docker images
  위 명령어로 생성된 이미지 확인 가능

   REPOSITORY                 TAG       IMAGE ID            CREATED        SIZE

   inome/node-web-app   latest    2636cf378f30   13 days ago    867MB

  위와 같은 정보가 노출됩니다.

 

6. 생성된 이미지 중 사용할 컨테이너 실행

  docker run -p 포트:포트 -d 프로젝트명

  예시) docker run -p 3002:3002 -d inome/test01_v3

  위 명령어로 컨테이너를 실행하면 서버를 실행한 것처럼 계속 돌아가는 것을 확인할 수 있다.

 

7. 컨테이너 실행 확인

  docker ps

  명령어를 통해 현재 구동되고 있는 컨테이너 확인 가능

  CONTAINER ID     IMAGE                    COMMAND                       CREATED       STATUS             PORTS                

  NAMES

  6edb4e171d5b     inome/test01_v1   "docker-entrypoint.s…"   12 days ago   Up 3 seconds   0.0.0.0:3002->3002/tcp  

  epic_sinoussi

  실행된 컨테이너 확인 가능

  

컨테이너가 실행된 이후

  프로젝트를 수정하여 새로 이미지를 말았을 경우 기존의 컨테이너를 멈추고 새로운 컨테이너로 실행

  프로그램을 설치하였을 경우 ui로 실행 및 정지 삭제 등 기능을 편하게 수행 가능합니다.

 

자주 사용하는 명령어

  컨테이너 정지 : docker start <컨테이너 ID>  :  docker start 6edb4e171d5b

  컨테이너 시작 : docker stop <컨테이너 ID>  :  docker stop 6edb4e171d5b

 

 

여기까지 간단히 Docker 이미지 및 컨테이너 실행 방법입니다.