인프라/Docker

[Docker] Docker로 Node.js 개발환경 세팅하기(feat. M1 Macbook)

jwKim96 2021. 7. 22. 20:19

윈도우 노트북을 사용할때는 이것 저것 설치하고, workspace 디렉토리만 분리하여 사용했었습니다.

이렇게 사용하다보니 여러 문제점에 직면했었습니다.

1. 다양한 Runtime설치로 인해 PC가 혼잡해짐(Java, PHP, Python, Node.js 등등..)
2. 패키지 매니저가 전역으로 설치한 패키지 관리가 힘듦(pip 네 이녀석...)
3. 개발환경 이식의 어려움

하지만, 최근에 맥북을 사용하게되니 이전처럼 막 굴리고 싶지 않았습니다.(맥북은 소중하니까요)

그래서 Docker로 개발 Runtime을 만들고, 이 환경에서 개발해보려 합니다.

게다가 배포서버와 흡사한 환경에서 개발하며 배포환경 검증도 되니 시도해볼 이유는 충분하겠죠?


0. 준비할 사항

위 항목들을 설치하면 준비 끝!


1. 개발환경 설정

전체 프로세스를 요약하면 이렇습니다.

프로세스
Node 이미지 받기 > 컨테이너 실행 > docker commit > 개발~!

각 과정에 대한 추가적인 설명은 아래에서 할 예정이니, 천천히 따라와 주시면 됩니다.

1) Node 이미지 받기

현재 Node.js는 LTS버전이 14.16.1 이라서, 이 버전으로 개발환경을 구성할 예정입니다.

명령어는 아래와 같습니다.

Usage:  docker pull [OPTIONS] NAME[:TAG|@DIGEST]

mac > docker pull node:14.16.1
  • docker pull
    docker pull 명령어는 Docker hub에서 도커 이미지를 로컬 PC로 가져오는 행위
  • node:14.16.1
    ':'를 기준으로 왼쪽은 이미지 이름, 오른쪽은 tag를 의미합니다.
    이미지의 이름은 {만든사람}/{이미지 이름} 형태가 기본인데, {만든사람} 이 붙어있지 않은 것들은
    Docker에서 인증된(공식) 이미지 이기 때문에 실제 주소는 아래와 같습니다.
    docker.io/library/node:14.16.1
    조금 더 자세히 알고싶으신 분은 44bit.io에서 너무 잘 정리해 놓았기 때문에 참고하시면 됩니다.

만약 다른 버전을 사용하고싶다면, Docker Hub에서 자신이 원하는 버전 tag를 검색하고

그 tag를 이미지 이름 뒤에 붙여주면 됩니다.

mac > docker pull node:{tag}

2) Node 이미지 실행

Node 이미지를 실행하기 전에, 로컬로 가져온 이미지를 확인해봅시다.

mac > docker images

REPOSITORY   TAG       IMAGE ID       CREATED        SIZE
node         14.16.1   78e285915101   3 weeks ago    890MB

전 예전에 받아놓아서 CREATED가 3 weeks ago로 나오지만, 여러분은 ~ seconds ago로 나올겁니다.

이제 Docker image에 무언가 명령(컨테이너 생성, 삭제 등등..)을 내려야 합니다.

만약, image가 하나가 아니라 여러개라면 어떨까요?

mac > docker images

REPOSITORY   TAG               IMAGE ID       CREATED        SIZE
node         14.16.1           78e285915101   3 weeks ago    890MB
node         14.16.1-buster    954682671d3f   3 weeks ago    890MB

특정 이미지를 호출하는 방식에는 두 가지 방식이 있습니다.

  • REPOSITORY:TAG
  • IMAGE ID

REPOSITORY:TAG는 1)과 동일한 방법이고, IMAGE ID는 docker가 IMAGE에 부여한 고유ID 입니다.

그래서 우리가 Node 이미지를 컨테이너로 실행하기 위해서는 아래와 같이 실행하면 됩니다.
(알아보기 쉽고, 명령어를 작성하기 편하기 때문에 위 방법을 주로 사용함)

Usage:  docker run [OPTIONS] IMAGE [COMMAND] [ARG...]

mac > docker run -d -it --name node_app node:14.16.1
9c2169e5187b801be1943d5f9611fb853f0c43576ef5dd2e9b4f3b9d95ed0f75

