노마드코더 유튜브 클론 챌린지 7일차 TIL

---

📌Mixins / Partials

반복되는 코드를 mixins와 partials를 이용해 따로 관리할 수 있다.

partials은 단순히 반복되는 코드를 위한 것이고
mixins는 일종의 partial이지만 정보를 가져오는 역할도 한다.

partials

footer.pug

footer © Wetube😅

반복되는 코드를 partials 파일에 따로 작성 후

base.pug

doctype html
html(lang="ko")
    head
        title #{pageTitle} 
    body
        header
            h1=pageTitle
        main
            block content
    include partials/footer.pug

코드가 들어갈 자리에 include해준다.

mixins

inform.pug

mixin inform(info)
    div
        h4=info.title
        ul
            li #{info.rating}/5.
            li #{info.comments} comments.

정보를 가져오면서 반복되는 코드를 mixins 파일에 따로 작성한다.
이때, mixin을 정의해주어야 한다.

home.pug

extends base.pug
include mixins/inform

block content
    h1 Hello
    each info in informs
        +inform(info)
    else
        div Sorry nothing found.

mixins 파일을 위에 include해두고
코드가 들어갈 부분에 +해준다.

---

✅ Iteration은 array의 요소에 접근해 특정 행동을 취하고자 할 때 사용함