ExpressJS nunjucks

ExpressJS nunjucks

템플릿 엔

- npm i nunjucks

- nunjucks
const nunjucks = require("nunjucks");

app.set("view engine", "html");

nunjucks.configure("views", {
	express : app,
    watch : true,
})

- 서버 변수 가져오기 : {{ 변수 }}
- 내부 변수 선언 : {%set node = "node" %} {%set js = "js" %}

- for in : 반복문
<ul>
    {$set area = ["강북구", "강남구", "강서구", "강동구"] %}
    {$ for item in area $}
    <li>{{ item }}</li>
    {% endfor %}
</ul>

- if : 조건문
* 조건문(if)
{% if true %}
<div>true</div>
{% else %}
<div>false</div>
{% endif %}

- if elif : 조건문(if elseif)
{% if area === "강동구" %}
<p>강동구 입니다.</p>
{% elif area === "강남구" %}
<p>강남구 입니다.</p>
{% elif area === "강서구" %}
<p>강서구 입니다.</p>
{% else %}
<p>강북구 입니다.</p>
{% endif %}

- include : 파일이 다른 파일을 불러올 수 있음
- include 파일 경로
- header.html
<header>
    <a href="/">메인 페이지</a>
</header>

footer.html
<footer>
    <div>푸터</div>
</footer>

index.html
{% include "header.html" %}
<main>
    <h1>메인 페이지</h1>
</main>
{% include "footer.html" %}