Node.js 외부 모듈


  • 일반 개발자가 만들어 배포한 외부 모듈을 사용하고자 한다.
  • Node.js는 npm(Node Package Manager)을 기반으로 모듈을 공유한다.

[ 외부 모듈 설치 ]
$ npm install 모듈명
  • npm을 활용해 ejs 모듈, jade 모듈처럼 웹과 관련된 모듈을 살펴보자
  • 아래와 같이 콘솔 화면에 다음 명령을 입력한다.
$ npm install ejs
$ npm install jade


[ 코드 - 외부 모듈의 사용 ]

//모듈을 추출한다.

var ejs = require('els');

var jade = require('jade');



1. ejs 모듈

[ ejs 모듈 설치 ]

$ npm install ejs

  • 콘솔에서 명령어를 입력하여 설치한다.
  • npm이 자동으로 외부 모듈을 다운로드하고 설치한다.
[ 실행 - ejs 설치 ]


[ 코드 - ejs 모듈 추출 ]

//모듈을 추출한다.

var ejs = require('els');

  • 내장 모듈 추출하는 방법과 동일하다.

§ ejs 모듈이란?
  • 템플릿 엔진 모듈이다.
  • 템플릿 엔진 모듈이란?
    • 특정 형식의 문자열을 HTML 형식의 문자열로 변환하는 모듈을 의미.


1.1 ejs 모듈의 메서드

  • ejs 페이지를 HTML 페이지로 바꾸어 제공하는 서버를 만들어보자.

[ ejs 모듈의 메서드 ]

  • render(string[, option]) : ejs 문자열을 HTML 문자열로 변경한다.


[ 코드 - ejs 모듈을 사용한 웹 페이지 제공 ]

//모듈을 추출한다.

var http = require('http');

var fs = require('fs');

var ejs = require('ejs');


//서버를 생성하고 실행한다.

http.createServer(function (request, response) {

    //ejsPage.ejs 파일을 읽는다.

    fs.readFile('ejsPage.ejs', 'utf8', function (error, data) {

        response.writeHead(200, {'Content-Type' : 'text/html'});

        response.end(ejs.render(data));

    });

}).listen(52273, function () {

    console.log('Server Running at http://127.0.0.1:52273');

});

※ 꼭 인코딩해서 ejs 파일을 읽어야 한다.


[ 실행 - ejs 모듈을 사용한 웹 페이지 제공 ]

  • ejsPage.ejs 파일에 아무런 내용도 입력하지 않았기 때문에 빈 페이지로 제공한다.
1.2 ejs 파일 형식
  • 얼핏 보면 HTML 페이지와 차이점을 느끼지 못할 수 있지만 HTML 형식에서 살펴볼 수 없는 특수한 태그와 그 안에 자바스크립트 코드가 들어있는 것을 확인할 수 있다.
[ ejs 파일의 특수 태그 ]
  • <% Code %> : 자바스크립트 코드를 입력한다.
  • <%= value %> : 데이터를 출력한다.
  • 이 두가지 특수 태그는 render() 메서드를 사용하여 ejs 페이지를 HTML 페이지로 변환할 때 적절한 형태로 변환된다.

[ 코드 - ejsPage.ejs 파일 ]

<% var name = 'RintIanTta'; %>

<h1><%= name %></h1>

<p><%= 52 * 273 %></p>

<hr/>

<% for (var i = 0; i < 10; i++) { %>

    <h2>The Square of <%= i %> is <%= i * i %></h2>

<% } %>


[ 실행 - ejs 모듈을 사용한 웹 페이지 제공 ]


[ 소스 보기 ]

  • 웹 페이지를 소스보기하면 아래와 같이 ejs 코드가 HTML 코드로 변환된 것을 볼 수 있다.

<h1>RintIanTta</h1>
<p>14196</p>
<hr/>

<h2>The Square of 0 is 0</h2>

<h2>The Square of 1 is 1</h2>

<h2>The Square of 2 is 4</h2>

<h2>The Square of 3 is 9</h2>

<h2>The Square of 4 is 16</h2>

<h2>The Square of 5 is 25</h2>

<h2>The Square of 6 is 36</h2>

<h2>The Square of 7 is 49</h2>

<h2>The Square of 8 is 64</h2>

<h2>The Square of 9 is 81</h2>



