노마드 코더/유튜브 클론

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

LooanCheong 2023. 4. 20. 02:32
반응형

머리글

이번 시간에는 데이터 베이스 삭제하는 방법과 검색하는 방법에 대해서 알아보자.

Delete Database

우선 적당히 delete 페이지로 이어질 링크를 하나 생성해 주자.

a(href=`{video.id}/delete`) Delete Video

없는 라우터를 사용했으므로, 라우터도 하나 생성해 주자.

import {
	...
	deleteVideo,
} from "../controllers/videoController";
...

videoRouter.route("/:id([0-9a-f]{24})/delete").get(deleteVideo);

이제 컨트롤러도 생성해 보자.

export const deleteVideo = async (req, res) => {
  const { id } = req.params;
  await Video.findByIdAndDelete(id);
  return res.redirect("/");
};

비디오의 id는 req.params로 받아올 수 있고,
findByIdAndDelete(id)를 통해서 id에 맞는 비디오를 삭제할 수 있다.

이렇게 하면 데이터 삭제가 가능하다.

굉장히 간단하게 진행했지만,
앞서 진행했던 내용을 다 활용해 볼 수 있었다.

이제 데이터 베이스에 있는 내용을 검색해서 띄울 수 있게 검색 창을 구현해 보자.

Search Database

우선 검색을 하기 위한 검색 페이지를 생성해 주자.

extends base.pug

block content
    form(method="GET")
        input(placeholder="Search by title",name="keyword", type="text")
        input(type="submit", value="Search now")

앞서 비디오를 생성할 때와 크게 다르지 않다.
이번엔 GET 메서드를 사용했다는 차이만 있다.

input에 name을 지정하지 않으면 URL에 나타나지 않음을 유의하자.

이제 컨트롤러를 생성한다.

export const search = async (req, res) => {
  const { keyword } = req.query;
  let videos = [];
  if (keyword) {
    videos = await Video.find({
      title: {
        $regex: new RegExp(`${keyword}$`, "i"),
      },
    });
  }
  return res.render("search", { pageTitle: "Search", videos });
};

키워드는 req.query로 form에서 제출한 내용을 받아올 수 있고,
videos라는 빈 어레이를 하나 생성하자.

$regex는 정규식의 사용 방법이다.
대소문자 구분 없이 키워드가 포함된 제목을 검색하겠다는 의미이다.

이런 식으로 데이터 베이스의 특정 내용을 검색할 수 있다.

정규식과 조금 익숙해질 필요가 있어 보인다.

 

마무리

이번 시간에는 데이터의 삭제와 검색에 대해서 알아보았다.

다음 시간부터는 유저 인증 과정에 대해서 알아보자.

반응형