node.js 웹사이트 개발 - express, EJS

템플릿 엔진은 웹사이트에서 정형화된 동적인 데이터를 html로 표현해주는 모듈로, nodejs에서 많이 사용하는 EJS 템플릿 엔진 사용에 대해 알아본다. EJS 가 html 과 비슷하여 사용하기 쉽다.

 

* Express.js 를 사용한다면 ejs 모듈을 따로 설치하지 않고도 바로 사용을 할 수 있다.

 

Express에서  EJS 템플릿 사용하기

ejs 기본적인 사용법

// app.js

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

app.set('view engine', 'ejs');			// Express 에서 view엔진을 ejs 로 설정

app.get("/", function(req, res) {
    res.render("home");                 // render 파일명(ejs 확장자는 생략이 가능)
});

 

 

디폴트 경로 설정

ejs 의 템플릿의 기본 경로는 views 디렉터리로 설정이 되어 있기 때문에 기본 경로를 변경하기 위해서는 아래처럼 경로 설정을 해야 한다.

app.set('views', __dirname + '/views/ejs');

 

 

 

ejs view 페이지로 데이터 전달

json 데이터를 전달하면 ejs에서 string, number 뿐 아니라 array에 대해서도 json key로 접근이 가능하다. 

app.get("/", function(req, res) {
    res.render("home.ejs", {"name": "관리자"});
});

 

* EJS 기본적인 문법

 

• 주석 : <%# ... %>
• JS 코드 : <% ... %>
• 변수 출력(html escape 처리: >를 $gt로 변환) : <%= ... %>
• 태그내부 공백 제거 : <%_ ... _%>
• html escape안하고 변수 출력 : <%- ... %>

출처: https://sjh836.tistory.com/155 [빨간색코딩]