- Pug는 view engine으로, HTML 파일들을 쉽게 만들 수 있게 도와준다.
- .html 파일에서는 [<p>Hello</p>]라고 써야하는 것을 .pug 파일에서는 [p Hello] 라고 쓰면 됨
- .pug파일은 자동으로 .html으로 변환되어 서버에 반영된다.
- npm install pug
- express의 view engine을 pug로 바꾼다. - app.js에 app.set("view engine", "pug"); 추가
- 앞으로 pug 파일들을 /views에 저장한다.
- Pug를 이용하면 반복 작업을 줄일 수 있다.
- 모든 페이지는 header, footer, HTML head 태그, css link를 필요로 한다.
- /views/layout 안에 main.pug를 만들고, 공통적인 양식을 여기에 저장
- 다른 pug 파일에서 extends layouts/main.pug 라고 쓰면 이 레이아웃을 사용할 수 있다.
- 페이지마다 달라지는 내용은 block content 부분에 추가하면 된다.
- 서버에서 응답으로 res.send로 텍스트를 전송하는 대신 이런 템플릿을 보여주려면 res.render를 사용.
- res.render("home")은 views/home.pug를 표현하겠다는 뜻
'Youtube Clone > ExpressJS' 카테고리의 다른 글
Local2Global (0) | 2019.09.18 |
---|---|
Partials (0) | 2019.09.18 |
Router 쪼개기 (0) | 2019.09.17 |
Router (0) | 2019.09.17 |
Middlewares (0) | 2019.09.17 |