의존성 추가

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

application.properties 수정

템플릿 시작 위치 참조
템플릿 확장자 이름 참조
해당 위치에 파일 유무를 체크
캐시를 남기지 않아 서버 재시작을 해도 바로 반영됨.

spring.thymeleaf.prefix=classpath:templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.check-template-location=true
spring.thymeleaf.cache=false

th 태그 정의

html xmlns 태그 추가

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	searchUser Page
	<a href="javascript:getUserList();">click me</a>
</body>
</html>

th each

for문과 유사하게 작동된다.

<table id="userTable">
	<thead>
		<tr>
			<th>No</th>
			<th>Email</th>
			<th>Name</th>
			<th>CreateDate</th>
		</tr>
	</thead>
	<tbody>
		<tr th:each="user : ${userList}">
			<td th:text="${userStat.count}"></td>
			<td th:text="${user.email}"></td>
			<td th:text="${user.name}"></td>
			<td th:text="${user.createStamp}"></td>
		</tr>
	</tbody>
</table>

또한, userStat 이라는 변수를 주어서 다음과 같은 필드를 사용할 수 있다.

userStat .index : 0부터 시작하는 index.
userStat .count : 1부터 시작하는 index.
userStat .size : 리스트의 사이즈
userStat .current : 현재 index의 변수
userStat .event : 짝수 여부 (iterStat.odd : 홀수 여부)
userStat .first : 처음 여부 (iterStat.last : 마지막 여부)

th object

<form action="#" th:action="@{/user/saveUserAction}" th:object="${user}" method="post" class="register">
	<div>
		<label for="email">이메일</label>
		<input type="text" th:field="*{email}" placeholder="test@naver.com" maxlength="20"/>
	</div>
</form>

*{...} 를 써서 th:object에 선언된 객체의 필드를 쓸 수 있다.

message.properties 내 변수

message.properties에 정의된 변수를 보여줄 수 있다. [참고 URL][ https://victorydntmd.tistory.com/340]

URL 표현

URL을 표현할 때 쓰는 표현식

<!-- Page-relative URL. 일반적인 상대 경로 URL  -->
<a href="login.html" th:href="@{user/login.html}">login</a>

<!-- Context-relative URL. context name이 URL 앞에 자동으로 붙어서 생성된다. -->
<a href="login.html" th:href="@{/login.html}">login</a>

<!-- Server-relative URL. 서버의 다른 context에 접근할 수 있다. -->
<a href="login.html" th:href="@{~/other/login.html}">login</a>

<!-- Protocol-relative URL. -->
<a href="login.html" th:href="@{//www.other.com/login.html}">login</a>

<!-- '/gtvg/order/details?orderId=3'을 생성. URL 파라메터로 사용됨. -->
<a href="details.html" th:href="@{/order/details(orderId=${o.id})}">view</a>

<!-- '/gtvg/order/3/details'를 생성. orderId를 local변수로 사용하여 URL path를 생성. -->
<a href="details.html" th:href="@{/order/{orderId}/details(orderId=${o.id})}">view</a>

th text

화면에 값을 출력할 때 사용한다. 문자를 결합도 가능하다.

<span> th:text="'Welcome to our app, ' + ${user.name} + '!'|"></span>
<span> th:text="|Welcome to our app, ${user.name}!|"></span>

th field

form 태그의 th:object로 지정한 객체와 같이 매핑되어 컨트롤러에서 @ResponseBody로 객체로 받을 떄 사용할 수 있다.

th if

조건문처럼 사용한다.

<div th:if="${false}">
	<p>에러 발생</p>
</div>

th errors