7. 익스프레스 (4) - 템플릿 엔진 : Nunjucks 5

 

 

 

○ include

 

넌적스에서도 역시 다른 HTML 파일을 삽입할 수 있습니다. 흔히 말하는 헤더나 푸터, 내비게이션과 같이 공통으로 사용되는 부분을 따로 관리할 수 있습니다. 역시 {% include "파일경로" %} 형식으로 사용하게 됩니다.

 

 

[HTML]

<header>
    <a href="/">HOME</a>
    <a href="/about">About</a>
</header>
<main>
    <h1>메인 파일</h1>
    <p>다른 파일을 include 할 수 있습니다.</p>
</main>
<footer>
    <div>푸터입니다.</div>
</footer>

 

 

[Nunjucks]

<!-- header.html -->
<header>
    <a href="/">HOME</a>
    <a href="/about">About</a>
</header>

<!-- footer.html -->
<footer>
    <div>푸터입니다.</div>
</footer>

<!-- main.html -->
{% include "header.html" %}
<main>
    <h1>메인 파일</h1>
    <p>다른 파일을 include 할 수 있습니다.</p>
</main>
{% include "footer.html" %}