직접 만든 블로그를 배포해보자!

Gatsby로 블로그 만들기! 에서 배포하는 방법을 설명하다 멈추었다!

그래서 이번 포스팅에서는 pm2와 npx에 대해 설명한 후 이를 이용하여 내 블로그를 배포하는 방법을 설명할 것이다!

pm2, npx란 ?? 🙄🙄

PM2(Process Manager 2)

PM2는 LB(Load balancer)가 내장된 Node.js Application의 Production Process Manager이다. Application의 상태를 지속적으로 관리하며, 프로세스에 문제가 있다면 재시작함으로써 프로세스를 영구적으로 유지한다.

또한 PM2에는 Cluster 기능이 있다.

어떠한 요청을 받아 async(비동기)로 처리한다고 해도 요청의 양이 크거나, 그 수가 많아 서버가 감당할 수 있는 수준을 넘어버린다면 서버는 죽어버린다..

이때 필요한 것이 Cluster이다.

PM2의 Cluster는 app(server).js와 같은 node 파일을 지정한 개수만큼 PM2에 등록하고 LB를 통해 부하를 분산시켜준다.

NPX(Node Package Runner)

Node.js를 사용해본 사람 중 npm(node package manager)를 모르는 사람은 없을 것이다. 그래도 혹시 모르는 사람들을 위해서 한 줄로 설명하자면 npm은 Node.js 패키지 생태계로 세계에서 가장 큰 오픈 소스 라이브러리 환경이다.

쉽게 말해 가져다 쓸 수 있는 게 가장 많은 곳이라는 거다!

npx는 npm 5.2버전부터 기본 패키지로 제공되기 시작한 모듈이다.

npx를 쓰는 이유로는 npm run scripts 없이 사용할 경우, 한 번만 사용할 커맨드를 실행할 때 등이 있다! 참고 Link

그중 내가 사용한 이유는 2가지이다. - npx는 이미 설치된 바이너리를 실행한다면 기본적으로 overhead가 없다 -> 실행이 빠르다

- Page를 Load 하는 데 드는 Resources의 값이 가장 적다.

bulid 폴더를 배포하게 도와주는 serve 기능은 yarn, npm, pm2, gatsby에도 있다.

다 사용해 보았지만, Page Load Resources의 값이 npx가 가장 적었다.

(이유에 대해서 구글링도 많이 해봤지만, 못 찾았다 ㅠ) 😱😱

배포

그래서 나는 pm2로 프로세스를 영구적으로 유지하고 Cluster도 사용하여 LB를 통해 부하를 분산시키기로 했다. 그리고 serve는 npx를 사용한다.

그러면 pm2 안에서 npx serve를 사용해 보자 ~

deploy.config.js

module.exports = {
  name: 'binary01.me', //pm2로 실행한 프로세스의 이름 지정
  script: 'npx', //pm2로 실행될 파일 or 모듈
  interpreter: 'none', //절대 경로 지정
  args: 'serve public/ -p 80',//public 폴더에 serve 기능을 사용 port는 80번 
  instances : 'max', //instance의 개수 지정, max일 경우 CPU core 수만큼 지정
  exec_mode : 'cluster' //실행 모드를 cluster로 지정 
};

위 코드는 pm2가 사용할 script이다.

코드 내부의 script를 npx로 지정한 후 args: 'serve public/ -p 80'를 입력했다.

다음으로 pm2 start deploy.config.js로 pm2를 실행한다.

이는

pm2 start npx serve public/ -p 80 --name binary01.me -i max

와 같은 의미이다! (Cli에서 -i 옵션으로 cluster 모드를 설정할 수 있다.)

참고 serve -s: -s 옵션은 모든 not-found requests를 index.html로, 즉 main page로 이동하겠다는 의미이다.

마지막으로 package.json의 scripts(npm run script)에

"deploy": "pm2 delete binary01.me && yarn run clean && gatsby build && pm2 start deploy.config.js"

로 deploy라는 npm run script를 추가해주었다.

npm run deploy를 입력하면 아래 사진과 같은 결과를 얻는다.

기존의 pm2 프로세스인 binary01.me를 삭제 후, public/ .cache 폴더를 삭제한다.

다음으로 build를 해준 후, pm2 script인 deploy.config.js로 pm2를 실행한다는 의미이다.

실행 결과 binary01.me라는 프로세스들이 cluster 모드로 생성된 것을 확인할 수 있다.

마무리

이번 포스팅에서는 pm2의 기능들과 npx에 대해 설명한 후, pm2 script 작성, npm run script 작성을 해보았다.

npx에 대해 잘 몰라서 구글링으로 공부하며 작성해서 시간이 오래 걸렸다.. 😓😓

다음 시간에는 블로그에 Google Search Console, Google Analytics, Disqus API를 추가하는 방법에 대해 이야기 할 것이다! 😜😜