Study/script.js

[express] View - PUG

빛장 2020. 2. 24. 23:52

express 로 서버를 만들고 해당 주소로

request 가 들어왔을때 response 를 주는 방법은 저번 글에서도 작성했듯

기본형은 아래와 같다.

app.get("/join", (req, res) => res.send("join"))

이 응답은 단순히 화면에 join 이라는 문구만 출력되게 된다.

 

우리가 어떠한 요청이 들어와서 특정 화면을 그리고싶을때,

express 에서는 템플릿엔진을 설치하여

렌더링을 할 수 있다.

 

http://expressjs.com/ko/guide/using-template-engines.html

 

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

Express와 함께 템플리트 엔진을 사용 Express가 템플리트를 렌더링하려면 다음과 같은 애플리케이션 설정이 필요합니다. views, 템플리트가 있는 디렉토리. 예: app.set('views', './views') view engine, 사용할 템플리트 엔진. 예: app.set('view engine', 'pug') 이후 그에 맞는 템플리트 엔진 npm 패키지를 다음과 같이 설치하십시오. $ npm install pug --save Express

expressjs.com

npm i pug 로 pug 를 설치해 준 뒤,

 

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

위의 명령을 작성하여 모듈을 불러온다.

 

이다음 기본적으로 view engine 은 views 폴더를 기본 경로로 인식하기때문에

package.json 이 있는 경로에 views 폴더를 생성후 안쪽에 pug 문서를 작성한다.

 

이제 요청에대한 응답으로 해당템플릿을 렌더하려면

 

app.get("/join", (req, res) => res.render("join"))

이런식으로 작성하면 된다. 안쪽에 join은 알아서 views 폴더안에서

동일한 이름의 템플릿을 찾아서 렌더링 해주게 된다.