타임리프 사용 선언
<html xmlns:th="http://www.thymeleaf.org">속성 변경 - th:href
<href="value1" th:href="value2">타임리프 뷰 템플릿을 거치게 되면 원래 value1을 value2로 변경한다.
HTML파일을 그대로 열 경우는 value1이 나오고, 뷰 템플릿을 거치면 value2로 대체되면서 동적으로 변경할 수 있다.
타임리프의 핵심은 th:xxx이다.
뷰 템플릿을 거칠 때 th:xxx가 붙은 부분은 서버사이드에서 렌더링 되고, th:xxx가 없으면 기존 html의 xxx속성이 사용된다.
URL 링크 표현식 - @{...}
th:href="@{/css/bootstrap.min.css}"URL링크를 사용하는 경우 @{...}를 사용한다. 이것을 URL 링크 표현식이라 한다.
속성 변경 - th:onclick
- 기존 html :
- thymeleaf : th:onclick="|location.href='@{/basic/items/add}'|"
반복 출력 - th:each
<tr th:each="item : ${items}">모델에 포함된 items 컬렉션 데이터가 item 변수에 하나씩 포함되고, 반복문 안에서 item 변수를 사용할 수 있다.
변수 표현식 - ${...}
<td th:text="${item.price}">10000</td>item의 price에 접근하는 방법이다.
만약 값이 없거나, html파일로 연다면 10000으로 나오게 된다.
속성 변경 - th:action
HTML form에서 action에 값이 없을 경우 현재 URL에 데이터를 전송한다 (POST)
<form action="item.html" th:action method="post">JSP의 경우 HTML 파일 형태가 유지되지 않아 HTML로 여는 것이 불가능하다. 그러나 타임리프는 HTML 폼이 깨지지 않으면서 이루어지기 때문에 HTML파일로도 열 수가 있다.
이렇게 순수 HTML을 그대로 유지하면서 뷰 템플릿도 사용할 수 있는 타임리프의 특징을 네츄럴 템플릿 (natural templates)이라 한다.
'스프링 MVC 1편 - 백엔드 웹 개발 핵심 기술' - 김영한 강사님 의 강의 내용을 정리한 것 입니다.
백엔드 개발자