라우터 분리하기
Router로 분리에 필요성에 대해서 알아보자
⛔️ 문제의 app.js - AS-IS
아래 코드는 이전 Basic routing에서 라우팅 작업을 했던 코드입니다.
동작은 잘 되는 코드이지만, Application-Level인 app.js에 역할이 너무 많다는 것입니다.
app.js에 역할
- Router관련된 로직
- Server를 띄워주는 app.listen()로직
현재 아래 코드는 Application-Level에 routing작업이 같이 작성되어 있습니다.
프로젝트 규모가 커질수록 routing작업이 많아집니다.
routing작업이 많아진다는 의미는 여러 경로로 갈 수 있는 화면들이 많아진다는 것을 의미합니다.
결론적으로, 서로 연관되어있는 역할에 Router끼리 파일을 만들어서 관심사를 분리해야합니다.
const express = require('express')
const app = express()
const port = 3000
const { StatusCodes } = require('http-status-codes');
const bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));
app.get('/', (req, res) => {
res.send('Hello World, I\'m Root');
})
app.get('/user', (req, res) => {
res.status(StatusCodes.OK).json({
message: "getUser"
});
});
app.post('/user', (req, res) => {
res.status(StatusCodes.CREATED).json({
message: "create"
});
console.log(req.body);
});
app.patch('/users', (req, res) => {
res.status(StatusCodes.OK).json({
message: "updated user"
});
});
app.delete('/users', (req, res) => {
res.status(StatusCodes.delete).json({
message: "delete user"
});
});
app.listen(port, () => {
console.log(`Example app listening on port ${port}`)
});따라서 위와 같은 app.js파일에 있는 회원(User)에 관련된 라우터(router)를 분리하는 작업을 해보자
📁 routes, controllers 폴더 생성
controllers와 routes 폴더를 생성하였습니다.
라우팅 코드는 다음과 같습니다. PATH와 HANDLER를 받습니다.
app.METHOD(PATH, HANDLER)빨간박스 부분은 routes로, 파란박스 부분은 controller로 분리 할 수 있다.
📂 Controller
위에 클라이언트가 요청한 endpoint에 로직을 수행하는 HANDLER에 대한 로직은 다음과 같습니다.
const { StatusCodes } = require('http-status-codes');
const getUsers = (req, res) => {
console.log("get users called");
res.status(StatusCodes.OK).send("get users");
};
const getUser = (req, res) => {
const { id } = req.params;
console.log("get user called");
res.status(StatusCodes.OK).send("get user");
};
const createUser = (req, res) => {
res.status(StatusCodes.CREATED).json({
user: "user1"
});
}
const removeUser = (req, res) => {
res.status(StatusCodes.OK).json({
message: "removed"
});
};
const updateUser = (req, res) => {
res.status(StatusCodes.OK).json({
message: "updated"
});
}
module.exports = {
getUsers,
getUser,
createUser,
removeUser,
updateUser,
}module.exports로 모든 함수를 외부에서도 사용할 수 있게끔 모듈화 하였다.
📂 routes
routes에 역할은 클라이언트가 어떤 경로로 요청하는지에 대한 엔드포인트(endpoint) 역할을 합니다.
const express = require("express")
const router = express.Router();
const { getUser, getUsers, createUser, updateUser, removeUser } = require("../controllers/users");
router.route("/")
.get(getUsers)
.post(createUser);
router.route("/:id")
.get(getUser)
.patch(updateUser)
.delete(removeUser);
module.exports = router;router를 모듈화 하여 router-Level에서 관리하고 application-Level에서 미들웨어를 통하여 클라이언트와 서버 사이에서 중개자 역할로
사용 할 수 있습니다.
app.js - TOBE
위에 ⛔️ 문제의 app.js - AS-IS보다 코드가 많이 줄어든 것을 확인 할 수 있다.
const express = require('express')
const app = express()
const port = 3000
const { StatusCodes } = require('http-status-codes');
const bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));
const usersRouter = require('./routes/users');
app.use("/users", usersRouter);
app.listen(port, () => {
console.log(`Example app listening on port ${port}`)
});
마치며,
최적화의 끝은 없다.
좋은 퍼포먼스를 내고, 유지보수를 하기 위해서는 많은 고민이 필요하지만 필요하다고 느낄때 하는게 가장 좋은 최적화 방법인 것 같다. 끗