Youtube Clone Coding (2. ROUTER)

Router 나누기 (/edit-video 보단 /video/edit가 더 나은 Router)

/ -> Home

/join -> Join

/login -> Login

/search -> Search

/users/:id -> See User

/users/logout -> Log out

/users/edit -> Edit My Profile

/users/delete -> Delete My Profile

/videos/:id -> See Video

/videos/:id/edit -> Edit Video

/videos/:id/delete -> Delete Video

/videos/upload -> Uplaod Video

Router 만드는법

const userRouter = express.Router();
const handleEditUser = (req, res) => res.send("Edit User");
userRouter.get("/edit", handleEditUser);

app.use("/users", userRouter);

사용자가 /users/edit로 들어가면 먼저 app.use("/users", userRouter)에서 /users라는 주소가 있는지 확인함. /users/edit에서 /users가 있으므로 /users/edit에서 /users를 뺀 나머지 부분확인. 나머지 부분이 /edit이므로 userRouter.get("/edit", handleEditUser)실행

exprot default 와 export 차이점

1. export default
   1. 하나만 내보낼 수 있음.
   2. 가져올때 {}로 감싸줄 필요 없음.
   3. import할때 다른 이름으로 가져올 수 있음.
2. export
   1. 여러개 내보낼 수 있음.
   2. 가져올때 {}로 감싸줘야함.
   3. import할때 다른 이름으로 가져올 수 없음.

:id

1. /:id/edit 에서 :id는 변수부분임. 아무거나 들어올 수 있음. ex) /12321/edit
2. :id부분은 req.params에 저장됨. ex) /12321/edit → console.log(req.params) → { id: '12321' }

정규표현식

https://kasterra.github.io/regex1-the-basic-operation/

route method

videoRouter.get("/:id/edit", getEdit);
videoRouter.post("/:id/edit", postEdit);

위의 코드를 다음과 같이 쓸 수 있다.

videoRouter.route("/:id/edit").get(getEdit).post(postEdit);

res.redirect("url주소")

• 해당 url주소로 이동한다.

a(href=${video.id}/edit) 와 a(href=/${video.id}/edit) 차이점

1. a(href=${video.id}/edit)
   1. 현재 url이 localhost:4000/videos/123 일때 a를 클릭시 localhost:4000/videos/123/edit로 가짐
2. a(href=/${video.id}/edit)
   1. 현재 url이 localhost:4000/videos/123 일때 a를 클릭시 localhost:4000/123/edit로 가짐