새로운 강의는 이제 https://memi.dev 에서 진행합니다.
memi가 Vue & Firebase로 직접 만든 새로운 사이트를 소개합니다.

바로가기


npm pug

최대 1 분 소요

html 해본 사람이라면 코딩할 때 정말 짜증나는 것이 있다면

바로 브라켓 닫기 작성…

eg) html <p>아. 짜증나</p> <!-- 주석이랍니다.. -->

’<’도 ‘>’도 짜증나는데 닫기까지해야되며 주석까지 닫아야 되다 보니 주석을 남기기가 싫어진다..

물론 에디터들이 </p> 정도는 자동으로 닫아지게 도와주긴 하지만… </div> 지옥을 만나면 소용 없다..

그래서 등장한 것이 pug

pug는 html을 편하게 작성할 수 있는 나름의 언어이다.

작년에 jade에서 이름이 pug로 변경되었다..

node.js express를 설치하면 pug,ejs등 렌더러를 서너가지를 고를 수 있는데 기본값으로 pug가 선택되어있다.

사용

node express를 사용했다면 기본 헬로월드가 pug로 되어있어서 대충 따라하면된다.

단순히 html도우미(제네레이터)이기 때문에 꼭 node 기반일 필요는 없다.

이제 이렇게 사용해볼 수 있다..

입력 : pug

#goodid
    p 안녕
    //이건 주석

출력 : html

<div id="goodid">
    <p>안녕</p>
    <!-- 이건 주석 -->
</div>

pug 같은 거 쓰다가 html 쓸 용기가 안난다. 물론 피할 수는 없지만…

더 자세한것은 링크를 보면 느낌이 온다..

https://pugjs.org

결론

10년이 걸려도 불어는 못배우지만 퍼그는 배우는데 이틀 안걸린다..

이틀을 손해보고 일년을 편할 것인지 일년을 불편하게 지내고 이틀을 세이브하든지…

태그: , ,

카테고리:

업데이트:

댓글남기기