TIL_200530 (What is Express)

아직 우리가 작성할 수 있는 것은 기본적으로 간단한 Express앱입니다. 하나의 파일로 되어있는 앱으로써 Express 생성기를 통해서 만드는앱과 다릅니다. (생성기를 통해서 만드는 앱은 다양한 목적을 위한 여러 JavaScript 파일, Jade 템플릿 및 하위 디렉토리를 포함하는 전체 앱에 대한 스캐폴딩을 작성합니다.)

 

Express는 웹 및 모바일 애플리케이션을 위한 일련의 강력한 기능을 제공하는 간결하고 유연한 Node.js 웹 애플리케이션 프레임워크입니다.

자유롭게 활용할 수 있는 수많은 HTTP 유틸리티 메소드 및 미들웨어를 통해 쉽고 바르게 강력한 API를 작성할 수 있습니다.

 

Expresssms Node.js를 위한 빠르고 개방적인 간결한 웹 프레임워크입니다.

 

시작하기

Node.js가 이미 설치되었다고 가정한 상태에서 애플리케이션을 보관할 디렉토리를 작성하고 그 디렉토리를 작업 디렉토리로 설정합니다.

// myapp이라는 디렉토리를 생성합니다
$ mkdir myapp
// myapp 디렉토리로 이동합니다
$ cd myapp
// 애플리케이션에 대한 package.json 파일이 생성됩니다.
$ npm init

npm init를 실행하면 애플리케이션의 이름 및 버전과 몇가지 정보에 대해 프롬프트합니다.

한가지 항목을 제외하고 ENTER 키를 눌러 기본값을 수락하면 됩니다.

entry point: (index.js)
// 기본 파일의 이름을 정합니다.
// 원하는 파일의 이름을 입력할 수 있고 기본 설정인 index.js로 사용할 수도 있습니다.

myapp 디렉토리에 Express를 설치합니다. --save를 같이 입력하면 package.json 파일 내의 dependencies 목록에 추가됩니다. 이로 인해 추후에 app 디렉토리에서 npm install을 실행하여 목록 내의 모듈을 한번에 자동으로 설치됩니다.

 

---

 

hello world 예제

npm init으로 설정한 entry point 파일 이름으로 디렉토리 내에 js파일을 생성한 후에 다음과 같은 코드를 추가합니다.

// index.js
const express = require('express')
const app = express()
const port = 3000

app.get('/', (request, response) => response.send('Hello World!'))

app.listen(port, () => console.log(`Example app listening at http://localhost:${port}`))

앱은 서버를 시작하여 3000포트에 연결되었고, URL(/) 경로의 요청(request)에 "Hellp World!"로 응답(response)합니다.

$ node index.app
// 명령어로 앱을 실행합니다.
// http://localhost:3000/ 에서 결과를 볼 수 있습니다.

 

---

 

기본 라우팅

라우팅은 URI(또는 경로) 및 특정한 HTTP 요청 메서드(GET, POST 등)인 엔드 포인트에 대한 클라이언트 요청에 애플리케이션이 응답하는 방법을 결정하는 것을 말합니다.

각 라우트는 하나 이상의 핸들러 함수를 가질 수 있으며, 이러한 함수는 라우트가 일치할 때 실행됩니다.

라우트 정의에는 다음과 같은 구조가 필요합니다.

app.METHOD(PATH, HANDLER)

app은 express의 인스턴스입니다.

METHOD는 HTTP 요청 매서드입니다. (get, post, put, delete)

PATH는 서버에서의 경로입니다.

HANDLER는 라우트가 일치할 때 실행되는 함수입니다.

 

 

---

 

 

 

Express에서 정적 파일 제공

이미지, CSS파일 및 JavaScript파일과 같은 정적 파일을 제공하려면 Express의 기본제공 미들웨어 함수인 express.static을 사용하면 됩니다. 정적 자산이 포함된 디렉토리의 이름을 express.static 미들웨어 함수에 전달하면 파일의 직접적인 제공을 시작할 수 있습니다. 

// public이라는 이름의 디렉토리에 포함된 이미지, CSS, Javascript 파일을 제공합니다.
app.use(express.static('public'));

다음과 같이 public 디렉토리에 포함된 파일을 로드할 수 있습니다.

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html

 

---

 

 

 

라우팅

라우팅은 애플리케이션 엔드 포인트(URI)의 정의, 그리고 URI가 클라이언트 요청에 응답하는 방식을 말합니다. 

const express = require('express')
const app = express()

app.get('/', function(req, res) {
	res.send('hello world');
})

 

라우트 메서드

라우트 메서드는 HTTP 메서드 중 하나로 부터 파생되며, express 클래스의 인스턴스에 연결됩니다.

// GET method route
app.get('/', function (req, res) {
  res.send('GET request to the homepage');
});

// POST method route
app.post('/', function (req, res) {
  res.send('POST request to the homepage');
});

 

라우트 경로

요청 메서드와의 조합을 통해 요청이 이루어질 수 있는 엔드포인트를 정의합니다.

라우트 경로는 문자열, 문자열 패턴 또는 정규식일 수 있습니다. 

 

문자열을 기반으로 하는 라우트 경로

// 라우트 경로는 요청을 루트 라우트 '/'에 일치시킵니다
app.get('/', function (req, res) {
  res.send('root');
});
// 라우트 경로는 요청을 /about에 일치시킵니다
app.get('/about', function (req, res) {
  res.send('about');
});
// 라우트 경로는 요청을 /random.text에 일치시킵니다
app.get('/random.text', function (req, res) {
  res.send('random.text');
});

 

