시놀로지 Docker로 Nodejs 웹서버 설치하고 띄우기

도커에서 Nodejs웹서버를 설치하고 띄우는 일은 간단하면서도 매우 유용한 작업입니다. 시놀로지 도커(Docker)은 주로 GUI로 설치를 진행하게되어 있어서 편리하기는 하나 아직 참고할 만한 자료들이 별로 없어서 처음 시도할 때는 애를 좀 먹게 되어 있습니다. 그래서 이번에는 시놀로지에 있는 도커(Docker) 스테이션으로 Nodejs 웹서버를 설치하고 실행하는 과정을 포스팅 해보려고 합니다.

전체적인 설명은 이전에 시놀로지 Docker 기본 사용법이라고 포스팅을 했으니 먼저 읽어보시는 것이 좋습니다.

레지스트리에서 nodejs 이미지 다운로드 받기

node.js로 웹서버를 실행시키는 것이 목적이니 먼저 node.js 도커 이미지를 다운로드 받아야 합니다. node.js 도커 이미지를 어디에서든 받아오면 되지만 node.js의 공식 이미지를 Docker Hub에서 제공을 하고 있으니 여기에서 다운로드 받겠습니다.
시놀로지 도커에서는 레지스트리 메뉴에서 기본으로 Docker Hub와 동일한 리스트를 불러와서 제공해 주고 있습니다.

1. 레지스트리 메뉴를 선택합니다
2. 검색창을 이용하여 node를 검색합니다.
3. 검색된 내용중 node를 더블클릭하거나 다운로드 버튼을 클릭하여 다운로드 받습니다.
4. 리스트 중 메달 모양은 공식 이미지란 표시 입니다.
5. 리스트 중 별표는 추천 수 를 표시한 것으로 숫자가 높을 수록 완성도가 높다고 볼 수 있습니다.

다운로드를 선택하면 어떤 버전을 다운로드 받을지 물어봅니다. 특별히 원하는 버전이 없다면 최신버전(lastest)을 다운로드 받습니다.

약간의 시간이 지나 다운로드가 완료되면 이미지 메뉴에서 목록을 확인할 수 있습니다.

1. node의 lastest 버전이 Docker Hub에서 다운로드 받았다는 정보를 확인 할 수 있습니다.
2. 다운로드 받은 도커 이미지의 정보를 확인 할 수 있습니다. 컨테이너를 띄울 때 옵션 설정 시 필요한 정보가 표기되어 있으므로 중요합니다.
3. 오른쪽 끝에는 해당 이미지의 파일 용량을 볼 수 있습니다. node는 906MB네요.

이렇게 이미지를 다운로드 받았습니다. 이미지만 다운로드 받은 것이지 아직 아무것도 아닙니다.
이제 다운로드 받은 이미지를 적당한 옵션을 지정하여 컨테이너로 띄우면 됩니다.

이미지에서 컨테이너 생성시키기

컨테이너를 띄우기 위해서는 아래의 옵션을 순차적으로 설정을 하고 최종 띄우게 되는데요. 여기에서 설정하는 옵션은 Dockerfile과 같은 역활을 한다고 보시면 됩니다.

1. 이미지 메뉴에서 node:lastest 목록을 선택합니다.
2. 실행버튼을 누르든지 아니면 해당 목록을 더블클릭하여 실행시킵니다.
3. 실행이 되면 컨테이너 생성 팝업창이 뜨는데 컨테이너 이름을 입력합니다. 이름은 기존에 있는 다른 컨테이너 이름과 중복이 되면 안됩니다.
4. 고급설정을 클릭합니다.

높은권한을 사용하여 컨테이너 실행과 리소스 제한 활성화는 특별한 경우가 아니면 선택하지 않아도 됩니다.

고급설정 하기

1. 자동 재시작 활성화는 무슨 이유에서 해당 컨테이너가 죽는 경우 자동으로 재실행을 시켜주는 옵션입니다. 실제 중요하게 서비스 하는 프로덕트인 경우 외에는 선택할 필요는 없습니다.
2. 바탕화면 바로가기 생성(별로 중요하지 않은 옵션)
   • 상태페이지를 선택할 경우 DSM 바탕화면에 있는 아이콘을 클릭하면 도커의 상태페이지를 보여 줍니다.
   • 웹페이지를 선택할 경우 DSM 바탕화면에 있는 아이콘을 클릭하면 해당 화면이 보여질 웹페이지가 띄워 집니다.

다음은 볼륨을 추가 합니다. 볼륨은 로컬에 위치한 폴더와 가상의 컴퓨터에 위치한 폴더를 실시간 동기화 시켜주는 역활을 합니다. 쉽게 말하면 지정된 로컬의 폴더에 index.html을 저장하면 실시간으로 가상 컴퓨터의 지정된 폴더에 복사가 된다는 것입니다. 그래서 가상의 node.js서버가 가상의 컴퓨터 폴더에 저장된 index.html을 읽어서 보여지게 됩니다. 그렇게 로컬의 폴더와 가상의 폴더를 연결시켜주는 설정입니다.

하지만 로컬의 폴더 위치 같은경우 내가 원하는 적절한 곳을 임의로 선택하면 되지만 가상의 컴퓨터의 폴더 위치는 지정된 곳일 텐데 그곳을 알 수가 없습니다.
이러한 정보를 확인하기 위해서는 위에서 잠깐 언급했던 이미지 정보 웹페이지 화면을 다시한번 보시면 됩니다.

해당 이미지의 바로가기 버튼(2번)을 클릭하시면 됩니다.

