본문 바로가기
개발

[NodeJS] 템플릿

by 마스터누누 2017. 4. 18.
728x90
반응형

템플릿



res.send만으로 html 응답을 주려면 너무 많은 값들이 들어간다.

따라서 템플릿 엔진을 이용하여 보다 복잡한 html 응답을 한다.


템플릿에는 jade, ejs 등 다양한 종류가 있는데

우선 ejs의 사용법에 대해 알아보자






우선 ejs 템플릿 엔진을 사용하기 위해서 npm에서 ejs를 설치해준다.





1
app.set('view engine''ejs');                                                                             
cs


따로 변수에 저장할 필요없이 app.set으로 ejs를 사용한다고 명시해준다 

다른 템플릿을 사용한다면 ejs 위치에 해당 템플릿의 이름을 입력한다.




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>MY APP</title>                                            
    <style media="screen">
      h1{
        text-align: center;
        margin-top: 10rem;
      }
    </style>
  </head>
  <body>
    <h1>welcome <%email%></h1>
  </body>
</html>
cs


템플릿의 설정이 완료되었다면 프로젝트 폴더에 views 폴더를 생성하고

email.ejs 파일을 만든후 위와 같은 코드를 입력한다.

여기서 <%= %> 안에 내용은 나중에 치환될 부분이다.

(JSP와 문법이 똑같다)




1
2
3
4
app.post('/send_email'function(req,res){
  res.render('email.ejs',{'email': req.body.email});                                                         
});
 
cs


이후 res.render를 이용하여 ejs 파일의 <%= %> 값을 변환 후 응답한다.

치환 되는 값은 1개 이상도 가능하다





email을 입력후 보내면 아래와 같은 결과를 볼수 있다.



반응형

'개발' 카테고리의 다른 글

[NodeJS] MySQL 연동  (0) 2017.04.18
[NodeJS] AJAX 처리  (0) 2017.04.18
[NodeJS] POST 요청 받기/응답  (6) 2017.04.18
[NodeJS] GET 요청 받기/응답  (0) 2017.04.18
[NodeJS] 정적 파일 위치 등록  (0) 2017.04.18

댓글