그동안 user와 channel을 각각의 파일에서 작업을 하고 확인을 진행하였는데요. 이제 router를 이용하여 router 관리를 해보려합니다.
폴더구조 정리
기존에 루트 폴더에 있던 channels.js와 users.js를 routes폴더 안에 넣고, 서버구동에 사용하는 app.js를 생성하였습니다.
root
├─ app.js
└─ routes
├─ channels.js
└─ users.js
이제 router로 관리를 하기 위해서 channels와 users 파일을 모듈로 만드는 작업을 해보려 합니다.
기존 channels와 users 파일
//기존의 app을 router로 변경
const app = express(); → const router = express.Router();
app.get(경로,콜백함수) → router.get(경로, 콜백함수)
//서버구동에 필요한 코드들 삭제
app.use(express.json())
app.listen(포트,콜백함수)
//모듈 코드 추가
module.exports = router
1) app → router
제일 먼저 변경한 것은 바로 app을 router로 변경하는 것입니다. 이때 app에서는 express()를 변수로 담았는데요 router의 경우에는 express.Router()를 담아야 합니다.
2) 서버구동에 필요한 코드들은 전부 app.js로 이동을 할 것이기 때문에 app.use나 app.listen과 같은 코드들은 삭제를 하였습니다.
3) 모듈 코드 추가
해당 파일의 router를 모듈로 만들어주기 위해서 router를 module.exports를 통해서 모듈로 만들어 어디에서든 사용할 수 있게 만들었습니다.
app.js 파일
app.js를 만드는 만큼 다시 작성을 해야 하는 코드도 있는데요. 기본적인 코드들을 살펴봅시다.
const express = require("express");
const app = express();
const PORT = 8080;
//router가져오기
const userRouter = require("./routes/users");
const channelRouter = require("./routes/channels");
// users와 channels에서 사용한 코드
app.use(express.json());
//router 사용하기
app.use("/", userRouter);
app.use("/channels", channelRouter);
app.listen(PORT, () => {
console.log(`connected port number ${PORT}`);
});
1) express
app.js도 마찬가지로 express로 작동할 것이기 때문에 변수에 express를 담아 사용하였습니다.
2) 모듈로 만든 router 가져오기
모듈이기 때문에 require를 통해서 파일 경로를 작성하여 해당 router를 변수에 담았습니다.
3) router는 app.use(경로, 모듈) 이렇게 사용을 할 수 있습니다. 이때 경로는 공통 path를 받아오며 공통자가 없는 경우에는 /를 사용하면 됩니다.
4) 마지막으로 기존 파일에서 삭제 express.json()과 listen을 추가해 주시면 됩니다.
이렇게 server와 router를 분리하고 server에서 router를 연결해 보았습니다. 작업을 다 한 후에는 postman을 통해서 기존에 작업한 코드들이 에러발생이 나지 않는지 확인해 보면서 문제가 발생했다면 해당 코드를 수정하는 작업을 거치면 마무리가 될 것 같습니다.
'프로젝트 > 1.youtube-project' 카테고리의 다른 글
회원 리팩토링 코드 (0) | 2023.12.22 |
---|---|
[실전]미니 프로젝트 - channel과 user ERD를 생각해보자 (0) | 2023.12.17 |
[실전]미니 프로젝트 - 채널 전체 "조회" (0) | 2023.12.16 |
[실전]미니 프로젝트 - 채널 개별 "수정" (0) | 2023.12.15 |
[실전]미니 프로젝트 - 개별 채널 "삭제" (0) | 2023.12.15 |