인파

You Can Become A

늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !

공부한 내용을 정리합니다
Node.js/Nunjucks

[Nunjucks] 📚 넌적스 Macro 사용법 - 템플릿 함수

넌적스 macro PUG의 mixin과 javaScript의 function(){}과 비슷한 개념으로 템플릿을 모듈화 하여 관리하기 쉽게 만드는 기능입니다. {% macro 매크로명 %} {% endmacro %} forms.html {% macro field(name, value='', type='text') %} {% endmacro %} {% macro label(text) %} {{ text }} {% endmacro %} {% from "forms.html" import field, label%} {{ label('Username') }} {{ field('user') }} {{ label('Password') }} {{ field('pass', type='password') }} link.ht..

category_image
인파_
2022.07.03
(0)
Node.js/Nunjucks

[Nunjucks] 📚 넌적스 super (템플릿 상속)

넌적스 super() - 템플릿 상속 템플릿에서 {% block %}과 {% endblock %} 사이에 내용이 있을 경우, {% extends %}가 실행되면 기존 내용은 사라집니다. 만약 기존 내용을 유지하고, 이어서 내용을 삽입하고 싶을 때는, 템플릿을 불러오는 쪽에 super()를 삽입하면 됩니다. 그리고 한 파일에, 여러개의 {% block %}을 지정해 줄 수 있습니다. 다만 블록 이름에 주의하면 됩니다. layout.njk {% block slide-script %} {% endblock %} {% block slide %} This is a test! {% endblock %} slide.njk {% extends “./layout.njk” %} {% block slide-script %}..

category_image
인파_
2021.11.16
(0)
Node.js/Nunjucks

[Nunjucks] 📚 넌적스 기본 문법 💯 총정리

Nunjucks 넌적스는 템플릿 엔진 중 하나로 모질라 재단에서 만든 템플릿 입니다. Express에서 따로 설치과정없이 바로 쓸수있는 PUG와 달리 넌적스는 따로 설치가 필요합니다. Node.js의 대표적은 템플릿 엔진 으로는 pub와 nunjucks가 있습니다. 다만 개인적인 생각으로는 pug보다는 nunjucks가 활용도가 뛰어난 것 같습니다. 성능면에서는 pug가 렌더링 속도가 nunjucks보다 빠르지만, pug는 따로 html태그를 pug용 문법으로 변환해야 되지만 넌적스는 html 문법을 그대로 차용이 가능하기 때문에 호환성이 매우 좋기 때문입니다. 예를 들어 넌적스는 남이 만들어놓은 시맨틱 태그 구조를 그대로 복붙하여 사용하면 되지만, pug는 따로 변환작업을 해줘야 하죠. 어차피 프론트는..

category_image
인파_
2021.11.15
(0)