express 프레임워크

[express 프레임워크]

express-generator 모듈과 express 모듈을 합쳐서 express 프레임워크라고 부른다.

프레임워크라고 부르기엔 제공하는 것이 매우 적지만...

express 프레임워크 설치

npm install -g express-generator  // express 4 버전으로 설치하고싶으면 express-generator@4 로 버전지정.

express 프로젝트 생성

// <-- test_express 명의 프로젝트 생성. 기본 템플릿엔 진이 jade로 생성된다.

express test_express

//템플릿 엔진을 ejs로 설치하고싶으면 아래처럼 생성.

express test_express -- view=ejs

프로젝트를 생성하고나면  cd test_express && npm install 명령어를 실행하라고 뜬다.

cd test_express && npm install

express 프레임워크로 생성한 프로젝트를 실핼때는 npm start 명령어로 실행한다.

npm start 명령어를 입력하면 package.json 파일의 scripts객체의 start 속성을 읽고,

아래(기본값) 같은 경우 실제 실행은 bin 폴더안의 www 파일이 실행된다.

package.json 파일

"scripts": {
  "start": "node ./bin/www"
},

[express 프로젝트 구성]

bin : 프로그램 실행과 관련된 파일이 들어있는 폴더

public : express모듈의 static 미들웨어를 사용해 웹 서버에 올라가는 폴더. 이 폴더에 js파일, css파일, 그림파일 등을 넣어둔다.

routes : 페이지 라우트와 관련된 폴더. 

views : : ejs, jade 등 템플릿 파일을 저장하는 폴더

app.js : 프로젝트에서 중심이 되는 js파일

package.json : 현재 프로젝트와 관련된 모듈정보의 내용을 담는 파일

app.js 파일

//외부 모듈 추출
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

//사용자 정의 모듈 추출
var index = require('./routes/index');
var users = require('./routes/users');

//서버 생성
var app = express();

//서버 설정
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs'); //<-- jade 템플릿 사용시 app.set('view engine', 'jade'); 로 되어있다.

set() 메서드는 express 프레임워크의 설정 옵션을 지정하는 메서드다. 대부분은 기본 설정으로 두어도 됨.

case sensitive routing : 페이지 라우트를 할때 대소문자를 구분할지 설정

env : 서버 환경을 지정

etag : http 헤더의 ETag 속성을 지정

jsonp callback name : jsonp를 사용할 때 콜백 이름을 지정

json replacer : JSON.stringfy의 replace 매개변수를 지정

json spaces : JSON.stringfy의 spaces 매개변수를 지정

query parser : 쿼리를 파싱할 때 사용할 모듈을 지정

strict routing : 엄격 경로 확정을 사용할지 지정

subdomain offset : 서브 도메인을 추출하기 위해 사용할 오프셋을 지정

trust proxy : 신뢰할 수 있는 프록시 지정

views : 뷰 폴더를 지정

view cache : 뷰 캐시 사용여부 지정

view engine : 뷰 엔진을 지정

x-powered-by : http헤더에 X-Powered-By : Express 를 추가한다

[미들웨어 설정]

기본값

app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

미들웨어를 추가하고 싶을때는 아래 처럼 추가한다. 

외부모듈 사용시 우선적으로 설치를 해줘야한다. install시 --save 명령을 추가하면 package.json파일에 같이 저장된다.

app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
//session  모듈 추가
var session = require('express-session'); 
app.use(session({
    secret : 'test key',
    resave : false,
    saveUninitialized : true
}));

app.use(express.static(path.join(__dirname, 'public')));

[페이지 라우트]

사용자가 GET방식으로 '/url' 에 요청할 경우 routes 모듈을 제공.

var index = require('./routes/index');
var users = require('./routes/users');

app.use('/', index);
app.use('/users', users);

[페이지 랜더링]

express 모듈로 페이지 랜더링 기능을 활용할 수 있다.

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' });
});

// url/test로 접속시 보여지는 페이지 설정 임의 추가
router.get('/test', function(req, res, next) {
  res.render('test/page_1');
});

module.exports = router;