[Wetube clone] 5.1 궁금증

1. pug(view engin)를 사용한 이유

- 의문점 : 왜 굳이 html을 만들지 않고, pug라는 view engin을 사용하는 걸까?

- 답 :

res.sendFile(__dirname, 'potato.html') 같이 html 파일을 바로 렌더링 할 수 있긴 합니다. 하지만 Nico쌤이 답변해주신 것처럼 request를 통해 각종 변수를 전달하지 못하기 때문에 미리 정해둔 화면 밖에는 보여줄 수가 없고, header 나 footer 등을 따로 partial로 만들어 관리하고 모든 파일에 첨부한다든지 할 수 있기 때문에 pug를 쓰는 것입니다. 또한 pug외에도 ejs등 다른 template engine도 있습니다. 저는 써 본 것 중에서는 pug가 제일 깔끔하고 좋은 것 같네요.
그리고 아예 react등의 framework를 사용하시면 템플릿 엔진 없이 view부분을 만드실 수 있습니다.

rickeykoh 님 답변

 

2. Express 에서의 템플리트 엔진(여기서는 pug) 사용을 위한 app 설정

1) views , 템플리트가 있는 디렉토리 생성

app.set('views', './views')

// 기본적으로 Express 는 views 안에 있는 view를 찾기 때문에! views를 만들어주는 것임.

 

2) view engine으로 pug를 쓰겠다고 설정

app.set("view engine", "pug");

 

*주의할 점

이때, Express는 views 디렉토리를 "현재 작업 디렉토리(cwd : current working directory)" 에서 찾는다.

그래서, 내가 만들어 놓은 views 디렉토리의 위치가 process.cwd/views 가 아니면 오류가 남

 

 // 현재 작업 디렉토리를 알아내는 코드는 아래를 참고

console.log(process.cwd())

 

 

현재 작업 디렉토리 : node.js 를 실행시키는 디렉토리

 

3) views 디렉토리에 생성된 pug 파일을 핸들러에 넣고 render 시켜줘야함

export const trending = (req, res) => {
    res.render("pug파일 이름");
}

요런식으로! 응답을 render된 pug로 하겠다는 거임

 

4. 참고

- 5.1 강의 댓글

- https://www.npmjs.com/package/pug

pug