#5.7 Conditionals(조건문)

들어가기전...

HTML의 요소들을 예쁘게 만들어줌(CSS는 맨 마지막에 할것이기 때문에 임시방편으로 이걸로 스타일 적용하고 실습)
https://andybrewer.github.io/mvp/

base.pug

doctype html
html(lang="ko")
    head
        title #{pageTitle} | Wetube
        link(rel="stylesheet", href="https://unpkg.com/mvp.css")
    body
        main
            block content
            include partials/footer.pug

---

Conditionals(조건문)

https://pugjs.org/language/conditionals.html

• js랑 작성하는법은 같고 pug문법으로만 바꿔서 작성

실습

1. videoController.js 에 fakeUser 만들어서 테스트

const fakeUser = {
  username: "Jini",
  loggendIn: true,
};

export const trending = (req, res) =>
  res.render("home", { pageTitle: "Home", fakeUser: fakeUser });
//res.render("home", { pageTitle: "Home", fakeUser });로 해도됨(ES6문법)

2. base.pug에 login,logout 시 나올 문구 확인해보기

body
        header
            if fakeUser.loggendIn
                small Hello #{fakeUser.username} 
            nav
                ul
                    if fakeUser.loggendIn
                        li 
                            a(href="/logout") Log out
                    else
                        li 
                            a(href="/login") Login
            
            h1=pageTitle
            //- h1은 오직하나의 값을 가짐 그래서 h1뒤에 =을 붙이고 변수를 쓰면 변수로 인식한다.
            //- #{}을 사용해도되지만 다른 text와 섞어서 쓰는것이 아니면 위처럼 작성
        main
            block content
            include partials/footer.pug