본문 바로가기

Development/Javascript | Node.js

Node.js 를 우분투 환경설정

Node.js 를 개발환경에서 구축하기란 참으로 쉬웠다. 공식홈페이지 (https://nodejs.org) 에서 OS 에 맞게 다운로드 받고

설치하면 그 뿐이었는데, 실제 환경으로 올려서 빌드하고 서비스를 띄우려고 하니... 갑갑해졌다;;

그래서 다음과 같이 순서를 정하여 진행하였다.

  1. 우분투 (18.04 LTS) 에 Node.js 설치
  2. 서비스 구동
    1. Example // Server.js
    2. Nuxt/Express
  3. 기존에 설치된 엔진엑스 (Nginx) 에 구동된 Node.js 서비스를 Proxy
  4. 프로세스 관리

1. 우분투 (18.04 LTS) 에 Node.js 설치


먼저 Node.js 를 설치해야 하는데 설치하고자 하는 버전을 깃허브에 들어가서 확인할 수 있다. Node.js Source GITHUB


$ apt-get install g++ curl libssl-dev git-core make
$ curl -sL https://deb.nodesource.com/{version} | sudo -E bash –

위와 같이 Node.js 소스를 받아오게 되면 apt-get 으로 설치를 진행한다.

$ apt-get install -y nodejs
$ dpkg -list | grep nodejs

Node.js 설치가 완료되었다면 npm 을 실행하여 버전을 확인해본다.

$ npm -v

이제 정상적으로 Node.js 설치가 완료된 것이다.


2. 서비스 구동

이제 원하는 위치에 테스트 디렉토리와 파일을 만들어 서비스를 구동해 본다.

$ mkdir /workspace/node $ cd /workspace/node $ vi ./node-server.js

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.write('--------------------------------------------' + "\n");
  res.write('Hello World!');
  res.write('--------------------------------------------' + "\n");
  res.end();
}).listen(3000);

나는 /workspace/node 디렉토리에 node-server.js 파일을 만들었다.

이제 실행을 시켜본다. 다음은 Node.js 로 실행시킨 서버에 curl 로 접근하여 확인해본 화면입니다.



이제 그럼 해당 서비스를 종료하고 Nuxt.js 스택의 서비스를 구동시켜 본다. ( Nuxt.js 구동 브라우저 화면은 skip )

물론 사전에 업로드된 Nuxt.js 프로젝트의 디렉토리로 이동한다.



위 화면은 Nuxt.js 로 구성된 프로젝트 디렉토리에서 npm run dev 를 실행한 화면이다.

그럼 이제 정상적으로 모든 서비스 구동 테스트는 확인하여 완료된 것이다.


3. 기존에 설치된 엔진엑스 (Nginx) 에 구동된 Node.js 서비스를 Proxy

이제부터 삽질을 예상된다. 하지만 이 역시 잘 견뎌 내왔다.

여기서부터는 엔진엑스 (Nginx) 서버에 구동된 Node.js 서버를 Proxy 프록시로 연결할 것이다

그럼 지정된 서버의 80포트로 접근하여 Node.js 서버로 구성 완료된 화면을 나타낼 것 이다.

이 상황은 엔진엑스 설치가 완료 되었다는 가정하에 진행합니다.

$ cd /etc/nginx/conf.d
$ vi ./example.conf

위 코드 상 vi 편집기로 ./example.conf 를 수정하여 다음과 같이 작성한다.

upstream node { server localhost:3000; } server { listen 80; server_name example; #디렉토리 경로 location / { proxy_pass http://node; proxy_set_header X-NginX-Proxy true; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; proxy_set_header X-Client-Verify SUCCESS; #proxy_set_header X-Client-DN $ssl_client_s_dn; #proxy_set_header X-SSL-Subject $ssl_client_s_dn; #proxy_set_header X-SSL-Issuer $ssl_client_i_dn; proxy_read_timeout 1800; proxy_connect_timeout 1800; proxy_redirect off; } log_not_found off; }

그리고 서비스 재시작

$ service nginx restart

이제 브라우저에서 확인해서 정상적으로 나타나는 것을 확인. (아래 그림에서는 host 파일에 127.0.0.1    example 상태이므로 example 로 접속)


4. 프로세스 관리

이제 정상적으로 서비스가 프록시까지 완료 되었으니, 프로세스 관리 하기위해 pm2 패키지 모듈을 설치한다. (패키지 모듈 공식 사이트)
여기 포스팅(https://blog.outsider.ne.kr/1197) 에 가면 pm2 모듈에 대하여 사용법이 잘 포스팅 되어 있습니다.



$ npm install pm2 -g

하여 pm2 까지 설치가 완료 되었다면 해당 서비스 디렉토리로 가서 pm2 를 이용하여 서비스를 실행하면 된다.

이에 더 공부하기 싫었기에 나는 쉘스크립트로 대충 파일을 만들어 쉡스크립트를 통하여 프로세스를 실행시켰다.

아래 내용은 쉘스크립트 파일 내용이며 파일명은 start.app.sh 로 생성.


$ vi start.app.sh
$ #!/bin/bash
$ echo "Find Service Directory"
$ cd ~/workspace/example
$
$ echo "Now : " & pwd
$ echo "Project Building.. "
$ npm run build
$
$ echo "Project Run.."
$ # Nuxt.js Project RUN
$ pm2 start npm --name "example" -- run start

간단한 스크립트로서 프로젝트 디렉토리로 이동하여 프로젝트를 빌드하고 구동시키는 것 까지 완료로 한다.