Express-Router 객체 사용하기

예시코드 1) index.js(첫 페이지)

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

app.get('/goods/list', (req, res) => {
  res.send('상품 목록 페이지')
})

app.get('/goods/detail', (req, res) => {
  res.send('상품 상세 페이지')
})

app.get('/user/login', (req, res) => {
  res.send('로그인 페이지')
})

app.get('/user/register', (req, res) => {
  res.send('회원가입 페이지')
})
app.listen(port, () => {
  console.log(`listening at http://localhost:${port}`)
})

---

goods/list와 goods/detail 라는 이름의 path가 설정되어 있음

  app.get('/goods/list', (req, res) => {
      res.send('상품 목록 페이지')
    })

    app.get('/goods/detail', (req, res) => {
      res.send('상품 상세 페이지')
    })
    
    

그냥 path를 설정한 것이기 때문에 이것만으로는 큰 의미가 없음
but 다음 예시부터 이런 식의 설정이 큰 의미를 가짐

---

예시코드 2) goods.js --> 위의 goods에 속한 path가 라우터에 등록되어 있음

routes폴더 안에 존재

var express = require('express');
var router = express.Router();

router.get('/list', function(req, res, next) {
  res.send('Router 상품 목록 페이지')
});

router.get('/detail', function(req, res, next) {
  res.send('Router 상품 상세 페이지')
});

module.exports = router;

--> goods에 속한 path페이지들을 따로 js파일로 만들어 라우터 객체화 시켜줌

---

예시 코드 3) goods.js를 index.js에 적용시키기 위해 index.js 코드 수정 --> 라우터 객체 이용

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

    const goodsRouter = require('./routes/goods');

    app.use('/goods', goodsRouter)

    // app.get('/goods/list', (req, res) => {
    //   res.send('상품 목록 페이지')
    // })

    // app.get('/goods/detail', (req, res) => {
    //   res.send('상품 상세 페이지')
    // })

    app.get('/user/login', (req, res) => {
      res.send('로그인 페이지')
    })

    app.get('/user/register', (req, res) => {
      res.send('회원가입 페이지')
    })
    app.listen(port, () => {
      console.log(`listening at http://localhost:${port}`)
    }) 
    

1. app이 리스너 설정(port)되어있으므로 request는 app에 들어온다.
2. 들어오는 request중에서 '/goods'라는 path를 가진 것들은 위의 goodRouter로 전달한다.
3. 해당 라우터를 설정한 goods.js파일에서 해당 request를 처리후 반환한다.
4. 반환 내용을 app차원에서 responds하여 화면을 채운다
   

기존의 코드

  app.get('/goods/list', (req, res) => {
  res.send('상품 목록 페이지')
  })
  
  app.get('/goods/detail', (req, res) => {
  res.send('상품 상세 페이지')
  })
  

라우터 객체를 이용하여 간소화한 코드
--> good.js에서 설정한 라우터 객체를 가져와서 사용하는 것

  const goodsRouter = require('./routes/goods');

  app.use('/goods', goodsRouter)   
  
  

--> 두 코드는 같은 의미를 가지며, 라우터에 등록하는 코드가 많아질 수록 간소화한 코드가 더 큰 의미를 갖는다

--> 나중에 가면 페이지가 무수히 많아지는데 이런식으로 라우터 객체를 사용하여 묶어놓으면 관리가 매우 편해준다