본문 바로가기

Youtube Clone Coding

유저 프로필 페이지

이 페이지는 유튜브의 채널 같이 모든 사용자들이 특정 유저의 프로필을 볼 수 있게 할 예정이다. 어떤 유저가 무슨 영상을 올렸고, 언제 올렸는지 등등의 정보를 담을 것이다. 그러기 위해서는 내가 가진 Video모델과 User모델을 연결 시켜주어야 한다. 그래야 누가 어떤 영상을 올렸는지 구분할 수 있을거다.

 

1. pug에서 anchor로 링크 생성

일단 홈페이지에서 로그인된 상태라면 유저의 '내 프로필'을 들어갈 수 있게 하는 링크를 만들어야 한다. 간단하니까 코드는 넣지 않겠다. 

 

2. 라우터를 생성해주어 컨트롤러와 연결

userRouter.get("/:id", see);

그냥 페이지를 렌더링 해주는 것이므로, post요청은 필요 없다(고 생각했다).

 

3. 컨트롤러를 만들어줌

export const see = async (req, res) => {
    const { id } = req.params;
    const user = await User.findById(id);
    if (!user) {
        return res.status(404).render("404", { pageTitle: "유저가 존재하지 않음." });
    }
    return res.render("users/profile", { pageTitle: user.name, user });
}

일단 이 페이지는 누구나 볼 수 있어야 하므로, 유저 id는 세션으로 부터 가져오는 것이 아니라 url에서 뽑아온다. 왜냐면 url은 모두에게 공개되어 있기 때문이다. 따라서 req.params 에서 id를 가져오고 해당 유저를 User 모델에서 찾는다. 없다면 404 페이지를 렌더링 해주고 에러메세지를 띄운다. 유저가 있다면 users 폴더 안에 있는 profile.pug 를 렌더링 해주고 user객체를 넘겨준다.

'Youtube Clone Coding' 카테고리의 다른 글

ref와 populate  (0) 2022.11.22
Video와 User 모델 연결 & 영상 보여주기  (0) 2022.11.22
영상 파일 업로드  (0) 2022.11.21
파일 업로드  (0) 2022.11.21
비밀번호 변경  (0) 2022.11.21