[SpringBoot] 스프링 부트와 AWS로 혼자 구현하는 웹 서비스 - 서버 템플릿엔진과 머스테치 소개

 

API구현에 이어서 이번엔 서버 템플릿 엔진과 머스테치에 대해서 알아보도록 하겠다.

 

 

 

서버 템플릿 엔진

 

웹 개발 프로젝트를 경험한 분들이라면 누구나 JSP를 알 것이다. JSP의 정의에 대해 검색해보면 JSP(Java Server Pages)는 "HTML 코드에 JAVA 코드를 넣어서 웹 서버에서 동적으로 웹 페이지를 생성해서 웹 브라우저에게 돌려주는 서버 사이드 스크립트 언어"라고 나와있다.

정의도 정의지만 스프링 프레임워크를 사용해서 프로젝트를 진행했을 때의 JSP가 어떤 역할을 했는 지를 생각해보면 JSP는 MVC 모델 중 V 즉, View를 만드는데 사용했다. 이런 JSP를 템플릿 엔진이라고도 한다고 한다. 그렇다면 템플릿 엔진이 뭘까?

 

웹 개발에 있어서 템플릿 엔진이란 지정된 템플릿 양식과 데이터를 합쳐져 HTML 문서를 출력하는 소프트웨어를 의미한다.

흔히 알고있는 JSP이외에도 요즘 뜨고 있는 React, Vue 또한 템플릿 엔진이다.이런 템플릿 엔진도 크게 2가지로 구분할 수 있다.

 

1. 서버 템플릿 엔진

서버 템플릿 엔진을 사용해서 화면을 생성할 경우에는 서버에서 java코드로 문자열 만듦 -> 문자열을 html로 변환 -> 브라우저 전달 과정을 거친다. 위에서도 언급했던 JSP가 서버 템플릿 엔진에 해당 된다. 그렇다면 자바 스크립트에서 JSP처럼 자바코드를 사용할 수는 없을까?자바 스크립트는 브라우저 위에서 작동한다. 자바스크립트 코드가 실행되는 곳은 서버가 아닌 브라우저다.즉, 브라우저에서 작동될 땐 서버 템플릿 엔진의 손을 벗어나 제어할 수가 없다. (명확하게는 아니지만 View의 역할만 하도록 구성될 땐 템플릿 엔진으로서 사용 가능(Spring+JSP 사용 경우))

 

 

2. 클라이언트 템플릿 엔진

Reacj.js, Vue.js를 이용한 SPA(Single Page Application)는 브라우저에서 화면을 생성한다. 서버에서 이미 코드가 벗어난 경우이다.

서버에서는 Json이나 Xml 형식의 데이터만 전달하고 클라이언트에서 조립한다.

 

 

머스테치

 

머스테치는 수많은 언어를 지원하는 심플한 템플릿 엔진이다. 

자바뿐만 아니라 루비, 자바스크립트, 파이썬, php 등 대부분의 언어를 지원하며

자바에서 사용될 땐 서버 템플릿 엔진으로,  자바 스크립트에서 사용될 때는 클라이언트 템플릿 엔진으로 모두 사용 가능하다. 

 

자바에선 JSP, Velocity, Freemaker, Thymeleaf 등 다양한 서버 템플릿 엔진이 존재한다.

저자는 이 각각의 서버 템플릿 엔진의 단점들을 찝어줬는데 내용은 다음과 같다.

 

JSP, Velocity	스프링부트에서 권장하지 않는 템플릿 엔진
Freemaker	너무 과하게 많은 기능 지원,  높은 자유도로 인해 숙련도 낮을 수록 Freemaker안에 비즈니스 로직 추가될 가능성 ↑
Thymeleaf	스프링 진영에서 밀고 있지만 문법 어려움, HTML 태그에 속성으로 템플릿 기능을 사용하는 방식으로 높은 허들로 느껴지는 경우 많음

 

책에서는 머스테치를 사용할 것이다. 머스테치의 장점은 뭘까?

 

1. 문법이 다른 템플릿 엔진보다 심플하다.
2. 로직 코드를 사용할 수 없으므로 View 역할과 서버의 역할이 명확하다.
3. Mustache.js와 Mustache.java 2가지가 다 있어서 하나의 문법으로 클라이언트/서버 템플릿을 모두 사용 가능하다.

 

이외에도 인텔리제이 커뮤니티 버전을 사용해도 플러그인을 사용할 수 있다고 한다. 

(책에 의하면 thymeleaf와 jsp 등이 커뮤니티 버전에서 지원하지 않고 얼터메이트 버전에서만 공식 지원된다고 하는데..맞나?)

 

머스테치 플러그인을 설치해서 사용할 경우 머스테치 문법 체크, HTML 문법 지원, 자동완성 등이 지원된다고 한다.

 

 

인텔리제이 마켓 플레이스에서 머스테치를 설치해줬다.

 

 

 

다음으로는 본격적으로 기본 페이지를 만들어 보려고 한다.