Express, 템플릿 엔진 사용법(pug)

2022. 8. 10. 20:29CLUG(중앙대학교 sw 과동아리)/server

728x90

express 자체는 템플릿 엔진을 갖고 있지 않기 때문에

템플릿 엔진 기능을 쓰기 위해서는 

템플릿 엔진을 설치해서 express와 연결한 뒤 사용해야함

 

http://expressjs.com/ko/guide/using-template-engines.html#express%EC%99%80-%ED%95%A8%EA%BB%98-%ED%85%9C%ED%94%8C%EB%A6%AC%ED%8A%B8-%EC%97%94%EC%A7%84%EC%9D%84-%EC%82%AC%EC%9A%A9

 

Express와 함께 템플리트 엔진 사용

Express와 함께 템플리트 엔진을 사용 Express가 템플리트를 렌더링하려면 다음과 같은 애플리케이션 설정이 필요합니다. views, 템플리트가 있는 디렉토리. 예: app.set('views', './views') view engine, 사용할

expressjs.com

let express = require('express');
let app = express();

app.set('views','./views');
//views라는 디렉토리를 만들어야함
//pug파일은 views에 넣어야함

app.set('view engine','pug');
//view engine :템플릿 엔진
//pug라는 템플릿 엔진을 셋팅
//사용할 템플릿 엔진을 express에게 알려주는 명령어
//우리가 설치한 pug라는 템플릿 엔진과 프레임워크인 express를 연결하는 코드

app.get('/template',function(req,res){
  res.render('temp');
  //템플릿엔진을 이용할 때는 render(소스코드를 가져와 웹페이지를 만듦)사용
  //'temp'라는 템플릿 파일을 웹페이지로 rendering해서 사용자에게 전송한다.
  //temp를 pug문법에 따라 해석해서 가져옴
})

app.listen(3000, function(){
  console.log('Connected 3000 port!');
})

코드가 너무 못생김!!!

app.js에 추가
오 이뻐졌당
pug파일에서 내부적으로 time이라는 변수를 사용할 수 있게 됨

 

현재시간을 출력하고 싶다면?

변수로 <title> 추가하기