-
템플릿엔진이란?Spring Framework 2022. 1. 7. 00:01
이전에 Spring Initailzr를 통하여 스프링 부트를 시작할 때 Dependencies 부분에 Thymeleaf라는 템플릿 엔진을 추가하여 사용했습니다.
또한 동적인 페이지를 만들기 위해 Thymeleaf라는 템플릿 엔진을 사용하기 위해 아래와 같은 HTML을 만들었습니다.
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <title>Hello</title> <meta http-equiv="Content-Type" content="text/html; charset = UTF-8"/> </head> <body> <p th:text="'안녕하세요.' + ${data}" > 안녕하세요. 손님</p> </body> </html>그러면 템플릿엔진이란 무엇일까요?
템플릿 양식과 특정 데이터 모델에 따른 입력 자료를 합성하여 결과 문서를 출력하는 소프트웨어(또는 소프트웨어 컴포넌트)를 말합니다.
그중 웹 템플릿엔진은 웹 템플릿 양식인 View Code(HTML)와 특정 데이터 모델인 Data Logic Code(DB connection 등)을 합성하여 웹 콘텐츠를 출력하는 소프트웨어를 말합니다.
위의 HTML을 예시로 들면 data 부분이 Data Logic Code에 해당하고 View Code는 나머지 부분이 됩니다.
이전에 MVC 패턴에 대해서 알아보았는데 간단하게 설명하자면 Model, View, controller의 약자로 어플리케이션을 세 가지의 역할로 구분하는 디자인 패턴입니다.
즉, 템플릿엔진을 이용한다면 데이터 모델과 View Code를 나누어 MVC 패턴을 쉽게 구현할 수 있을 것이라고 이해했습니다.
템플릿 엔진은 왜 사용할까요?
템플릿 엔진이 없었을 때는 페이지의 일부만 변할 때에도 전체 페이지를 다시 그려야 했습니다. 이 때문에 Ajax가 나오게 되었고 프론트엔드단에서 해당 필요한 데이터 부분만 재가공하여 보여주면 됐습니다.
하지만 데이터 부분을 가공하는데 손이 많이 가기 때문에 서버에서 받아온 데이터를 효과적으로 보여줄 중간 매체를 원하게 되었습니다.
따라서 이 역할을 하는 것이 바로 템플릿 엔진입니다.
템플릿 엔진을 사용할 때 이점
- 똑같은 페이지에 데이터만 바뀔 때 데이터만 바꿔주면 되기 때문에 사용하게 된다면 많은 코드를 줄일 수 있습니다.
- View와 Data를 나누기 때문에 유지보수에 용이합니다.
서버 사이드 템플릿 엔진 VS 클라이언트 사이드 템플릿 엔진
서버 사이드 템플릿 엔진
서버가 클라이언트의 요청을 받았을 때 사용합니다.
HTML 코드에서 고정적으로 사용되는 부분은 템플릿으로 만들어주고 동적으로 생성되는 부분(사용자마다 다른 ID 등)만 템플릿 특정 장소에 끼워 넣는 방식으로 동작할 수 있습니다.
서버 사이드 템플릿 엔진으로는 스프링 부트가 자동 환경 설정을 지원하는 Freemaker, Thymeleaf, Groovy, Mustache 등이 포함됩니다.
클라이언트 사이드 템플릿 엔진
단일 화면에서 특정 이벤트에 따라 화면이 계속 변경되어야 하는 경우에 사용합니다.
웹 페이지에서 여러 카테고리 중 탭을 선택할 때마다 같은 형식의 프레임에 내용만 바뀌는 것처럼 클라이언트가 사용자의 데이터(사용자의 클릭 등)를 받아 DOM 객체에 동적으로 그려주는 프로세스를 담당합니다.
클라이언트 사이트 템플릿 엔진으로는 reactJS, vueJS, angular JS 등이 포함됩니다.
출처
https://usefultoknow.tistory.com/31
https://dlgkstjq623.tistory.com/304?category=786635
https://www.inflearn.com/questions/72824
'Spring Framework' 카테고리의 다른 글
ThymeLeaf vs Mustache vs Groovy vs FreeMarker (0) 2022.01.12 서블렛(Servlet)이란? (0) 2022.01.09 MVC 패턴이란? (스프링 MVC) (0) 2022.01.04 스프링부트 Welcome Page 만들기(스프링부트 hello 출력하는 페이지 만들기) (0) 2021.12.31 build.gradle 파일 분석 (0) 2021.12.29