1.3 데이터 전달

  • ejs 페이지에 데이터를 전달하는 방법을 알아보자.
  • js 코드에서 render() 메서드의 두 번째 매개변수에 전달하고자 하는 데이터를 입력하면 된다.
[ 코드 - ejs 모듈을 사용하는 웹 페이지 제공 ]
//모듈을 추출한다.
var http = require('http');
var fs = require('fs');
var ejs = require('ejs');

//서버를 생성하고 실행한다.
http.createServer(function (request, response) {
    //ejsPage.ejs 파일을 읽는다.
    fs.readFile('ejsPage.ejs', 'utf8', function (error, data) {
        response.writeHead(200, { 'Content-Type' : 'text/html' });
        response.end(ejs.render(data, {
            name : 'RintIanTta',
            description : 'Hello ejs With Node.js .. !'
        }));
    });
}).listen(52273, function () {
    console.log('Server Running at http://127.0.0.1:52273');
});
  • ejs 페이지에 name 속성과 description 속성을 전달한다.
[ 코드 - ejsPage.ejs 파일 ]
<h1><%= name %></h1>
<p><%= description %></p>
<hr />
<% for (var i = 0; i < 10; i++) { %>
    <h2>The Square of <%= i %> is <%= i * 10 %></h2>
<% } %>
  • Node.js 코드에서 전달한 name과 description 변수가 출력된다.
[ 실행 - ejs 모듈을 사용한 웹 페이지 ]

  • ejs 모듈과 같은 템플릿 엔진은 동적 웹 페이지를 생성할 때 사용한다.

2. jade 모듈
  • 템플릿 엔진 모듈
[ jade 모듈 설치 ]

$ npm install jade


2.1 jade 모듈의 메서드

[ jade 모듈의 메서드 ]

complie(string) : jade 문자열을 HTML 문자열로 바꿀 수 있는 함수를 생성한다.


[ 코드 - jade 페이지를 HTML 페이지로 변환 ]

//모듈을 실행한다.

var http = require('http');

var jade = require('jade');

var fs = require('fs');


//서버를 생성하고 실행한다.

http.createServer(function (request, response) {

    //jadePage.jade 파일을 읽는다.

    fs.readFile('jadePage.jade', 'utf8', function (error, data) {

        //jade 모듈을 사용한다.

        var fn = jade.compile(data);


        //출력한다.

        response.writeHead(200, { 'Content-Type' : 'text/html' });

        response.end(fn());

    });

}).listen(52273, function() {

    console.log('Server Running at http://127.0.0.1:52273');

});


2.2 jade 기본 형식

  • 특수한 형태의 HTML 페이지 위에 특수한 태그를 몇 개 추가한 것.
  • 특수한 평태의 HTML. 즉 jade 기본 형식에서 가장 중요한 것은 들여쓰기이다.
[ 코드 - jadePage.jade 파일 - 계층 구조 형성 ]
html
    head
        title
    body
        h1
        h2
        hr
        a

※ 들여쓰기는 탭과 띄어쓰기 중 한 가지 형태만 사용해야 한다. 두 가지 형태를 모두 사용하면 오류가 발생한다.

※ 태그에 속성을 여러 개 입력하고 싶을 때는 쉼표를 사용하여 구분한다.


[  코드 - jadePage.jade 파일 - 속성 및 내용 입력 ]

html

    head

        title Index Page

    body

        h1 Hello jade .. !

        h2 Lorem ipsum

        hr

        a(href="http://blog.movenext.co.kr", data-test="multiple Attribute") Go To MoveNext Blog


[ 실행 - Jade 형식 ]


[ 코드 - jadePage.jade 파일 - 주석 ]

doctype 5

html

    head

        title Index Page

    body

        //JADE String

        h1 Hello jade .. !

        h2 Lorem ipsum

        hr

        a(href="http://blog.movenext.co.kr", data-test="multiple Attribute") Go To MoveNext Blog

  • doctype 5 : <!Doctype html> 로 변환된다.
  • //JADE String : <!--JADE String-->으로 변환된다. (주석 처리)


