node의 템플릿 엔진

국물빌런·2020년 6월 6일
0

주말에 회사에 나와서 공부하고 있다.
회사에 가기 끔찍하게 싫었지만 모니터가 무려 3개이고 편한 의자, 눈치볼 사람도 없는 최고의 공부하기 좋은 환경이다.

사실 이러다가 진짜 내가 그토록 경계했던 할 게 없어서 회사에 남아있는 윗사람이 될까봐 좀 겁이 나긴 한다.
그래도 회사가 걸어서 10분 거리라서 편하긴 하다.

노드를 써보고 있다.
노드와 리액트를 이용해서 서비스를 하나 만들 생각인데, 공부하다보니 끝이 없다.
그래도 이 과정을 거치고 나면 내가 다룰수 있는 플랫폼이 또 하나 늘 것이라는 생각에 한다.

노드로 rest api서버를 만느는데 아주 설명이 잘 되어있는 블로그를 찾았다.
https://medium.com/aha-official/%EC%95%84%ED%95%98-rest-api-%EC%84%9C%EB%B2%84-%EA%B0%9C%EB%B0%9C-2-f61c9324d2c2
대단한 사람이다 증말..

암튼 제목이 node의 템플릿 엔진이다.
템플릿 엔진의 사용법을 기록하려고 하는것이 아니다.
종류가 무엇이 있는지를 기록하려는 것이다.
사용법이야 그때 그때 레퍼런스 찾아보면 어떻게든 쓰게 되어있다.

노드도 기본적으로 스프링이랑 뷰를 렌더링 하는 방법은 비슷하다.
요청이 들어오면 데이터를 가공해서 가공한 데이터를 뷰로 넘겨주어 페이지를 리턴해준다.
근데 rest api만드는 블로그를 보다보니 jade는 필요가 없으므로 빼주는 부분이 있었다.
그래서 jade가 무엇인지 찾아보았다. 전에는 ejs를 찾아 봤었다.

EJS(Embedded JavaScript)

서버에서 자바스크립트로 HTML을 생성하는 템플릿 엔진

이게 jsp랑 제일 비슷한 형태이다.
그냥 html에 node에서 넘겨준 변수들만 넣으면 된다.
ex)

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
  </body>
</html>

Jade(현 PUG)

HTML을 간략화한 템플릿 엔진
이넘이 좀 신박했다. jsp같은 형태는 익숙했는데 이 템플릿 엔진은 html페이지를 만들 수 있는 새로운 문법을 만들었다.
ex)
views/layout.jade

doctype html
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    block content

views/index.jade

extends layout

block content
  h1= title
  p Welcome to #{title}

Handlebars

어떤 블로그에서 jade랑 ejs보다 얘가 제일 낫다는 글을 보았다.
이제 확증 편향이 생겨버렸다..얘가 제일 좋다는 생각에서 벗어날 수 없을지도.
얘는 약간 리액트의 조상같은 냄새가 약간 난다.
템플릿들을 부분으로 잘라서 재사용할 수 있다.
자세한건 아래 링크를 참고하자
https://programmingsummaries.tistory.com/381

profile
국물을 달라

0개의 댓글