이미지 정보 페이지는 이미지 마다 다르지만 위의 이미지는 nodejs 이미지 정보 페이지입니다.
어떤 이미지는 해당 페이지에서 모든 정보를 보여주지만 어떤 이미지의 정보는 또 다른 페이지의 링크정보를 제공해 주는 경우도 있습니다.
위의 node.js도 링크 정보만 제공해 주고 있기 때문에 링크로 이동해서 봐야 합니다.

링크를 클릭하면 아래와 같은 정보가 있는 페이지를 볼 수 있습니다. github페이지 입니다. 이 페이지에 여러 개의 정보가 있지만 우리는 볼륨폴더의 위치만 참조할 것 입니다.

1. /home/node/app폴더라고 가르켜 줍니다.

위에서 획득한 경로를 기억했다가 (2번)위치에 작성해 줍니다.

1. 로컬 컴퓨터(여기서는 시놀로지)의 폴더 경로
2. 가상 컴퓨터의 마운트 폴더 경로(위에서 확인한 경로)

포트 설정도 중요한 부분입니다
로컬포트는 임의로 잡아 주면 되고 컨테이너 포트는 지정된 포트를 작성해야 합니다. Nodejs는 기본적으로 8081포트를 사용하나 우리는 8080포트로 변경해서 사용할 예정입니다.
포트의 변경은 웹서버 코드가 적혀있는 index.js에서 설정해 줄 수 있습니다.

1. 이건 코드 작성하는 방법마다 다르지만 여기서는 8080포트를 설정했습니다.
2. 아주 간단하게 Hello world를 웹페이지에 보여주는 코드입니다.

마지막으로 환경 설정을 합니다.

1. 환경 탭을 선택합니다.
2. 명령어를 선택합니다. 해당 컨테이너가 띄워지면 무조건 한번 실행되는 명령어입니다.
   여기서는 node /home/node/app/index.js를 실행하게 됩니다.
3. 적용을 선택합니다.

고급설정이 완료되면서 창이 닫힙니다. 다음을 클릭합니다.

1. 적용을 누르면 자동으로 컨테이너가 실행되도록 선택합니다.
2. 적용을 누릅니다.

컨테이너를 정상적으로 띄웠습니다.

설치 확인하기

이제는 컨테이너가 잘 띄워졌는지 확인 하는 일만 남았습니다
현재 띄워진 컨테이너의 정보는 비디오 형식 메뉴에서 확인할 수 있습니다.

1. 비디오 형식 메뉴에는 현재 작동되고 있는 모든 컨테이너들을 보여 줍니다.
2. 지금 우리가 띄운 nodejsApp이 보입니다. 실행중이 보이고 오른쪽 끝에 파란색 버튼이 보인다면 1차적으로 성공적으로 실행되고 있다고 보면 됩니다

이제 해당 웹서버가 잘 작동하는지 해당 URL로 접속해서 웹페이지를 봐야 합니다. .

참고로 아주 간단하게 임의로 작성한 웹서버 코드는 아래와 같습니다.

index.js

간단한 nodejs용 index.js 파일입니다.

'use strict';

const express = require('express');

// 상수
const PORT = 4004;
const HOST = '0.0.0.0';

// 앱
const app = express();
app.get('/', (req, res) => {
  res.send('Hello world\n');
  console.log(`Running`);
});

app.listen(PORT, HOST);
console.log(`Running on http://${HOST}:${PORT}`);

package.json

package.json 파일입니다.

{
  "name": "nodejs_server",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node index.js"
  },
  "description": "NodeJS Tutorial Server",
  "author": {
    "name": "kkk"
  },
  "dependencies": {
    "express": "^4.16.3",
    "uuid": "^3.2.1" 
  }
}

> 댓글을 통해서 추가된 사항입니다.

위의 index.js가 express웹서버를 사용하기때문에 express도 npm이나 yarn으로 아래의 명령어로 설치를 해야 합니다.
package.json이 있는 경로위치에서 CMD창을 열고 아래와 같이 npm install 명령어를 실행하면 node_modules폴더에 자동으로 설치를 해줍니다.

c:docker/nodejsApp> npm install

로컬에서 실행해도 되고 텔넷을 통해 해당 서버의 위치로 이동해서 동일한 명령어를 실행해도 됩니다.
로컬에서 실행할때는 로컬에 [node.js](https://nodejs.org/ko/)가 설치되어 있어야지 됩니다.

웹브라우저로 http://localhost:8080 으로 접속을 해 봅니다.

http://localhost:8080 으로 접속을 해 보면 위와 같은 오류화면이 나오는 경우가 있습니다. 여러가지 이유가 있겠지만 일단은 아래와 같이 해당 포트를 열어줘야 합니다.

1. 시놀로지 제어판에서 보안을 선택합니다.
2. 두번쨰 탭인 방화벽을 선택합니다.
3. 방화벽 프로파일에서 규칙편집을 선택합니다.
4. 내장된 응용프로그램 목록에서 선택을 선택합니다.
5. 도커가 추가되었다면 자동으로 해당 컨테이너의 포트가 보여집니다. 해당 컨테이너의 포트를 활성화 시켜줍니다.

이렇게 하면 내부망(localhost)에서는 사용이 가능합니다.

Hello world만 나오는 아주 간단한 프로그램입니다.

하지만 외부망에서는 보이지 않을 수 있습니다. 그럴경우 공유기에서도 해당 포트를 열어줘야 합니다.
아래의 샘플은 아이피타임의 화면이지만 거의 대부분의 공유기에도 포트포워딩기능이 있으므로 자신의 공유기에서 해당 포트를 열어주시면 됩니다.

1. 포트포워드 설정탭을 선택합니다.
2. 포트 설정 외부 8080포트로 들어오면 내부 8080포트로 전달하라는 뜻입니다.

이렇게 설정하면 외부에서도 해당 웹서버에 접근이 가능합니다.