템플릿 엔진 ( Mustache 와 JSP 그리고 Thymeleaf)

템플릿 엔진

우선 우리는 템플릿 엔진이 무엇인지 부터 알아야 할 필요가 있다

템플릿 엔진이란 지정된 템플릿 양식과 데이터가 합쳐져 html 문서를 만들어주는 SW

• 프로그램 로직과 프레젠테이션 계층을 분리하기 위한 수단
• 프레젠테이션 계층에서 로직을 쉽게 표현하고, 개발의 유연성을 향상 시키며 유지보수의 효율 또한 향상된다.

서버 템플릿 엔진

말 그대로 서버에서 동작하는 템플릿

템플릿 양식과 데이터를 이용해 html을 생성하여 브라우저에 전달한다.

 

JSP(+spring)를 비롯한 서버 템플릿 엔진은 서버에서 구동

즉, 서버에서 Java코드로 문자열을 만든 뒤 이 문자열을 html로 변환해 브라우저로 전달한다.

 

클라이언트 템플릿 엔진

React, Vue, Anguler와 같이 서버에서 데이터를 전달받고 전달받은 데이터를 가지고 웹 화면을 꾸며주는 라이브러리 ( 혹은 프레임워크)

SPA(Single Page Application) 환경으로 웹 서비스를 개발하는 업체가 늘어나고 있다

※ 자바 스크립트를 배울때 콘솔창을 사용해본적이 있는가?
이 뜻은 곧 자바스크립트는 브라우저 위에서 구동된다고 볼 수 있다.
브라우저에서 구동 되고 있는 언어는 서버 템플릿 엔진의 손을 벗어나 제어할 수 없다

Mustache

• Mustache가 추구하는것은 logic-less template이다 즉, 화면단에서는 로직을 제외한 데이터만 전달하겠다 라는 뜻
• mustache는 데이터와 간단한 출력, 조건문으로 구성되어있다
• Mustache.js(클라이언트)와 Mustache.java(서버) 이렇게 두 가지가 존재한다 
  • 서버에서 다룰때
  • Mustach 템플릿 파일을 호출하려면 반드시 컨트롤러를 이용해 호출해야한다.
  • Mustache의 파일 위치는 기본적으로 src/main/resources/templates 이다
  • 파일 확장자면은 .mustache이다 ( .html 파일 확장자를 .mustache로 생성한다.)
• Mustache는 스프링부트에서 공식으로 지원하는 템플릿 엔진
• Mustache는 가장 심플한 템플릿 엔진이다.

JSP ( Java Server Page )

• JSP는 Java언어를 지원한다. 
• JSP는 로직구현이 가능하다, 
  예를 들어 서버에서는 Java를 사용하고 클라이언트에서는 JavaScript를 사용한다 근데 이 두개의 서로 다른 코드가 한곳에 뒤섞여있다면 유지보수에 굉장한 어려움을 겪게 된다.
• JSP는 스프링부트에서는 권장하지 않는 템플릿 엔진

Thymeleaf

• 새로운 뷰 템플릿의 등장
• html 태그에 속성으로 템플릿 기능을 사용
• Thymeleaf의 주 목표는 유지관리가 쉬운 템플릿 생성 방법을 제공하는 것이며, 실제로 템플릿에 영향을 주지 않는 방식을 사용한다. 이는 디자인과 개발팀의 갈등해소에 큰 도움이된다