Post List

2016년 10월 31일 월요일

Hapi 따라하기.

1. 신규로 새로운 프로젝트 디렉토리를 만든다.

[binrang@binrang ~]$ mkdir haproject
[binrang@binrang ~]$ cd haproject/
[binrang@binrang haproject]$ pwd
/home/binrang/haproject
[binrang@binrang haproject]$ 

2. npm init 명령을 실행하여 package.json 을 생성한다.



[binrang@binrang haproject]$ npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.
See `npm help json` for definitive documentation on these fields
and exactly what they do.
Use `npm install <pkg> --save` afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
name: (haproject) 
version: (1.0.0) 
description: 
entry point: (index.js) 
test command: 
git repository: 
keywords: 
author: 
license: (ISC) 
About to write to /home/binrang/haproject/package.json:
{
  "name": "haproject",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}
Is this ok? (yes) 
[binrang@binrang haproject]$ 

3. npm install --save hapi 명령어를 실행하여 hapi를 설치하고 package.json 에 설정을 추가한다.

[binrang@binrang haproject]$ npm install --save hapi
haproject@1.0.0 /home/binrang/haproject
└─┬ hapi@15.2.0 
  ├─┬ accept@2.1.2 
  │ └── boom@3.2.2 
  ├─┬ ammo@2.0.2 
  │ └── boom@3.2.2 
  ├── boom@4.0.0 
  ├─┬ call@3.0.3 
  │ └── boom@3.2.2 
  ├─┬ catbox@7.1.2 
  │ └── boom@3.2.2 
  ├── catbox-memory@2.0.3 
  ├─┬ cryptiles@3.0.2 
  │ └── boom@3.2.2 
  ├─┬ heavy@4.0.2 
  │ └── boom@3.2.2 
  ├── hoek@4.0.2 
  ├─┬ iron@4.0.3 
  │ └── boom@3.2.2 
  ├── items@2.1.1 
  ├─┬ joi@9.0.4 
  │ ├── isemail@2.2.1 
  │ └── moment@2.14.1 
  ├─┬ mimos@3.0.3 
  │ └── mime-db@1.23.0 
  ├── podium@1.2.3 
  ├── shot@3.3.2 
  ├─┬ statehood@5.0.0 
  │ └── boom@3.2.2 
  ├─┬ subtext@4.3.0 
  │ ├─┬ content@3.0.2 
  │ │ └── boom@3.2.2 
  │ ├─┬ pez@2.1.2 
  │ │ ├── b64@3.0.2 
  │ │ ├── boom@3.2.2 
  │ │ └─┬ nigel@2.0.2 
  │ │   └── vise@2.0.2 
  │ └── wreck@10.0.0 
  └── topo@2.0.2 
npm WARN haproject@1.0.0 No description
npm WARN haproject@1.0.0 No repository field.
[binrang@binrang haproject]$ 

4. index.js 파일을 생성하고 아래 코드를 입력한다.

[binrang@binrang haproject]$ vi index.js
'use strict';
const Hapi = require('hapi');
const server = new Hapi.Server();
server.connection({ port: 3000 });
server.start((err) => {
    if (err) {
        throw err;
    }
    console.log(`Server running at: ${server.info.uri}`);
});

5. 서버를 구동한 후 웹 화면을 확인 해 보자. server.connection 에 관련해서는 API를 참조해라.

[binrang@binrang haproject]$ node index.js 
Server running at: http://binrang:3000

에러 코드를 뿌린다. (웹 서버는 구동되어 있군.)















6. routes 를 추가하여 좀 더 반응하는 모습을 보여 보자. index.js 파일에 route 코드를 추가해 보자.

[binrang@binrang haproject]$ vi index.js
'use strict';
const Hapi = require('hapi');
const server = new Hapi.Server();
server.connection({ port: 3000 });
server.route({
    method: 'GET',
    path: '/',
    handler: function (request, reply) {
        reply('Hello, world!');
    }
});
server.route({
    method: 'GET',
    path: '/{name}',
    handler: function (request, reply) {
        reply('Hello, ' + encodeURIComponent(request.params.name) + '!');
    }
});
server.start((err) => {
    if (err) {
        throw err;
    }
    console.log(`Server running at: ${server.info.uri}`);
});

7. 이제 실행을 하고 웹화면을 확인하자.

[binrang@binrang haproject]$ node index.js 
Server running at: http://binrang:3000
cs


/ 홈 화면 뜬다.

/binrang 이라고 보낼 경우 변수로 받아 뜬다.


routing 튜토리얼은 링크를 따라가봐라...

8. 이번에는 정적인 페이지 또는 컨텐츠를 만들어보자.  CTRL + C 를 입력하여 실행중인 서버를 중단시키고 npm install --save inert 를 실행하여 inert 플러그인을 설치하자.

[binrang@binrang haproject]$ npm install --save inert
haproject@1.0.0 /home/binrang/haproject
└─┬ inert@4.0.2 
  ├── ammo@2.0.2 
  ├── boom@3.2.2 
  ├── hoek@4.1.0 
  ├── items@2.1.1 
  ├─┬ joi@9.2.0 
  │ ├── isemail@2.2.1 
  │ ├── moment@2.15.2 
  │ └── topo@2.0.2 
  └─┬ lru-cache@4.0.1 
    ├── pseudomap@1.0.2 
    └── yallist@2.0.0 
npm WARN haproject@1.0.0 No description
npm WARN haproject@1.0.0 No repository field.
[binrang@binrang haproject]$ 

