221220 - Node Express - Router 객체를 이용한 라우팅 분리

오늘 내가 배운 것

1. Router객체를 이용한 라우팅 분리하기

2. Controller 분리하기

 

Router객체를 이용한 라우팅 분리하기

익스프레스(Express)를 사용하는 이유 중 하나는 라우팅을 깔끔하게 관리할 수 있기 때문이다.

라우터를 많이 연결하게 되면 server.js 코드가 길어지므로 익스프레스에서는 라우터를 분리할 수 있는 방법을 제공한다. 

 

router.get/ router.post

//등록형태 
router.get('/board/list',(req, res)=>{
    res.send('/ page')
})

//실행 영역
app.use(router)

실행 가능한가?

실행 가능하다. 여기서 주의할 점은 router는 실행하는 부분이 아니다. 

router는 등록만 하는 것이고, 실제로 실행이 되는 부분은 app.use이다.

 

라우터의 분기 처리

router.get('/list',(req, res)=>{
    res.send('/ list')
})
router.get('/write',(req, res)=>{
    res.send('/ write')
})
router.get('/modify',(req, res)=>{
    res.send('/ modify')
})
app.use('/board',router)
app.use('/notice',router)
app.use('/gallery',router)

 

실행 코드 3개만으로도 method가 get인 요청 중에
/board/list, /board/write, /board/modify, /notice/list, /notice/write, /notice/modify, /gallery/list, /gallery/write, /gallery/modify  총 9개의 분기를 처리할 수 있게 된다.

 

 

라우터 파일

const express = require('express')
const router = express.Router()

//객체형태인 router을 모듈로 다른 파일에서 사용하기 위해
module.exports=router

라우터를 사용하기 위해 분리된 파일에서는

위에 코드 3줄을 미리 작성하고 사이에 내용을 채우는 것이 좋다. 마지막 module을 까먹고 안 써서 생기는 오류도 꽤 빈번하기 때문에...

라우터를 이용한 분기 처리 방식의 장점

server.js는 다른 사람(협업하는 사람들)의 코드가 시작되는 엔트리 포인트이기 때문에 코드 수정을 최대한 안 하는 것이 좋다. server.js의 수정이 많으면 다른 사람들의 코드도 꼬일 수 있기 때문에 server.js는 간단하게 만들어지는 것이 좋다.

그래서 router를 만들었던 폴더에 index.js를 만들고, 그 index.js에 각 파일들을 담는 router를 생성한 후에 server.js에서 이 index.js의 router을 사용할 수 있도록 해준다.

 

index. js 생성

//routes > index.js
const express = require('express')
const router = express.Router()
const board = require('./board.route')
const notice = require('./notice.route')
const gallery = require('./gallery.route')

router.use('/board', board)
router.use('/notice', notice)
router.use('/gallery', gallery)


module.exports = router

server.js에 index.js 연결

// server.js
// const router = require('./router/index.js')
//index.js는 생략가능하다.
const router = require('./router')

app.use(router)

 

이렇게 라우팅 분리를 하게 되면 나중에 다른 라우터를 추가해야 되는 상황에서도 다른 사람과의 코드 충돌이 없기 때문에 이 방법을 사용하는 것이 좋다. (다른 사람이 작업하는 곳의 코드 수정이 없기 때문에 협업이 수월하다.)

router을 이용한 분기처리 흐름

 

Controller 분리하기

라우터 부분에 라우터만 보이게 하고, 실행을 위한 콜백 함수(미들웨어) 부분을 따로 분리하여 라우터만 직관적으로 보이게 하기 위해 Controller로 분리한다.

콜백 함수 영역을 controllers로 나눈다.
module.exports만 작성하면 된다.

"/(path) 일 때, ~~를 실행하겠다."라는 의미의 코드를 작성하는 것이다.

//controllers > board.controller.js
exports.list = (req, res)=>{
    res.send("list page")
}
exports.write = (req, res)=>{
    res.send("write page")
}
exports.modify = (req, res)=>{
    res.send("modify page")
}

controller를 사용하는 곳은 콜백 함수가 있었던 board.route.js이기 때문에 board.route.js도 수정한다.

 

//board.route에 내용을 바꾸기 위해 board.route.js 내용 수정
const express = require('express')
const router = express.Router()
const controller = require('../controllers/board.controller') //추가

// router.get('/list',(req,res)=>{
//     res.send('board/list 입니다.')
// })  //아래 코드로 바뀐다.
router.get('/list', controller.list) // 수정
module.exports = router

 

 

---

**res.render(~~.html) 

render는 응답 메시지 body영역에 html 파일을 스트링으로 변환하여 body영역에 넣어주는 역할을 한다.

render 메서드를 이용하여 html 파일을 열어준다는 개념이 아닌 res의 body 영역에 스트링으로 넣어주고 그 response message를 이용하여 화면에 보이게 하는 것이다. 중요..!

---