우선 아래 예시코드 부터 보자
import express from 'express';
const app = express();
app.use(express.json());
app.get('/posts', (req, res) => {
res.status(201).send('GET: /posts');
});
app.post('/posts', (req, res) => {
res.status(201).send('POST: /posts');
});
app.put('/posts/:id', (req, res) => {
res.status(201).send('PUT: /posts/:id');
});
app.delete('/posts/:id', (req, res) => {
res.status(201).send('DELETE: /posts/:id');
});
app.get('/', (req, res) => {
res.status(201).send('GET: /users');
});
app.post('/', (req, res) => {
res.status(201).send('POST: /users');
});
app.put('/:id', (req, res) => {
res.status(201).send('PUT: /users/:id');
});
app.delete('/:id', (req, res) => {
res.status(201).send('DELETE: /users/:id');
});
app.listen(8080);
post와 user에 대한 각각에 대해 get, post, put, delete가 반복되다 보니 코드가 중복되어 보인다.
한번 이 예시 코드를 깔끔하게 정리해보자.
이때 express.route()
를 이용하면 공통된 경로를 모아서 라우트 체이닝으로 정리를 해줄수 있다.
import express from 'express';
const app = express();
app.use(express.json());
app
.route('/posts')
.get((req, res) => {
res.status(201).send('GET: /posts');
})
.post((req, res) => {
res.status(201).send('POST: /posts');
});
app
.route('/posts/:id')
.put((req, res) => {
res.status(201).send('PUT: /posts/:id');
})
.delete((req, res) => {
res.status(201).send('DELETE: /posts/:id');
});
app
.route('/users')
.get((req, res) => {
res.status(201).send('GET: /users');
})
.post((req, res) => {
res.status(201).send('POST: /users');
});
app
.route('/posts/:id')
.put((req, res) => {
res.status(201).send('PUT: /users/:id');
})
.delete((req, res) => {
res.status(201).send('DELETE: /users/:id');
});
app.listen(8080);
여기서 좀만 더 정리를 해보자. 하나의 파일에서 post와 user를 모두 작성하는 것은 가독성도 좋지 않고 규모가 커질 경우 유지보수하기가 힘들어질것이다.
express.router()
를 활용하여 모듈로 분리해보자.
우선 디렉토리의 구조를 아래와 같이 작성하자
.
├── app.js
└── routes
├── post.js
└── user.js
import express from 'express';
const router = express.Router();
router.use((req, res, next) => {
console.log('middleware for posts!');
next();
});
router.get('/', (req, res) => {
res.status(201).send('GET: /posts');
});
router.post('/', (req, res) => {
res.status(201).send('POST: /posts');
});
router.put('/:id', (req, res) => {
res.status(201).send('PUT: /posts/:id');
});
router.delete('/:id', (req, res) => {
res.status(201).send('DELETE: /posts/:id');
});
export default router;
express.Router()
를 사용하여 router를 선언하고 router에 /posts
의 하위 경로대로 각 요청에 대한 응답의 처리를 명시한다.
마지막으로 해당 router를 export해준다.
import express from 'express';
const router = express.Router();
router.use((req, res, next) => {
console.log('middleware for users!');
next();
});
router.get('/', (req, res) => {
res.status(201).send('GET: /users');
});
router.post('/', (req, res) => {
res.status(201).send('POST: /users');
});
router.put('/:id', (req, res) => {
res.status(201).send('PUT: /users/:id');
});
router.delete('/:id', (req, res) => {
res.status(201).send('DELETE: /users/:id');
});
export default router;
post 라우터와 동일한 구조로 작성한다.
// in app.js
import express from 'express';
import userRouter from './routes/user.js';
import postRouter from './routes/post.js';
const app = express();
app.use(express.json());
app.use('/users', userRouter);
app.use('/posts', postRouter);
app.listen(8080);
최상위 파일인 app.js
에서는 각각의 라우터 모듈을 임포트해와서 각 경로에 use로 연결해주면된다.