Express 3 에서 4로 업그레이드 하기

Express 3이 deprecate되면서 기존에 express를 사용하시던 개발자분께서는 Express 4로 업그레이드하여 사용하는 것이 좋습니다. 필수 사항은 아니어서 3버전에서 4버전으로 업그레이드를 하는 방법을 설명하고자 합니다. (특히 글로벌 옵션을 넣고 설치를 한 사용자의 경우 로컬에서 개발하는 환경이 다르므로 신규 프로젝트에서 v4를 사용하신다면 아래와 같이 해주시면 됩니다.) 

// 1. 기존에 설치된 express 를 언인스톨한다
$ npm uninstall -g express

// 2. Express Generator를 인스톨한다
$ npm install -g express-generator

// 2-1. 특정 경우에 따라 sudo 옵션을 넣어 추가한다. (권한 문제)
$ sudo npm install -g express-generator

// 3. Express 4를 이용한 앱을 만들 경우 express 명령어를 사용한다.
$ express app4
$ npm start

Express 3과 다르게 Express 4에서는 보다 사용이 편리해진 기능들, 보다 명확한 형태를 갖춘 기능들이 제공됩니다. 차이점을 비교해보겠습니다.

설명	Express 3	Express 4
Request Body 유틸	express.bodyParser	body-parser + multer
압축 유틸	express.compress	compression
쿠키 및 세션 유틸	express.cookieSession	cookie-session
쿠키 변환기	express.cookieParser	cookie-parser
로깅	express.logger	morgan
세션	express.session	express-session
파비콘	express.favicon	serve-favicon
응답 시간 체크	express.responseTime	response-time
에러 핸들링	express.errorHandler	errorhandler
메소드 오버라이딩	express.methodOverride	method-override
타임아웃	express.timeout	connect-timeout
가상 호스트	express.vhost	vhost
CSRF	express.csrf	csurf
디렉토리	express.directory	serve-index
정적 파일	express.static	serve-static

 

---

Express 3

V3 에서 사용하였던 방식을 변경하려면 이렇게 사용하면 됩니다.

var express = require('express')
var routes = require('./routes')
var user = require('./routes/user')
var http = require('http')
var path = require('path')

var app = express()

// all environments
app.set('port', process.env.PORT || 3000)
app.set('views', path.join(__dirname, 'views'))
app.set('view engine', 'pug')
app.use(express.favicon())
app.use(express.logger('dev'))
app.use(express.methodOverride())
app.use(express.session({ secret: 'your secret here' }))
app.use(express.bodyParser())
app.use(app.router)
app.use(express.static(path.join(__dirname, 'public')))

// development only
if (app.get('env') === 'development') {
  app.use(express.errorHandler())
}

app.get('/', routes.index)
app.get('/users', user.list)

http.createServer(app).listen(app.get('port'), function () {
  console.log('Express server listening on port ' + app.get('port'))
})

package.json

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "3.12.0",
    "pug": "*"
  }
}

 

Express 4

위와 같은 소스를 4버전에서는 아래와 같이 사용합니다.

var http = require('http')
var express = require('express')
var routes = require('./routes')
var user = require('./routes/user')
var path = require('path')

var favicon = require('serve-favicon')
var logger = require('morgan')
var methodOverride = require('method-override')
var session = require('express-session')
var bodyParser = require('body-parser')
var multer = require('multer')
var errorHandler = require('errorhandler')

var app = express()

// all environments
app.set('port', process.env.PORT || 3000)
app.set('views', path.join(__dirname, 'views'))
app.set('view engine', 'pug')
app.use(favicon(path.join(__dirname, '/public/favicon.ico')))
app.use(logger('dev'))
app.use(methodOverride())
app.use(session({
  resave: true,
  saveUninitialized: true,
  secret: 'uwotm8'
}))
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: true }))
app.use(multer())
app.use(express.static(path.join(__dirname, 'public')))

app.get('/', routes.index)
app.get('/users', user.list)

// error handling middleware should be loaded after the loading the routes
if (app.get('env') === 'development') {
  app.use(errorHandler())
}

var server = http.createServer(app)
server.listen(app.get('port'), function () {
  console.log('Express server listening on port ' + app.get('port'))
})

npm install 은 아래와 같이 해주시되, package.json에 더 명시적으로 의존성이 추가됩니다.

$ npm install serve-favicon morgan method-override express-session body-parser multer errorhandler express@latest pug@latest --save

package.json

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "body-parser": "^1.5.2",
    "errorhandler": "^1.1.1",
    "express": "^4.8.0",
    "express-session": "^1.7.2",
    "pug": "^2.0.0",
    "method-override": "^2.1.2",
    "morgan": "^1.2.2",
    "multer": "^0.1.3",
    "serve-favicon": "^2.0.1"
  }
}

뭔가 차이가 느껴지시나요 ? :)

참고문서: https://expressjs.com/en/guide/migrating-4.html

Migrating to Express 4