복잡한뇌구조마냥

[JAVA] Thymeleaf 기초 정리 본문

BE/JAVA

[JAVA] Thymeleaf 기초 정리

지금해냥 2025. 8. 20. 11:02

1. Thymeleaf란?

  • 자바 기반 서버 사이드 템플릿 엔진
  • HTML 안에 변수를 바인딩하거나 조건문, 반복문 등을 지원
  • JSP와 달리 HTML을 그대로 열어도 깨지지 않는다는 장점 (순수 HTML 친화적)
  • Spring Boot에서는 spring-boot-starter-thymeleaf 의존성으로 쉽게 연동 가능

2. 의존성 추가 (Gradle)

dependencies {
    implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
    implementation 'org.springframework.boot:spring-boot-starter-web'
}

3. 기본 사용법

(1) Controller

 
@Controller
public class HelloController {
    @GetMapping("/hello")
    public String hello(Model model) {
        model.addAttribute("name", "홍길동");
        return "hello"; // → templates/hello.html
    }
}

(2) Thymeleaf 템플릿 (src/main/resources/templates/hello.html)

 
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Hello</title>
</head>
<body>
  <h1 th:text="'안녕하세요, ' + ${name} + '님!'">안녕하세요</h1>
</body>
</html>

👉 결과: 안녕하세요, 홍길동님!


4. 표현식 (Expression)

문법 설명
${...} 변수 표현식 (Model 값 출력)
*{...} 선택 변수 표현식 (폼 바인딩)
#{...} 메시지 표현식 (i18n)
@{...} 링크(URL) 표현식

5. 속성 변경

<a th:href="@{/articles/{id}(id=${article.id})}">상세보기</a>
<img th:src="@{/images/logo.png}" />
<input type="text" th:value="${user.name}" />
 

6. 조건문 & 반복문

조건문

 
<p th:if="${user.admin}">관리자 계정</p>
<p th:unless="${user.admin}">일반 사용자</p>

반복문

 
<ul>
  <li th:each="item : ${items}" th:text="${item}"></li>
</ul>

 


7. 템플릿 조각 (Fragment)

layout.html

 
<html xmlns:th="http://www.thymeleaf.org">
<body>
  <header th:fragment="header">공통 헤더</header>
  <div th:fragment="content">메인 콘텐츠</div>
  <footer th:fragment="footer">공통 푸터</footer>
</body>
</html>

home.html

 
<html xmlns:th="http://www.thymeleaf.org" th:replace="layout :: content">
<div>
  <h1>홈 화면</h1>
</div>
</html>

 


8. 폼 처리

Controller

 
@GetMapping("/form")
public String form(Model model) {
    model.addAttribute("member", new Member());
    return "form";
}

form.html

 
<form th:action="@{/form}" th:object="${member}" method="post">
    <input type="text" th:field="*{name}" placeholder="이름" />
    <button type="submit">저장</button>
</form>
  • th:object : Model 바인딩 객체
  • th:field : 해당 객체의 프로퍼티와 매핑

9. Thymeleaf vs JSP

구분 Thymeleaf JSP
HTML 호환성 브라우저에서 바로 열림 태그 깨짐
Spring Boot 지원 starter 의존성 기본 제공 별도 설정 필요
표현식 ${...}, th:* 속성 <%= %> 스크립트릿
유지보수성 HTML 친화적, 깔끔 자바 코드 섞이면 가독성 저하

10. 마무리

  • Thymeleaf는 Spring Boot 표준 뷰 템플릿으로 가장 널리 사용됨
  • JSP보다 현대적인 방식이며, HTML 친화적
  • 기본 문법(th:text, th:each, th:if, th:href)만 알아도 실무에서 충분히 활용 가능
LIST