일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- 웹프로그래밍
- 레일즈
- 데스크탑애플리케이션
- Ruby On Rails
- django 공부하기
- Python
- 장고 공부하기
- 루비
- 웹 프로그래밍
- 웹 프론트엔드
- node.js
- 프론트엔드
- 모듈화
- Django
- 웹 프로그래밍 입문
- nodejs
- css3
- 홈페이지 개발하기
- 모닝버드
- nodejs api
- rails
- 장고
- express-mysql-session
- 루비 온 레일즈
- 꿀팁
- 예스인테리어
- jquery
- rails review
- 루비온레일즈
- 파이썬 웹 프레임워크
- Today
- Total
노래하듯 이야기하고, 춤추듯 정복하라.
node.js 템플릿 엔진 pug(jade) 본문
1. node.js 템플릿 엔진 pug(전 버전 이름: Jade)
현재 node.js 개발자들이 가장 많이 사용하는 템플릿 엔진은 pug(퍼그)엔진 입니다. 원래의 이름은 jade(제이드)로 시작하였고 중간에 pug로 바낀 듯합니다. 공식 문서 홈페이지 또한 원래 http://www.jade-lang.com/ 였지만 현재는 https://pugjs.org/로 접속하셔서 보시면 될 것 같습니다.
pug 엔진은 모양새가 아래의 사진처럼 독특합니다. 저도 프로그래밍을 시작한지 얼마 되지 않은 새내기이지만 pug의 모습은 약간의 흥미를 유발합니다.
퍼그의 가장 큰 특징은 기존의 .html 파일처럼 '<', '>' 꺽쇠로 이루어진 태그로 감싸는 방식과 상당히 다르다는 것입니다. 마치 python, java, c 등의 프로그래밍 언어 처럼 들여쓰기를 통해 태그들 사이의 구분을 만듭니다. 아래의 사진은 브라우저에서 소스보기를 통하여 확인해 본 정상적인 html 문서로 변환된 모습입니다.
* 브라우저에서 나타나는 소스코드 모습 ↓
2. node.js 프로젝트에 pug 설치하기
pug 사용을 위한 공식문서 docs 페이지에 접속해보면 아래와 같이 install 하는 방법이 나와있습니다. (사전에 npm을 먼져 설치해주세요.)
* pug docs 페이지 -> https://pugjs.org/api/getting-started.html
* npm 설치하기 -> https://opentutorials.org/course/2136/11852 (이고잉님의 생활코딩)
windows라면 cmd창을, linux라면 터미널을 열고 프로젝트 폴더의 디렉토리로 이동한 후 아래와 같이 "npm install pug" 명령어를 입력해 주시면 됩니다.
'프로그래밍 > node.js' 카테고리의 다른 글
Node.js에서 Session 다루기 (0) | 2018.01.01 |
---|---|
Node.js에서 Cookie값 다루기 (0) | 2017.12.30 |
Node.js 스터이 3일차 (0) | 2017.12.28 |
Node.js와 MySQL 연동하기 (0) | 2017.12.28 |
node.js 개발환경 구축하기 (0) | 2017.12.13 |