1. Thymeleaf
- 템플릿 엔진의 일종. html 태그에 속성을 추가해 페이지에 동적으로 값을 추가하거나 처리 가능
1) th: 속성
- th:OOO이 붙은 부분은 서버사이드에서 렌더링 되어 기존 내용을 대체 (th:OOO이 없으면 OOO 속성이 사용됨)
웹 브라우저는 th: 속성을 인식 못함
2. 템플릿 엔진
- 지정된 템플릿 양식과 데이터가 합쳐져 html 문서를 출력하는 소프트 웨어
1) 템플릿 엔진의 종류
1. 서버 템플릿 엔진
2. 클라이언트 템플릿 엔진
2) 템플릿 엔진의 장점
- 코드 리소스가 줄어듬
- 재사용성 향상
- 유지보수 용이
3) 서버 템플릿 엔진의 종류별 특징
- JSP : 스프링 부트에서 비권장
- Velocity : 스프링 부트에서 비권장
- Freemarker : 템플릿 엔진으로서 기능이 너무 다양함. 숙련도가 낮은 경우 비즈니스 로직이 추가 됨
- Thymeleaf : 스프링에서 권장. 문법이 어려움
- Mustache : 단순하고 서버, 클라이언트 모두 사용 가능
3. Thymeleaf 문법
대부분의 html 속성을 th:OOO 로 변경할 수 있다.
ex) th:text="${변수명}"
| 표현 | 설명 | 예제 |
| @{ ... } | URL 링크 표현식 | th:href="@{/css/bootstrap.min.css}" th:href="@{/{itemId}/edit(itemId=${item.id})}" |
| | ... | | 리터럴 대체 | th:text="|Hi ${user.name}!|" (= th:text="'Hi '+${user.name}+'!'" |
| ${ ... } | 변수 | th:text=${user.name} |
| th:each | 반복 출력 | <tr th:each="item: ${items}"> <td th:text="${item.price}">100</td> </tr> |
| *{ ... } | 선택 변수 | <tr th:object="${items}"> <td th:text="*{price}">100</td> </tr> |
| #{ ... } | 메시지. properties 같은 외부 자원에서 코드에 해당하는 문자열 get. | th:text="#{member.register}" |