문자열 패턴을 기반으로 하는 라우트 경로

// 라우트 경로는 acd 및 abcd와 일치합니다.
app.get('/ab?cd', function(req, res) {
  res.send('ab?cd');
});
// 라우트 경로는 abcd, abxcd, abRABDOMcd 및 ab123cd 등과 일치합니다.
app.get('/ab*cd', function(req, res) {
  res.send('ab*cd');
});
// 라우트 경로는 /abe 및 /abcde와 일치합니다.
app.get('/ab(cd)?e', function(req, res) {
 res.send('ab(cd)?e');
});

 

정규식을 기반으로 하는 라우트 경로

// 라우트 경로는 라우트 이름에 “a”가 포함된 모든 항목과 일치합니다.
app.get(/a/, function(req, res) {
  res.send('/a/');
});
// 라우트 경로는 butterfly 및 dragonfly와 일치하지만, butterflyman 및 dragonfly man 등과 일치하지 않습니다.
app.get(/.*fly$/, function(req, res) {
  res.send('/.*fly$/');
});

 

 

 

라우트 핸들러

미들웨어와 비슷하게 작동하는 여러 콜백 함수를 제공하여 요청을 처리할 수 있습니다.

유일한 차이점은 이러한 콜백은 next('route')를 호출하여 나머지 라우트 콜백을 우회할 수도 있다는 점입니다. 만약에 조건을 지정하여 현재의 라우터를 진행할 필요가 없는 경우에 제어를 후속 라우트에 전달할 수 있습니다.

// 기본 라우트
app.get('/example/a', function (req, res) {
  res.send('Hello from A!');
});

// 2개 이상의 콜백 함수는 하나의 라우트를 처리할 수 있습니다.
// app.METHOD(PATH, HANDLER, HANDLER)
app.get('/example/b', function (req, res, next) {
  console.log('the response will be sent by the next function ...');
  next();
  // 반드시 next 오브젝트를 지정해야 합니다.
}, function (req, res) {
  res.send('Hello from B!');
});

// 하나의 콜백 함수 배열은 하나의 라우트를 처리할 수 있습니다.
// app.METHOD(PATH, [HANDLER, HANDLER])
var cb0 = function (req, res, next) {
  console.log('CB0');
  next();
}

var cb1 = function (req, res, next) {
  console.log('CB1');
  next();
}

var cb2 = function (req, res) {
  res.send('Hello from C!');
}

app.get('/example/c', [cb0, cb1, cb2]);

// 독립적인 함수와 함수 배열의 조합은 하나의 라우트를 처리할 수 있습니다.
// app.METHOD(PATH, [HANDLER, HANDLER], HANDLER, HANDLER)
var cb0 = function (req, res, next) {
  console.log('CB0');
  next();
}

var cb1 = function (req, res, next) {
  console.log('CB1');
  next();
}

app.get('/example/d', [cb0, cb1], function (req, res, next) {
  console.log('the response will be sent by the next function ...');
  next();
}, function (req, res) {
  res.send('Hello from D!');
});

 

 

응답 메서드

요청-응답 주기를 종료하고 응답을 클라이언트로 전송하기 위해서 응답 오브젝트에 대한 메서드를 사용해야 합니다. 만약에 다음과 같은 메서드가 하나도 호출되지 않는다면 클라이언트의 요청은 정지된 채로 방치됩니다.

메소드설명

METHOD	Description
res.download()	파일이 다운로드되도록 프롬프트합니다.
res.end()	응답 프로세스를 종료합니다.
res.json()	JSON 응답을 전송합니다.
res.jsonp()	JSONP 지원을 통해 JSON 응답을 전송합니다.
res.redirect()	요청의 경로를 재지정합니다.
res.render()	보기 템플리트를 렌더링합니다.
res.send()	다양한 유형의 응답을 전송합니다.
res.sendFile	파일을 옥텟 스트림의 형태로 전송합니다.
res.sendStatus()	응답 상태 코드를 설정한 후 해당 코드를 문자열로 표현한 내용을 응답 본문으로서 전송합니다.

 

 

app.route()

한 라우트 경로에 대하여 여러 라우트 핸들러를 연결하여(메서드 체인) 작성할 수 있습니다.

경로는 한 곳에 지정되어 있으므로, 모듈식 라우트를 작성하면 중복성과 오타가 감소하여 도움이 됩니다. 

app.route('/book')
  .get(function(req, res) {
    res.send('Get a random book');
  })
  .post(function(req, res) {
    res.send('Add a book');
  })
  .put(function(req, res) {
    res.send('Update the book');
  });

 

express.Router

express.Router 클래스를 사용하면 모듈식 마운팅 가능한 핸들러를 작성할 수 있습니다.

Router 인스턴스는 완전한 미들웨어이자 라우팅 시스템이며, 따라서 "미니앱(mini-app)"이라고 불리는 경우가 많습니다.

 

라우터를 모듈로서 작성하고, 라우터 모듈에서 미들웨어 함수를 로드하고, 몇몇 라우트를 정의하고, 기본 앱의 한 경로에 라우터 모듈을 마운트합니다.

 

// birds.js
var express = require('express');
var router = express.Router();

// middleware that is specific to this router
router.use(function timeLog(req, res, next) {
  console.log('Time: ', Date.now());
  next();
});
// define the home page route
router.get('/', function(req, res) {
  res.send('Birds home page');
});
// define the about route
router.get('/about', function(req, res) {
  res.send('About birds');
});

module.exports = router;

var birds = require('./birds');
...
app.use('/birds', birds);

 

 

---