반응형

Pug 템플릿 2

[JavaScript, Node.js] 유튜브 클론 정리 8장 (4) - 유저 프로필 페이지

머리글 이번 시간에는 유저의 프로필 페이지를 제작해 보자. 기존에 했던 작업과 큰 차이가 없다. 유저 프로필 페이지 헤더에 프로필 주소로 갈 공간을 만들자. ... li a(href=`/users/${loggedInUser._id}`) My Profile ... 로그인 한 유저의 아이디를 통해서 접근을 하기로 했다. 그리고 유저 프로필 페이지 접근을 위한 컨트롤러를 제작해 보자. 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: "User not found..

[JavaScript, Node.js] 유튜브 클론 정리 5장 (1) - HTML, Pug

머리글 오늘은 라우터를 통해 HTML 페이지를 렌더링 하는 방법을 알아보자. HTML 렌더링 라우터를 통해 Html을 리턴하는 방법에는 2가지가 있다. 1. res.send(HTML 내용) 을 통해 렌더링 하는 방법 const see = (req, res) => res.send("Hi!"); 이런 방식으로 렌더링이 가능하지만, Html의 소스 코드가 복잡해질수록 불편한 방법이 될 것이다. 2. Pug를 사용해서 렌더링 하는 방법 Pug는 템플릿 엔진이다. 템플릿을 통해 view를 만드는 작업을 도와준다. 우선 Pug를 설치하자. npm i pug 그리고 express가 html 헬퍼로 pug를 사용하게 설정해줘야 한다. 서버 파일로 가서 다음 세팅을 해주자. app.set("view engine", "p..

반응형