노마드 코더/유튜브 클론

[JavaScript, Node.js] 유튜브 클론 정리 6장 (6) - Database 수정

LooanCheong 2023. 4. 18. 01:37
반응형

머리글

이번 시간에는 데이터베이스에 있는 데이터를 수정해 보자.

Edit Database

우선 edit 페이지를 처리할 컨트롤러를 생성하자.

const getEdit = async(req, res) => {
    const {id} = req.params;
    const video = await Video.findById(id);
    if (!video) {
        return res.render("404", {pageTitle: "Video not found." });
    }
    return res.render("edit", {pageTitle: `Editing ${video.title}`, video});
};

비디오가 존재한다면, 비디오의 페이지를 띄워주고
그렇지 않다면 404 페이지를 렌더링 한다.

그리고 edit 페이지를 생성해 주자.

form(method="POST")
        input(name="title", placeholder="Video Title", value=video.title, required)
        input(placeholder="Description", required, type="text", name="description", minlength=20, value=video.description)
        input(placeholder="Hashtags, separated by comma.", required, type="text", name="hashtags", value=video.hashtags.join())
        input(value="Save",type="submit")

기본 값으로 원래 가지고 있던 값을 주었고,
해쉬태그의 경우 join을 통해 떨어져 있는 각 값을 합쳐주었다.

그리고 이번엔 postEdit 컨트롤러를 생성하자.

export const postEdit = async (req, res) => {
  const { id } = req.params;
  const { title, description, hashtags } = req.body;
  const video = await Video.exists({ _id: id });
  if (!video) {
    return res.render("404", { pageTitle: "Video not found." });
  }
  await Video.findByIdAndUpdate(id, {
    title,
    description,
    hashtags: hashtags
      .split(",")
      .map((word) => (word.startsWith("#") ? word : `#${word}`)),
  });
  return res.redirect(`/videos/${id}`);
};

id는 파라미터에서 찾을 수 있고,
제목과 설명, 해쉬태그는 req.body를 통해 입력받은 폼에서 찾을 수 있다.

비디오의 경우 존재하는 비디오 중 id가 같은 비디오를 검색해서 찾고,
아이디가 일치하는 비디오가 없다면 404 페이지를 렌더링 한다.

이후 findByIdAndUpdate를 통해서 id와 수정 내용을 argument로 받고,
아이디와 일치하는 데이터의 내용을 입력받은 내용을 토대로 수정한다.

video를 object 자체로 검색하지 않는 이유는 findByIdAndUpdate를 통해서 업데이트가 가능하기 때문이다.
(ex. video.title = title과 같은 방식의 변경이 필요하지 않음)
exist의 경우 비디오 오브젝트를 반환하지 않고 True 혹은 False의 Boolean을 반환한다.

마무리

이번 시간에는 데이터베이스의 내용을 수정하는 방법을 알아보았다.

다음 시간에는 특정 상황에서 사용할 수 있는 Middleware에 대해서 알아보자.

반응형