router에 대해 배워보고, 이전에 만든 파일들을 모듈로 만들어서 연결할것이다.
전체코드 보러가기
Server: 클라이언트의 요청(Request)을 받아 응답(Response)로 돌려준다.
Router: 요청(Request)으로 들어온 URL에 따라 루트(route)를 정해준다.
=> 보통 app.js파일과 router폴더를 만들어서 알맞는 곳으로 인도해준다.
요청(Request)이 날아왔을 때, 원하는 경로에 따라 적절한 방향으로 경로를 안내해주는 것이다.
기존에 만든 channel-demo.js랑 uesr-demo.js파일로 요청이 들어오는걸 컨트롤 해준다.
기존에 const app = express() 대신 const router = express.Router()를 사용하여 라우트로 컨트롤 할 수 있도록 해준다.
그러구 각각의 파일에 modeule.exports = router을 마지막 줄에 넣어 파일들을 모듈화 해준다.
이렇게 만든 모듈들을 app.js파일에서 불러오고, 요청에 대한 경로로 안내하기 위해서 연결해준다.
const express = require("express")
const app = express()
app.use(express.json())
app.listen(7777)
const userRouter = require('./routes/user-demo.js')
const channelRouter = require('./routes/channel-demo.js')
// use를 사용하여 각각의 경로에 라우터를 연결
app.use("/", userRouter)
app.use("/channels", channelRouter)
app.all("*", (req,res)=>{
res.status(404).json({ message: "올바른 URL을 입력해주세요."});
});
로 작성하여 만들어 줄 수 있다.
문제점
초기에 작성한 api외에 다른 URL이 들어왔을 때, 이를 방지하고자 만든 다음 코드가 userRouter파일에서 안에 들어있어서, 회원 API외에 모든 경로에 에러표시가 나오는 문제가 발생.app.all("*", (req,res)=>{ res.status(404).json({ message: "올바른 URL을 입력해주세요."}); });해결 방법: 이를 해결하고자, app.js마지막에 userRouter에 있는 해당 코드를 옮겨줌
초기에 만든 API들은 각각을 위해 만들어 졌기에, 라우트로 묶은 이상 서로에게 주는 영향을 돌아보며 API를 수정해야함
기존에 만든 페이지들을 연결하였지만, 채널을 만들었을 때 어떤 회원이 만든 채널인지에 대한 정보가 없다. 즉,회원 한명당 채널을 생성 및 관리할 수 있도록 만들어줘야한다. 그래서 테이블 끼리 간단하게 연결해줄려고 한다.
| user_id | password | name |
|---|---|---|
| testid1 | 1234 | tester1 |
| id | channel_title | user_id |
|---|---|---|
| 1 | 달려라 채널 | tester1 |
| 2 | 뛰어라 채널 | tester1 |
| 3 | 걸어라 채널 | tester1 |
다음과 같이 테이블이 만들어 졌을때, 채널이 회원에 관한 정보와 1대 다의 관계를 가질 수 있게된다.
1번 채널 "생성" POST /channels
4번 채널 전체 "조회" GET /channels
api에서 1번과 4번을 회원이 로그인했을 때, 유저가 가진 채널만 가져올 수 있도록 수정하기 위해, userId를 받아오도록 설정함
채널 생성: 아직 db를 연결해서 사용하는게 아니라 map을 이용하기에 1번에서 들어오는 userid가 이미 있는 유저 아이디만 들어온다는 것을 전제로 작성하면, 수정할 건 없다.
채널 전체 조회: body에 들어있는 userId를 가지고 있는 채널만을 조회하도록 수정해야함
erd에서 user테이블의 id를 지웠으므로 회원 api도 수정해야한다.
3번 마이페이지(회원 정보 조회) => GET "/users/:id"
이러한 아이디 정보는 정식 서비스에서는 보통 body가 아니라 헤더에 넣어서 전달한다는 점을 알아둬야함
실전 프로젝트에서는 현재 코드와는 달리 다음과 같은 고도화 작업을 필요로 한다.
const { channelTitle, userId } = req.body;