[node.js] 외부모듈

필수개념

개념	설명
ejs.모듈/jade 모듈	웹 페이지를 동적으로 생성하는 템플릿 엔진 모듈
supervisor 모듈	파일의 변경 사항을 자동으로 인식하고 종료 후 다시 실행
forever 모듈	웹 서비스 장애와 같은 예외 상황을 대비하고자 만들어진 모델
npm install 모듈	외부모듈을 설치할 때 사용/설치한 모듈은 내장모듈처럼 사용가능
npm init 명령	node.js 프로젝트를 생성할 때 사용
package.json 파일	node.js 프로젝트의 환경 설정 정보를 담은 파일

node.js는 npm 기반으로 모듈을 공유한다.

 

설치

$ npm install 모듈명

 

외부모듈 사용

// 모듈을 추출합니다.

var ejs = require('ejs');

var jade = require('jade');

 

ejs 모듈

ejs 모듈은 템플릿 엔진 모듈로 특정 형식의 문자열을 HTML 형식의 문자열로 변환한다.

 

예) ejs 페이지를 html 페이지로 바꾸어 제공하는 서버

// 모듈을 추출합니다.

var http = require('http');

var fs = require('fs');

var ejs = require('ejs');

 

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

http.createServer(function (request, response) {

// ejsPage.ejs 파일을 읽습니다.

fs.readFile('7-6.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 페이지를 html 파일로 변환할 때는 ejs 모듈의 render() 메서드를 사용한다.

//render(str,data,option) - ejs 문자열을 html 문자열로 변경합니다.

//참고: utf-8 로 파일 인코딩을 지정해서 esj 파일을 읽어야 한다.

 

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 파일의 특수 태그

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

<%=Value%> - 데이터를 출력한다.

 

데이터 전달

ejs페이지에 데이터를 전달하는 방법은 간단하다. 

render()메서드의 두 번째 매개변수에 전달하고자 하는 데이터를 입력한다.

 

예) name속성과 description 속성을 전달.

// 모듈을 추출합니다.

var http = require('http');

var fs = require('fs');

//설치먼저 해야 ejs 모듈 사용할 수 있음

var ejs = require('ejs');

 

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

http.createServer(function (request, response) {

// ejsPage.ejs 파일을 읽습니다.

fs.readFile('7-8.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');

});

7-8.ejs

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

<p><%= description %></p>

<hr />

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

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

<% } %>

속성 name과 description 은 ejs 페이지 내부에서 생성한 것이 아니라 node.js 코드에서 전달 한 것

 

참고: ejs 모듈과 같은 템플릿 엔진은 동적 웹 페이지를 생성할 때 사용한다. 예로들면 포털 사이트 메인 페이지에 접속하면 서버는 데이터베이스에서 새로운 신문기사와 광고를 가져온다. 이어서 ejs 모듈과 같은 템플릿 엔진을 사용해서 웹페이지를 동적으로 구성해서 클라이언트에게 제공한다.

jade 모듈

 

설치후 모듈 추출

$ npm install jade

 

// 모듈을 추출합니다.

var jade = require('jade');

 

jade 모듈도 ejs모듈처럼 jade 페이지를 html 페이지로 바꾸어 제공한다.

 

7-10 웹 서버 생성 및 실행예)

// 모듈을 추출합니다.

var http = require('http');

var jade = require('jade');

var fs = require('fs');

 

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

http.createServer(function (request, response) {

// JadePage.jade 파일을 읽습니다.

fs.readFile('7-18.jade', 'utf8', function (error, data) {

// jade 모듈을 사용합니다.

var fn = jade.compile(data);

 

// 출력합니다.

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

response.end(fn());

});

}).listen(62273, function () {

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

});

참고: ejs 모듈의 render() 메서드와 다르게 문자열을 리턴하는 것이 아니라 함수를 리턴한다.

메서드

compile(string,option) - jade 문자열을 HTML 문자열로 바꿀 수 있는 함수를 생성한다.

 