실행하면 아래에 컨테이너의 고유값이 출력되고 컨테이너가 실행됩니다.

  • docker run
    도커 이미지로 컨테이너를 실행
  • -d
    --detach의 약자로, 컨테이너를 백그라운드에서 실행하고 Container ID를 출력하는 옵션
  • -it
    -i, -t 둘을 조합하여 많이 쓰이며, 컨테이너를 종료하지 않은 채로 terminal의 입력을
    컨테이너로 전달하기 위해서 사용
    이 옵션을 사용하면, 컨테이너의 Shell이나 CLI를 사용할 수 있음
  • --name
    별칭을 붙여 Container ID 대신에 사용할 수 있게 해줌

docker run에 대한 더 자세한 설명은 여기를 참고하세요.

아래 명령어 및 docker desktop을 통해 실행되고 있는 컨테이너를 확인할 수 있습니다.

mac > docker ps -a
CONTAINER ID   IMAGE           COMMAND                  CREATED         STATUS         PORTS                    NAMES
9c2169e5187b   node:14.16.1    "docker-entrypoint.s…"   4 minutes ago   Up 4 minutes                            node_app

도커 데스크탑 이미지

3) 컨테이너 마운트

이제 컨테이너에 로컬 디렉토리를 연결(마운트) 해보겠습니다.

마운트는 기존 파일 시스템에 새로운 저장장치의 경로를 넣는것을 의미합니다.

이해가 안된다면, 쉽게 공유디렉토리처럼 사용할 수 있다고 생각하고 넘어가시면 됩니다.

로컬의 /Users/jinan159/node-app 디렉토리를 컨테이너의 /app경로로 마운트 해보겠습니다.

이전 단계에서 사용한 명령어에 아래 부분만 추가하시면 됩니다.

-v /Users/jinan159/node-app:/app

mac > docker run -d -it --name node_app -v /Users/jinan159/node-app:/app node:14.16.1
9c2169e5187b801be1943d5f9611fb853f0c43576ef5dd2e9b4f3b9d95ed0f75
  • -v {path1}:{path2}
    -v 옵션은 로컬 디렉토리 path1을 컨테이너의 path2 디렉토리바인딩 합니다.
    이때 디렉토리 내 파일 우선권은 path1이 가집니다.
    즉, path2의 파일들은 지워지고 path1의 파일들이 그 자리를 채웁니다.

이제 진짜 두 디렉토리가 연결됐는지 볼까요?

맥에서(로컬 디렉토리)

 mac > cd /Users/jinan159/node-app
 mac > touche hello-world
 mac > ls
 hello-world

도커에서(컨테이너 디렉토리)

 docker > cd /app
 docker > ls
 hello-world

맥에서 생성한 hello-world 파일이 컨테이너에도 생성된 것을 알 수 있습니다.

이제 Visual Studio Code를 실행하고 /Users/jinan159/node-app 디렉토리를 열어봅시다.

그리고 Mac(control + `) Windows(Ctrl + `)단축키로 터미널을 열고 아래 명령어로 컨테이너의 쉘에 접속합니다.

vscode > docker exec -it node_app /bin/bash

이제 개발을 위한 모든 준비는 끝났습니다.

추가

전 도커 명령어를 매번 쓰는것이 귀찮아서 README.md로 작성하여 저장하여 사용합니다.
(사진의 Preview는 Markdown Preview Enhanced Extention 입니다.)

4) docker commit 으로 개발환경 image로 저장

만약, node-app 컨테이너를 실수로 remove 한다면 어떤 일이 벌어질까요?

일단 컨테이너의 /app 경로의 데이터는/Users/jinan159/node-app 아래에 모두 보존됩니다.

하지만 npm으로 전역에 설치한 패키지나, apt 혹은 yarn으로 추가 설치한 패키지는 당연히 모두 지워집니다.

이 위 내용을 모두 보존하기 위해서는 docker commit 이라는 명령어를 사용하면 됩니다.

docker commit 명령어는 현재 컨테이너의 상태를 이미지로 만드는 명령어 입니다.

Usage:  docker commit [OPTIONS] CONTAINER [REPOSITORY[:TAG]]

mac > docker commit node-app node-app:0.0.1

이제 이미지가 제대로 생성되었는지 확인해 보겠습니다.

mac > docker images

REPOSITORY   TAG       IMAGE ID       CREATED        SIZE
node         14.16.1   78e285915101   3 weeks ago    890MB
node-app     0.0.1.    0a571c1d3387   1 minutes ago  890MB

이제 우리는 맥을 더럽히지(?) 않고 개발할 수 있게 되었습니다🤣

긴 글 읽어주셔서 감사합니다


잘못된 부분, 오타 지적은 언제나 환영입니다!