간단한 Express 프로젝트 Dockerizing 해보기

지금까지의 스퍼트 프로젝트 진행상황을 얘기해보자면.. 약 2주가 넘는 시간동안 여러 피드백을 받아오며 블로그의 필수적인 기능은 다 구현했다고 할 수 있겠다. 회원가입, 로그인, 게시글 및 카테고리, 태그, 댓글 기능 등 Notion에 정리한 내용을 봐도 되고 Github의 commit message를 읽어도 대충 어떤 기능을 구현했는지 알 수 있을 것이다. 기능 뿐만 아니라 여러 요구사항들을 하나 둘씩 해결해가면서 내가 급속도로 성장중이구나를 느끼는 중인데 거의 막바지에 다다른 지금, 또다른 문제가 생겼다. 다름아닌 도커라이징이다.

도커(Docker) 가볍게 입문해보기 - 1부터 3까지 공부한 내용과 막막했던 나에게 길잡이가 되어준 어느 블로그의 내용을 참고하여 이제 Express 프로젝트를 도커라이징해보자.

[Docker] Node.js 웹 앱의 도커라이징

간단한 프로젝트 만들기

일단 docker-test라는 이름으로 테스트용 새로운 프로젝트를 생성한다. $ express docker-test 커맨드를 실행하여 프로젝트를 만들고 해당 디렉터리로 이동하여 $ npm install express 와 $ npm init -y 커맨드를 차례대로 실행하여 기본 작업을 마친다. 이후에 테스트용 서버인 server.js를 다음과 같이 작성한다.

server.js

var express = require("express")

var http = require("http")
var path = require("path")

var app = express()

app.set("port", 3000)
app.set("views", path.join(__dirname, "views"))
app.set("view engine", "jade")

app.all("*", (req, res) => {
  res.render("index")
})

http.createServer(app).listen(app.get("port"), () => {
  console.log("Express server listening on port " + app.get("port"))
})

index.jade

p Hello World

결론적으로 $ node server 커맨드를 실행하면 localhost:3000 에서 Hello World가 출력되는 아주 간단한 예제이다. 이제 Dockerfile을 작성해보자.

Dockerfile

FROM node:latest

WORKDIR /usr/src/app

COPY package*.json ./

RUN npm install

COPY . .

EXPOSE 3000

CMD [ "node", "server.js" ]

실제로 파일을 작성했을 때 Dockerfile이 아닌 dockerfile으로 D가 소문자인 도커 파일을 만들었는데 딱히 문제는 없었지만 혹시 모르니 다음부터는 대문자를 신경쓰자..

Dockerfile 내용 정리

내가 작성중인 실제 프로젝트도 Node.js의 버전을 따로 지정해주지 않고 최신 버전을 사용했기 때문에 latest 버전을 사용한다고 명시한다.

FROM node:latest

이미지 안에 애플리케이션 코드를 넣기 위한 작업 디렉터리를 생성한다.

WORKDIR /usr/src/app

package.json 과 package-lock.json 파일을 모두 복사하기 위해 * 를 사용했으며 필요한 모듈 등을 $ npm isntall 로 설치한다.

COPY package*.json ./

RUN npm install

COPY . . 을 통해 이미지 내에 앱의 모든 소스코드를 넣는다.

COPY . .

docker 데몬에 바인딩되어 있는 3000번 포트를 매핑한다.

EXPOSE 3000

$ node server.js 커맨드를 실행하도록 하여 서버를 구동시킨다.

CMD [ "node", "server.js" ]

.dockerignore

node_modules/
npm-debug.log

위와 같이 .dockerignore 파일을 작성하여 이미지에 node_modules와 디버깅 로그가 복사되는 걸 막아 이미지에 설치된 모듈을 덮어쓰지 않게 한다.

위의 과정을 모두 끝냈다면 이미지로 만들어보자. 프로젝트가 있는 디렉터리로 이동하여 $ docker build . -t docker-test 커맨드를 실행하여 이미지를 만든다. 기본 터미널로 해도 상관없지만 참고한 블로그에 나와있던 것처럼 다음과 같이 vscode 터미널로 실행했다.

이미지가 잘 생성됐는지 확인하기 위해 $ docker images | grep docker-test 커맨드를 실행하면 다음과 같이 정상적으로 이미지가 생성된 것을 확인할 수 있다.

물론 다음과 같이 Docker Desktop에서 직접 눈으로 확인할 수도 있다.

연습하면서 만들어둔 이미작 좀 많아서 지저분한데 도커가 좀 더 익숙해지면 정리해야겠다..

아무튼 $ docker run -d --name docker-test -p 9000:3000 docker-test 커맨드를 실행하여 docker-test 이미지를 컨테이너로 실행한다.

$ docker ps 커맨드를 실행하면 컨테이너가 정상적으로 실행되는 것을 확인할 수 있고 물론 Docker Desktop에서도 확인할 수 있다.

이제 localhost:9000 으로 접속해보면 처음에 It works!가 한 번 뜨고 새로고침해주면 다음과 같이 Hello World가 정상적으로 출력되는 것을 확인할 수 있다.

---

결론

간단한 Express 프로젝트를 도커라이징해봤다. 오늘은 시간이 늦었으니 빠르면 내일 안으로 실제 작성중인 프로젝트를 도커라이징하고 추가 요구사항을 만족하는 과정을 진행해야겠다. 제발 별다른 오류 없이 잘 진행되기를..