Thymeleaf

Thymeleaf

타임리프란 자바 기반의 서버 사이드 템플릿 엔진이다. 웹 애플리케이션 개발 시 동적인 HTML을 생성하는 데 사용되며 XML, JavaScript, CSS, 텍스트 등 다양한 형식의 템플릿을 처리할 수 있다.

👉🏻서버 사이드 템플릿 엔진
서버에서 데이터를 받아와 특정 템플릿에 데이터를 채워 넣거나 조건에 따라 동적으로 HTML을 생성. 사용자 각각에게 개인화된 동적인 웹 페이지를 제공하는 데 필요한 도구이다.

특징

타임리프의 주요 특징은 다음과 같다.

1. 스프링 통합: 타임리프는 스프링 프레임워크와 통합되어 있어 스프링 MVC에서 사용할 수 있는 표준 템플릿 엔진이다.

2. 다양한 기능: 반복, 조건 분기, 텍스트 변경, DOM 조작 등 다양한 HTML 동적 생성 기능을 제공한다.

3. 표준 준수: HTML5, HTML4, XML 등의 웹 표준을 준수한다.

타임리프는 이러한 특징을 바탕으로 HTML 파일 내에서 직접 데이터 바인딩, 조건 처리, 반복 처리 등을 수행한다. 이를 위해 th:라는 네임스페이스를 사용한 다양한 속성을 제공한다.

속성

타임리프는 여러 속성을 제공하여 HTML 문서를 동적으로 만들 수 있게 해준다. 다음은 주요한 타임리프 속성들이다.

1. th:text: HTML 엘리먼트의 텍스트 내용을 변경한다. 이 속성에 지정된 표현식이 해당 엘리먼트의 내용으로 대체된다.

<p th:text="${name}">Old text</p>
<!--name 변수의 값으로 "Old text"를 대체-->

2. th:value: input 엘리먼트의 value 속성을 설정한다.

<input type="text" th:value="${name}" />
<!--name 변수의 값으로 input 엘리먼트의 value를 설정-->

3. th:each: 반복문(loop)을 생성한다. 이 속성을 사용하면 컬렉션을 순회하면서 HTML 엘리먼트를 반복적으로 생성할 수 있다.

<tr th:each="user : ${users}">
<!--users 컬렉션의 각 user에 대해 <tr> 엘리먼트를 생성-->

4. th:if, th:unless: 조건문을 생성한다. th:if는 표현식이 참일 때 엘리먼트를 포함하고, th:unless는 표현식이 거짓일 때 엘리먼트를 포함한다.

<div th:if="${isAdmin}">Admin Panel</div>
<!--isAdmin이 참일 때만 "Admin Panel" div를 생성-->

5. th:href, th:src: 링크(URL)을 동적으로 생성합니다. 이들은 각각 <a> 태그의 href 속성과 <img> 태그의 src 속성을 대체해 사용된다.

<a th:href="@{/user/{id}(id=${user.id})}">Profile</a>
<!--사용자의 ID에 따라 동적인 링크를 생성-->

이 외에도 타임리프는 th:attr, th:replace, th:include, th:fragment 등 다양한 속성을 제공한다. 이들은 각각 HTML 엘리먼트의 속성을 동적으로 설정하거나, 외부 템플릿을 가져오거나, 템플릿 조각을 정의하는 데 사용된다.