[ 코드 - jagePage.jade 파일 - div 태그 생성

doctype 5

html

    head

        title Index Page

    body

        //JADE String

        #header

            h1 Hello jade .. !

            h2 Lorem ipsum

        hr

        .article

            a(href="http://blog.movenext.co.kr", data-test="multiple Attribute") Go To MoveNext Blog

  • #header : id 속성이 header인 div 태그를 생성한다.
  • .article : class 속성이 article인 div 태그를 생성한다.

[ 코드 - jade 기본 형식의 script 태그와 style 태그 ]

doctype 5

html

    head

        title Index Page

        style

            * { margin:0px; padding:0px; }

            h1 {

                color:Red;

            }

        script(src="http://code.jquery.com/jquery-1.10.2.js")

        script

            $(document).ready(function () {

                var alpha = 10;

            });

    body

        h1 Index Page

  • style 속성을 정의하는 방법, 외부에 있는 js파일을 가져오는 방법, script를 직접 정의하는 방법을 보여주고 있다.
2.3 jade 특수 기호

- Code : 자바스크립트 코드를 입력한다.

#{value} : 데이터를 출력한다.

= Value : 데이터를 출력한다.


[ 코드 - jade 코드로 전달한 데이터 ]

//모듈을 실행한다.

var http = require('http');

var jade = require('jade');

var fs = require('fs');


//서버를 생성하고 실행한다.

http.createServer(function (request, response) {

    //jadePage.jade 파일을 읽는다.

    fs.readFile('jadePage.jade', 'utf8', function (error, data) {

        //jade 모듈을 사용한다.

        var fn = jade.compile(data);


        //출력한다.

        response.writeHead(200, {'Content-Type' : 'text/html'});

        response.end(fn({

            name : 'RintIanTta',

            description : 'Hello ejs With Node.js .. !'

        }));

    });

}).listen(52273, function() {

    console.log('Server Running at http://127.0.0.1:52273');

});

  • name 속성과 description 속성을 jade 페이지에 전달한다.
[ 코드 - jadePage.jade - jade 코드로 전달한 데이터 ]

doctype html

html

    head

        title Index Page

    body

        //JADE String

        h1 #{name} .. !

        h2= description

        hr

        - for (var i = 0; i < 10; i++) {

            p

                a(href="http://blog.movenext.co.kr") Go To MoveNext Blog #{i}

        - }

  • #{name} : 전달받은 name 속성을 출력한다.
  • = description : 전달받은 description 속성을 출력한다.
  • - Code : 자바스크립트 코드를 입력한다.
[ 실행 - jade 코드로 전달한 데이터 ]


3. 서버 실행 모듈

  • 지금까지 살펴본 모듈은 지역 모듈로 자바스크립트 파일 내부에서 require() 함수로 추출했다.
  • 지급부터 살펴볼 모듈은 전역 모듈로 터미널에서 곧바로 사용할 수 있는 모듈이다.
  • 전역 모듈을 설치할 때는 g 옵션을 사용한다.
[ 전역 모듈 설치 ]
$ npm install -g supervisor
$ npm install -g forever
$ npm install -g express
  • npm install -g supervisor : 설치할 때 에러가 발생하여 터미널에서 root로 로그인하여 설치하니 정상적으로 설치되었다. (Mac)
  • root 계정으로 로그인한 상태가 아니면 sudo 명령어를 이용하면 된다.(아래에 있음)


3.1 supervisor 모듈

  • Node.js 개발을 하다보면 터미널에서 다음 명령어를 지속적으로 반복한다.
[ 터미널 ]
$ node app.js
>> [파일 수정]
>> [Ctrl] + [C]
$ node app.js
>> [파일 수정]
>> [Ctrl] + [C]
$ node app.js
  • 파일을 변경해도실행된 스크립트에 반영되지 않으므로 다시 종료하고 실행하는 것이다.
  • supervisor 모듈은 파일의 변경을 자동으로 인식하고 종료 후에 실행해준다.


[ supervisor 설치 - 리눅스 or 맥 ]

$ sudo npm install -g supervisor

[ sudo ] password for USER: 비밀번호 입력


[ supervisor 설치 - 윈도우 ]

> npm install -g supervisor


[ 터미널 명령어 - supervisor 기본 명령어 보기 ]

$ supervisor


[ 실행 - supervisor 기본 명령어 보기 ]


[ 코드 - supervisor 기본 파일 ]

//모듈을 추출한다.

var http = require('http');


//서버를 생성 및 실행한다.

http.createServer(function (request, response) {

    response.writeHead(200, {'Content-Type' : 'text/html'});

    response.end('<h1>Test - File - 1</h1>');

}).listen(52273, function() {

    console.log('Server Running at http://127.0.0.1:52273');

});

  • 코드를 입력한 뒤 아래의 supervisor 명령어를 사용하여 실행한다.
[ 터미널 명령어 - supervisor 사용하기 ]
$ supervisor test-server.js


[ 실행 - 터미널 명령어 - supervisor 사용하기 ]


[ 실행 - 기본 실행 결과 ]



[ 코드 - 파일 변경 ]

//모듈을 추출한다.

var http = require('http');


//서버를 생성 및 실행한다.

http.createServer(function (request, response) {

    response.writeHead(200, {'Content-Type' : 'text/html'});

    response.end('<h1>Test - File - 2</h1>');

}).listen(52273, function() {

    console.log('Server Running at http://127.0.0.1:52273');

});

  • 파일 내용을 변경하고 저장하면 supervisor 모듈이 서버를 재시작한다.
  • 따라서 http://127.0.0.1:52273 에 들어가면 파일 내용이 변경된 대로 출력된다.
[ 실행 - 파일 변경 후 실행 결과 ]

  • 파일 변경후 서버를 재실행할 필요없이 바로 적용되는 것을 확인할 수 있다.

3.2 forever 모듈
  • Node.js는 단일 스레드 기반의 웹 서비스이므로 예외 하나가 발생해도 웹 서비스가 죽어버린다.
  • 이러한 예외 상황을 대비하고자 만들어진 모듈이 forever 모듈이다.
[ forever 모듈 설치 ]
$ sudo npm install -g forever
[ sudo ] password for USER: 비밀번호 입력

[ 코드 - 간단한 웹 서버 ]
//서버를 생성 및 실행한다.
require('http').createServer(function (request, response) {
    if (request.url == '/') {
        //응답합니다.
        response.write('<!DOCTYPE html>');
        response.write('<html>');
        resopnse.write('<head>');
        resopnse.write('    <title>Forever</title>');
        response.write('</head>');
        response.write('<body>');
        response.write('    <h1>Forever</h1>');
        response.write('</body>');
        response.write('</html>');
        response.end();
    } else {
        //오류를 발생한다.
        error.error.error();
    }
}).listen(52273, function () {
    console.log('Server running at http://127.0.0.1:52273');
});
  • 사용자가 기본 경로로 접근하면 정상적으로 응답하지만 다른 경로로 접근하면 오류를 발생하도록 하였다.
[ 명령어 - forever 모듈 실행 ]
$ forever start app.js

[ 실행 - forever 모듈로 실행한 웹 서버 ]

  • http://127.0.0.1:52273 에 들어가면 정상적인 웹 페이지를 호출한다.
[ 실행 - 강제 오류 발생 ]

  • http://127.0.0.1:52273/error 에 들어가본다. 루트 경로가 아닌 곳에 접근했으므로 서버에서 예외가 발생해 서버가 죽어버린다.
  • 우리는 forever 모듈로 웹 서버를 실행하였으므로 다시 http://127.0.0.1:52273에 들어가보면 웹 서버가 정상적으로 동작한다.
[ 실행 - 살아 있는 웹 서버 ]

  • http://127.0.0.1:52273에 들어갔을 때 웹 서버가 정상적으로 동작함을 확인할 수 있다.
[ 명령어 - 현재 실행되고 있는 웹 서버를 확인할 때 사용 ]
$ forever list

[ 명령어 - 프로세스 번호로 서버 종료하기 ]

$ forever stop 0

  • forever list 로 현재 실행되고 있는 웹 서버 목록을 볼 때 프로세스 번호도 나온다.
  • forever stop 프로세스번호 : 프로세스 번호를 입력하여 서버를 종료시킬 수 있다.






저작자 표시 비영리 변경 금지
신고
크리에이티브 커먼즈 라이선스
Creative Commons License

'Programming > Node.js' 카테고리의 다른 글

Node.js express 4.x 프레임워크 설치 및 실행  (0) 2016.02.11
Node.js express 모듈  (6) 2015.01.25
Node.js 외부 모듈  (0) 2014.11.12
Node.js http 모듈  (0) 2014.11.05
Node.js 이벤트  (0) 2014.07.06
Node.js 기본 내장 모듈  (2) 2014.06.29