Node.js | Express Web 어플리케이션 자동 생성 | routes 스크립트 및 템플릿

Tags:

이어서 표시하는 Web 페이지의 처리를 보고 가자. Web 페이지는 routes 안에 스크립트와 views 안에 템플릿을 준비하여 양자의 조합으로 만들어 진다. 여기에서는 /index로 표시되는 페이지를 구성하는 routes 안에 index.js와 views의 index.ejs의 내용을 살펴 보자. (아래와 코드 참조)

routes/index.js

var express = require('express');
var router = express.Router();
 
/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});
 
module.exports = router;

views/index.ejs

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
  </body>
</html>

express 라이브러리 로드

var express = require('express');

여기에 필요한 express 라이브러리를 로드한다. 이는 app.js에 대해 설명 시에도 등장 했다. Express 객체이다.

Router 객체의 준비

var router = express.Router();

express의 “Router"메소드를 호출한다. 이것으로 라우팅(URL과 그것을 호출하는 처리와 연관 얻을 수있는 것)에 대한 객체를 만든다.

GET으로 루트 정보를 설정하기

router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

Router에도 app.js의 express 객체와 마찬가지로 get 메소드가 준비되어 있다. 이것으로 URL 경로에 함수를 설정한다. 이것으로 지정된 주소에 액세스가 있으면 설정한 함수를 호출하여 실행하게 된다.

여기에서 render 메소드를 호출하여 index의 템플릿을 렌더링한다.

exports에 router를 설정

module.exports = router;

마지막으로, module.exports에 router 객체를 사용하고 작업 완료이다. app.js에서 마지막으로 module.exports = app;을 수행하고 있던 것과 같은 거다.

이상, 정리하면 “Router 작성”, “get에 의한 경로 설정”, “module.exports에 router 설정"이라는 흐름에서 라우팅이 이루어지고 있었다. 여기에서는 index에 대해 조사했지만, 기본적으로는 모두 같은 방식으로 라우팅을 설정한다. 라우팅을 위한 스크립트는 자신의 새로운 페이지를 추가하여 준비해야 하기에, 작성법의 기본은 제대로 기억해 두도록 한다.

최종 수정 : 2018-07-16