Sitemap

Docker로 협업하기 — Node.js 웹서버를 Docker로 배포하기

7 min readJul 4, 2020

--

개인 프로젝트를 하다보면, 어떤 사람은 Mac을 사용하고 어떤 사람은 Windows 컴퓨터를 사용한다. 사용해야할 서버가 마땅치 않을 때는 , 이들 모두에게 local 컴퓨터에서 서버가 구동될 수 있는 환경을 만들어주어야 하는데, Mac과 Window는 확실히 다르기 때문에 환경을 맞추기가 쉽지 않다. 그렇다고 AWS나 GCP와 같은 클라우드 서비스를 활용하자니 돈없는 사람에겐 가혹하다. 그나마 GCP는 300달러를 무료로 제공하고 300달러를 모두 다 쓰거나, 1년을 채웠을 경우에 서비스가 자동으로 중단되지만, AWS는 프리티어를 모두 소진하면 바로 과금이 되버리는 불상사가 발생한다.

그래서! Docker를 활용하면 쉽게 환경을 구축할 수 있다. 사용 방식은 git과 비슷하다. 자신이 만든 웹 서버를 Docker hub에 push 해놓고, 서버를 local 컴퓨터에서 실행시킬 때는 pull을 받아서 사용하면 된다.

  • 1 . 설치

먼저 docker를 설치해보자. 설치 방식은 매우 간단하다.

mac을 사용하는 사람은 아래 주소로 이동하여, 오른쪽의 Get Docker 버튼을 클릭하여 다운로드하고 설치하면 끝~

window를 사용하는 사람도 똑같이 아래 주소에서 다운로드 받고 설치하면 끝이다.

  • 2. 이미지 만들기

docker는 기본적으로 “이미지”라는 것을 만든다. window에서 exe 파일 같은 녀석이다. 그리고 이 이미지를 실행시키면 “container”가 생성된다. 이 container는 마치 윈도우에서 exe를 실행시키면 하나의 프로세스가 생기는 것과 같은 개념이다.

이미지를 만들어보자.

이미지를 만들기 위해 우선 간단하게 Node.js + express 로 웹서버를 하나 만들어보자. ‘/’, GET으로 request를 보내면 ‘Hello World!’를 response로 보내주는 웹서버 예제이다.

$ npm init
$ npm install --save express
// cmd에서 원하는 경로로 이동 후, npm init을 하면 자동으로 node.js 서버 환경이 구성된다. (package.json 생성)
// express도 설치해준다.
// 자신이 사용하는 에디터로 npm init으로 설치한 프로젝트를 열고, index.js 파일을 만든다.// index.jsconst express = require('express')const port = 3000; //3000번 포트
const host = '0.0.0.0';
const app = express();app.get('/', (req, res) => {
res.send('Hello World!')
});
app.listen(port, host);console.log('server start!')

위 예제대로 웹서버가 정상적으로 만들어졌다면, cmd에서 node index.js 명령어 실행 뒤, insomnia나 postman 같은 툴로 테스트를 해보면 다음과 같이 응답이 제대로 오는 것을 알 수 있다.

method는 GET, uri는 http://localhost:3000/으로 요청하면 된다.

테스트가 완료되어 정상적으로 작동한다면, index.js가 있는 폴더에 “DockerFile”이라는 이름으로 파일을 하나 생성해주자. 생성하면, 다음과 같이 돌고래모양(Docker의 상징…)의 아이콘이 보인다.

이 파일은, image를 만들기 위한 setting을 작성해주는 파일이다.

FROM node:12WORKDIR /usr/src/appCOPY package*.json ./RUN npm installCOPY . .EXPOSE 8080CMD [ "node", "index.js" ]

FROM은 이미지의 베이스 이미지를 설정하는 명령어이다. 방금 만든 웹서버는 Node.js로 만들었으므로, Node.js의 베이스 이미지를 가져오자.

WORKDIR은 이미지가 실행될 작업디렉토리이다.

COPY 명령어로 package.json을 복사한 뒤, 이를 RUN 명령어로 “npm install”이라는 명령어로 실행한다. 8080 포트로 요청이 들어올 수 있도록 EXPOSE 명령어를 사용하였다.

마지막으로, CMD에 docker image가 실행될 때, 서버가 실행 될 수 있도록 명령어를 입력해준다. “node index.js” 명령어가 실행 명령어 이므로 위와 같이 넣어주었다.

이렇게 setting은 끝났다. 이제 진짜 이미지를 만들어보자.

$ docker build -t {Dockerhub 이름(user 이름)/이미지 이름}:tag이름

위와 같이 명령어를 실행해주면 docker 이미지가 생성된다.

(Dockerhub 이름 (user 이름) 이부분은 자신의 docker hub 아이디로 입력을 해야한다. 안그러면 나중에 dockerhub에 업로드가 안될 수 있다.)

success 가 보이면 이미지 만들기 성공! docker images 명령어를 입력하여 잘 만들어졌는지 확인해보면 된다.

  • 3. 이미지 실행하기 (container로 만들기)

이는 아주 간단하다. 다음과 같이 명령어를 입력해주면 실행 끝~

$ docker run -p 3000:8080 {Dockerhub 이름(user 이름)/이미지 이름}:tag이름

이 명령어를 입력해주고, docker ps 명령어를 입력하면 container가 생성된게 보일 것이다.

  • 4. 서버 테스트해보기

마지막으로 container가 만들어지면서 서버가 제대로 실행됐는지 확인해보자. 테스트는 아까처럼 insomnia나 postman으로 똑같이 요청을 보내보면 된다.

아까처럼 이렇게 나오면 성공!

정상적으로 docker 서버 이미지를 만들었다! 이제 이 이미지를 docker hub에 업로드 해보자.

  • 5. docker hub에 업로드하기

docker hub에 업로드하기 위해서는 우선 docker login으로 개인 계정에 먼저 로그인을 해야한다.

$ docker login

이대로 치면 id와 패스워드를 입력할 수 있다. 정상적으로 입력하면 Login Succeed와 함께 로그인된다.

로그인 후에도 아주 간단하다.

$ docker push {Dockerhub 이름(user 이름)/이미지 이름}:tag이름

해주면 docker hub에 업로드되어 있는 것이 보일 것이다.

이러면 간단하게 업로드까지 끝~

  • 6. front-end 개발자들에게 전달~

이제 이렇게 올리면 front-end 개발자들 (모바일, 웹)이 pull 받아서 서버 환경을 쉽게 세팅한 후, 개발에 들어가면 아주 간단하다.

$ docker pull {Dockerhub 이름(user 이름)/이미지 이름}:tag이름
$ docker run -p 3000:8080 {Dockerhub 이름(user 이름)/이미지 이름}:tag이름

위와 같이 front-end 개발자들이 커맨드에 입력하면 pull 받고, run 했으므로 local에 똑같이 node 웹서버가 돌아갈 것이다. 이렇게 설정한 후, front-end 개발 시작하면 서버 개발자도, front-end 개발자도 편하게 할 수 있다. (물론 매번 pull 받아야 하는게 귀찮을 수도 있다.) 그렇지만 클라우드를 쓰기에 애매한 경우일 때, 모든 로컬 컴퓨터에 개발 환경을 서버가 돌아가도록 다 세팅하지 않아도 docker로 쉽게 세팅할 수 있으니 이 얼마나 편한가.

모두 즐거운 협업 되시길~

--

--

No responses yet