9. server.js 파일을 생성하고 아래 코드를 입력한다.

[binrang@binrang haproject]$ vi server.js 
'use strict';
const Hapi = require('hapi');
const server = new Hapi.Server();
server.connection({ port: 3000 });
server.register(require('inert'), (err) => {
    if (err) {
        throw err;
    }
    server.route({
        method: 'GET',
        path: '/hello',
        handler: function (request, reply) {
            reply.file('./public/hello.html');
        }
    });
});
server.start((err) => {
    if (err) {
        throw err;
    }
    console.log(`Server running at: ${server.info.uri}`);
});


10. /hello 라는 경로가 server 쪽에 요구 되었을 경우 public 디렉토리 밑에 hello.html 파일을 찾는다.

따라서 public 디렉토리를 생성하고 그 아래 hello.html 파일에다 <h2>Hello World.</h2> 코드를 입력한다. 만약 파일을 생성하지 않을 경우 404 에러를 띄울 것이다.

실행하여 웹 화면을 확인 해보자.

[binrang@binrang haproject]$ node server.js 
Server running at: http://binrang:3000

/hello 라는 경로 요구에 404를 가볍게 띄워준다.
















그래서 public 이라는 디렉토리와 hello.html 파일과 코드를 만들어 보자.

[binrang@binrang haproject]$ mkdir public
[binrang@binrang haproject]$ cd public/
[binrang@binrang public]$ vi hello.html
<h2>Hello World.</h2>



좀 더 자세히 알아볼 경우는 Serving Static Content 페이지를 방문해보면 좋을 듯....

11.  다양한 플러그인에 대산 사용법에 대해서 좀 더 나열해본다.
그 중에 good 플러그인 과 good-console , good-squeeze 등을 설치 해 보자.


[binrang@binrang haproject]$ npm install --save good
haproject@1.0.0 /home/binrang/haproject
└─┬ good@7.0.2 
  ├── hoek@3.0.4 
  ├── joi@7.3.0 
  ├── oppsy@1.0.2 
  └─┬ pumpify@1.3.5 
    ├─┬ duplexify@3.5.0 
    │ ├── end-of-stream@1.0.0 
    │ ├─┬ readable-stream@2.1.5 
    │ │ ├── buffer-shims@1.0.0 
    │ │ ├── core-util-is@1.0.2 
    │ │ ├── isarray@1.0.0 
    │ │ ├── process-nextick-args@1.0.7 
    │ │ ├── string_decoder@0.10.31 
    │ │ └── util-deprecate@1.0.2 
    │ └── stream-shift@1.0.0 
    ├── inherits@2.0.3 
    └─┬ pump@1.0.1 
      ├── end-of-stream@1.1.0 
      └─┬ once@1.3.3 
        └── wrappy@1.0.2 
npm WARN haproject@1.0.0 No description
npm WARN haproject@1.0.0 No repository field.
[binrang@binrang haproject]$ 

[binrang@binrang haproject]$ npm install --save good-console
haproject@1.0.0 /home/binrang/haproject
└─┬ good-console@6.3.1 
  ├── joi@8.1.1 
  └── json-stringify-safe@5.0.1 
npm WARN haproject@1.0.0 No description
npm WARN haproject@1.0.0 No repository field.
[binrang@binrang haproject]$ 

[binrang@binrang haproject]$ npm install --save good-squeeze
haproject@1.0.0 /home/binrang/haproject
└─┬ good-squeeze@5.0.0 
  └── fast-safe-stringify@1.1.0 
npm WARN haproject@1.0.0 No description
npm WARN haproject@1.0.0 No repository field.
[binrang@binrang haproject]$ 

12. server.js 파일에 대하여 업데이트 해보자.

[binrang@binrang haproject]$ vi server.js 
'use strict';
const Hapi = require('hapi');
const Good = require('good');
const server = new Hapi.Server();
server.connection({ port: 3000 });
server.route({
    method: 'GET',
    path: '/',
    handler: function (request, reply) {
        reply('Hello, world!');
    }
});
server.route({
    method: 'GET',
    path: '/{name}',
    handler: function (request, reply) {
        reply('Hello, ' + encodeURIComponent(request.params.name) + '!');
    }
});
server.register({
    register: Good,
    options: {
        reporters: {
            console: [{
                module: 'good-squeeze',
                name: 'Squeeze',
                args: [{
                    response: '*',
                    log: '*'
                }]
            }, {
                module: 'good-console'
            }, 'stdout']
        }
    }
}, (err) => {
    if (err) {
        throw err; // something bad happened loading the plugin
    }
    server.start((err) => {
        if (err) {
            throw err;
        }
        server.log('info', 'Server running at: ' + server.info.uri);
    });
});

13. 서버를 구동시키고 웹 쪽과 서버 쪽의 반응을 살펴 보자.

아래와 같이 서버 구동시 로그가 찍히고 있고,

[binrang@binrang haproject]$ node server.js 
161031/085851.567, [log,info] data: Server running at: http://binrang:3000

웹 페이지 접속 시 

[binrang@binrang haproject]$ node server.js 
161031/085851.567, [log,info] data: Server running at: http://binrang:3000
161031/090040.469, [response] http://binrang:3000: get / {} 200 (74ms)

접속 관련 로그가 찍히고 있다.

이렇게 로그 관련 플러그 인 뿐만 아니라 그 외 플러그인에 대해서는 다음 링크로 가서 체크 해보자. plugins tutorial

그 외 API  관련 해서는 다음 링크를 참조해라. hapi api

참조 URL : hapijs tutorials