jade 기본형식

가장 중요한 것은 들여쓰기다.

꼭 들여쓰기는 탭과 띄어쓰기 중 한 가지 형태만 사용해야 한다. 아니면 오류 발생한다.

 

doctype html

html

head

title Index Page

body

// JADE String

h1 Hello jade .. !

h2 Lorem ipsum

hr

a(href="http://naver.com", data-test="multiple Attribute") Go To naver

 

jade 기본형식에서 div 태그 쉽게 하는법

div 태그를 직접 입력하지 않고 #header 태그를 입력하는 것만으로도 id 속성이 header 인 div 태그를 생성할 수 있다. 마찬가지로 .article 태그를 입력하는 것만으로도 class 속성이 article 인 div 태그를 생성할 수 있다.

 

예)

doctype html

html

head

title Index Page

body

// JADE String

#header

h1 Hello jade .. !

h2 Lorem ipsum

hr

.article

a(href="http://naver.com", data-test="multiple Attribute") Go To naver

jade 기본형식의 script 태그와 style 태그

script 태그와 style 태그를 입력할 때 기호 . 을 찍어 준다.

예)

doctype html

html

head

title Index Page

style.

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

h1 {

color:Red;

}

script(src="https://code.jquery.com/jquery-1.12.4.js")

script.

$(document).ready(function () {

var alpha = 10;

});

body

h1 Index Page

 

jade 특수 기호

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

#{Value} - 데이터를 출력한다.

={Value} - 데이터를 출력한다.

#{} 태그를 사용하면 내용물 중가에 데이터를 입력할 수 있고 = 태그를 사용하면 내용전체를 데이터로 지정한다.

 

jade 코드로 데이터 전달

render() 메서드처럼 fn이라고 생성한 함수의 매개변수에 jade 페이지에 전달할 데이터를 입력한다. name 속성과 description 속성을 jade 페이지에 전달한다.

 

// 모듈을 추출합니다.

var http = require('http');

var jade = require('jade');

var fs = require('fs');

 

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

http.createServer(function (request, response) {

// JadePage.jade 파일을 읽습니다.

fs.readFile('7-20.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 jade With Node.js .. !'

}));

});

}).listen(52273, function () {

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

});

 

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://naver.com") Go To naver #{i}

- }

 

서버실행모듈

위에서 살펴본 모듈은 지역모듈로 자바스크립트 파일 내부에서 require()함수로 추출했지만 서버 실행보듈은 전역 모듈로 터미널에서 곧바로 사용할 수 있는 모듈이다.

설치

$ npm install – g supervisor

$ npm install – g forever

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 test.server.js 입력

그 후 위의 코드를 수정하면 자동으로 파일을 저장하고 변경해 준다.

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

//참고 서버 프로그램을 실행할 때만 supervisor 모듈을 사용한다.

forever 모듈

웹서비스를 잘 구축해도 예외가 발생할 수 있다. 기존 멀티스레드 기반의 웹 서비스는 예외가 발생해도 전체 웹 서비스에 크게 영향을 주지 않았따. 하지만 node.js 같은 단일 스레드 기반의 웹서비스는 예외 하나로 웹 서빗 전체가 죽어 버린다. 그것에 대비하고자 만들어진 모듈이 forevere 모듈이다.

 

설치

npm install –g foever

 

명령어 확인

$ forever

 

간단한예제)

// 서버를 생성 및 실행합니다.

require('http').createServer(function (request, response) {

if (request.url == '/') {

// 응답합니다.

response.write('<!DOCTYPE html>');

response.write('<html>');

response.write('<head>');

response.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 start app.js를 실행

http://127.0.0.1:52273 에 들어가면 정상적인 결과 출력

http://127.0.0.1:52273/error 들어가도 정상적으로 동작

 

현재 실행되고 있는 서버 확인

$ forever list

 

프로세스 번호로 서버종료

 

$ forever stop 0