[라즈베리파이] Node.js 를 이용해 간단한 서버 구축하기(3) – Pug 사용하기

 

 

템플릿 엔진이란 데이터가 정적으로 정해진 html 파일이 아닌, 동적으로 바뀌는 데이터에 맞추어 웹페이지를 생성할 수 있는 소프트웨어를 말합니다.

즉, HTML 코드에서 고정적으로 사용되는 부분은 템플릿으로 만들어두고, JavaScript 코드로 동적으로 생성되는 부분만 템플릿 특정 장소에 끼워넣는 방식으로 동작할 수 있도록 해주는 엔진이 템플릿 엔진입니다.

 

이번 포스트에서는 Node.js의 대표적인 템플릿 엔진인 Pug를 사용하는 방법을 간단하게 알아보겠습니다. Pug는 Jade 의 새로운 이름으로 저작권 문제로 인해 지금의 이름으로 변경되었습니다. 다른 정보를 더 찾아보시고 싶으시면 Jade로 검색하셔도 됩니다.

Pug를 사용하기 위해서는 모듈을 설치해야 합니다.

 

다음은 이전 포스팅의 웹페이지를 Pug를 이용해 구현한 예제입니다.

[ index.js ]

[ hello.pug ]

pug 파일들을 저장할 view_file 폴더를 생성하고 hello.pug 파일을 view_file 폴더에 저장합니다.

 

‘views’ 에 pug 파일이 있는 폴더를 지정하고 ‘view engine’으로 pug를 사용한다고 지정합니다.

 

웹브라우저를 통해 http://localhost:3000/hello 에 접근하면 응답으로 hello라는 pug파일을 렌더링합니다. 렌더링 시 title 과 body 에 보여지는 텍스트를 title 과 message라는 값으로 넘겨주어 보여지도록 합니다.

 

결과를 확인해 보면 이전 포스팅에 올렸던 html 파일과 동일한 소스가 로드된 것을 확인할 수 있습니다.

 

 

 

 

참고자료

 

 

Post Author: yscwcb

2 thoughts on “[라즈베리파이] Node.js 를 이용해 간단한 서버 구축하기(3) – Pug 사용하기

댓글 남기기

이메일은 공개되지 않습니다.