19.11.07 findOneAndUpdate

비디오 수정 페이지

videoRouter.js

// edit video
// (1) getEditVideo 함수를 실행, routes.editVideo() 경로로 간다
videoRouter.get(routes.editVideo(), getEditVideo);
// (2) post 메서드시 postEditVideo 함수를 실행, routes.editVideo() 경로로 간다
videoRouter.post(routes.editVideo(), postEditVideo);

• 비디오 라우터에서 get메서드, post메서드 분리

videoController.js

import routes from "../routes";
import Video from "../models/Video";
...
export const getEditVideo = async (req,res) => {
	// 수정할 비디오의 id 값을 req 파라미터로 받는다
    const { params: {id} } = req;
    // 성공시 해당하는 id 비디오를 editVideo.pug 에 렌더링
    try{
        const video = await Video.findById(id);
        res.render("editVideo", {pageTitle: `edit ${video.title}`, video:video});
    // 실패시 홈으로 리다이렉트
    } catch (error) {
        res.redirect(routes.home);
    }
}

• videoController에서 해당 비디오 값을 받아 /videos/${id}/edit 링크로 editVideo.pug 에 렌더링

routes.js

...
  },
  editVideo: (id) =>{
    if(id){
      return `/videos/${id}/edit`;
    }else{
      return EDIT_VIDEO
    }
  },

editVideo.pug

extends layouts/main.pug

block content
    div.form-container
    	// 이 폼은  post 형식으로 보내고 
        // 도착 경로는 routes.editVideo(video.id)이다
        form(action=routes.editVideo(video.id), method="post")
            label(for="file") edit File
            // 인풋 박스는 해당 비디오의 타이틀이 들어있다
            input(type="text", placeholder="Title", name="title", value=video.title)
            // 설명 박스는 해당 비디오의 설명이 들어있다
            // 이 비디오 정보는 videoController.js의
            // Vimport Video from "../models/Video"; 에서 가져온다
            textarea(name="description", placeholder="description")=video.description
            input(type="submit", value="update Video")
        a.form-container__link.form-container__link--delete(href=routes.deleteVideo(video.id)) delete Video

• 이 폼은 post 형식으로 타이틀과 설명 인풋 후 전송 시 routes.editVideo(video.id)에 도착한다

videoController.js

export const postEditVideo = async (req,res) =>{
	// post 할 비디오의 id를 req 파라미터 값으로 받고
    // 수정 부분인 타이틀과 설명은 req 바디 값으로 받아 변수 지정
    const { params: {id}, body : {title, description} } = req;
    try{
        // {title,description}은 수정 값이고 첫번째 {id}는 그 수정을 반영&업데이트할 값
        await Video.findOneAndUpdate({_id:id},{title,description});
        res.redirect(routes.videoDetail(id));
    } catch (error) {
        res.redirect(routes.home);
    }
}

• 수정 할 비디오의 id 값을 받고 title, description 변수를 지정
• 몽구스의 findOneAndUpdate 쿼리로 (수정 반영할 id, 수정 값 title, descript)을 지정
• 해당 id의 비디오 디테일 페이지로 리다이렉트