Thymeleaf ๋?
- Thymeleaf๋ ์๋ฒ ์ธก ์๋ฐ ์น ํ ํ๋ฆฟ ์์ง
- HTML, XML, JavaScript, CSS๋ฅผ ์ฒ๋ฆฌํ ์ ์๋ ์๋ฐ ํ ํ๋ฆฟ ์์ง
- ์ฃผ๋ก ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ์ฌ์ฉ์ ์ธํฐํ์ด์ค๋ฅผ ์์ฑ ํ๊ธฐ ์ํด ์ฌ์ฉ
Thymeleaf์ ๋ชฉํ
์ ์ง ๊ด๋ฆฌ๊ฐ ์ฌ์ด ํ ํ๋ฆฟ ์์ฑ ๋ฐฉ๋ฒ์ ์ ๊ณต
์ค์ ๋ก ํ ํ๋ฆฟ์ ์ํฅ์ ์ฃผ์ง ์๋
(HTML์ ๊ตฌ์กฐ๋ฅผ ๊นจ์ง ์๊ณ , ๊ธฐ์กด HTML ์ฝ๋๋ฅผ ๋ณ๊ฒฝํ์ง ์๊ณ ๋ง๋ถ์ด๋ ์ฝ๋) ๋ฐฉ์์ ์ฌ์ฉ
- Natural Templates ๊ฐ๋ ์ ๊ธฐ๋ฐ
- ์ด๋ฅผ ํตํ ๋์์ธ ํ๊ณผ ๊ฐ๋ฐ ํ๊ฐ์ ๊ฐ๋ฑ๊ณผ ๊ฒฉ์ฐจ ํด์๋ฅผ ๊ธฐ๋
Thymeleaf ์ฃผ์ ํน์ง
- ์์ฐ์ค๋ฌ์ด ๋ฌธ๋ฒ: Thymeleaf๋ HTML ๋ฌธ์์ ์์ฐ์ค๋ฝ๊ฒ ํตํฉ๋๋ ๋ฌธ๋ฒ์ ์ ๊ณต.
- ์ด๋ HTML์ ๊ทธ๋๋ก ์ ์งํ๋ฉด์ ํ ํ๋ฆฟ ์์ง์ ์ฌ์ฉํ ์ ์๋๋ก ํ๋ค.
- ํ ํ๋ฆฟ ์ฌ์ฌ์ฉ: ํ ํ๋ฆฟ์ ์ฌ์ฌ์ฉ์ด ๊ฐ๋จ, ํ๋ ๊ทธ๋จผํธ(fragment)๋ฅผ ์ฌ์ฉํ์ฌ ์ผ๋ถ ๊ตฌ์ฑ ์์๋ฅผ ๋ถ๋ฆฌํ๊ณ ์ฌ์ฌ์ฉํ ์ ์๋ค.
- ๋ค์ํ ์ปจํ
์คํธ ์ง์: Thymeleaf๋ ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๋ค์ํ ์ปจํ
์คํธ์์ ์ฌ์ฉ๋ ์ ์๋ค.
- ์๋ฅผ ๋ค์ด, ์น ์๋ฒ, ์คํ๋ง ํ๋ ์์ํฌ, ์คํ๋ง ๋ถํธ์ ๊ฐ์ ๋ค์ํ ํ๊ฒฝ์์ ์ฌ์ฉํ ์ ์์ต๋๋ค.
- ์๋ฒ ์ธก ๋ ๋๋ง: Thymeleaf๋ ์๋ฒ ์ธก์์ ๋ ๋๋ง๋๋ฏ๋ก, ํด๋ผ์ด์ธํธ ์ธก์์ ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์ฌ์ฉํ์ง ์๊ณ ๋ ์์ ํ ํ์ด์ง๋ฅผ ์์ฑ
- ํตํฉ ์ฉ์ด์ฑ: Thymeleaf๋ ๋ค์ํ ์๋ฐ ์น ํ๋ ์์ํฌ์์ ํตํฉ์ด ์ ๋์ด ์๋ค.
- ํนํ ์คํ๋ง๊ณผ์ ํตํฉ์ด ๊ฐ๋ ฅํ๋ฉฐ, ์คํ๋ง ๋ถํธ์์๋ ๊ธฐ๋ณธ ํ ํ๋ฆฟ ์์ง์ผ๋ก ์ฌ์ฉ
Thymeleaf ์ค์
- ์์กด์ฑ (Denpendency) ์ค์ - build.grad
dependencies {
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
}
Thymeleaf ๊ธฐ๋ณธ ํ
- ์์กด์ฑ (Denpendency) ์ค์ - build.grad
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Thymeleaf Example</title>
</head>
<body>
<h1 th:text="${message}">Hello, World!</h1>
</body>
</html>
- XML ๋ค์์คํ์ค์ ์ ์ธ โก๏ธ <html xmlns:th="http://www.thymeleaf.org">
Dialect - Standard Dialect
- Thymeleaf์ ํต์ฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ Standard Dialect๋ผ๋ dialect๋ฅผ ์ ๊ณต
ํ๋ก์ธ์ค๊ฐ ์๊ณ , ์ ์ฒด์ ์ผ๋ก ๋ค๋ฅธ ์ข ๋ฅ์ ์ํฐํฉ๋๋ค๋ก ๊ตฌ์ฑ ๋ ์ ์์ง๋ง, ํ๋ก์ธ์๋ ํ์คํ ๊ฐ์ฅ ์ผ๋ฐ์ ์ธ ์ฌ์ฉ ์ฌ๋ก
Standard Dialect์ ๋๋ถ๋ถ์ผ ํ๋ก์ธ์๋ 'Attribute Processor'์ด๋ค.
์ด๋ฅผ ํตํด ๋ธ๋ผ์ฐ์ ๋ ๋จ์ํ ์ถ๊ฐ ์์ฑ์ ๋ฌด์ํ๊ธฐ ๋๋ฌธ์ ์ฒ๋ฆฌ๋๊ธฐ ์ ์๋ HTML ํ ํ๋ฆฟ ํ์ผ์ ์ฌ๋ฐ๋ฅด๊ฒ ํ์
# JSP
<input type="text" name="userName" value="${user.name}">
# Thymeleaf Standard Dialect
<input type="text" name="userName" value="Gorany" th:value="${user.name}">
Template Engine์ ๊ตฌ์ฑ
Spring์ ์ฌ์ฉํ์๋ค๋ฉด XML๋๋ Java Config๋ก ViewResolver๋ฅผ ๋ค๋ค๋ณด์๋ ๊ฒฝํ์ด ์์ ๊ฒ์ด๋ค.
๊ทผ๋ฐ ์คํ๋ง ๋ถํธ๋ก ๋์ด์์ Thymeleaf๋ฅผ ์ธ ๋, ViewResolver๋ฅผ ์ค์ ํ ์ ์ด ์๋๋ฐ resources/template ๋ฐ์ HTML ํ์ผ์ ๋ฃ์ด๋๋ฉด Controller์์ ํฌ์๋ฉ์ ํด์ค๋ค.
Template Engine์ ๋ฉค๋ฒ๋ก ๊ฐ๋ ์ดํ๋ฆฌ์ผ์ด์ ์ด ์ด๊ธฐํ(์์ฑ)๋ ๋, ServletContextTemplateResolver ๊ฐ์ฒด๊ฐ ์์ฑ๋๋ฉฐ, ์ด templateResolver์ prefix(์ ๋์ฌ)์ suffix(์ ๋ฏธ์ฌ)๋ฅผ ์ค์ ํ๊ณ , Template Engine ๊ฐ์ฒด๋ฅผ ์์ฑํด ์์ง์ ํ ํ๋ฆฟ ๋ฆฌ์กธ๋ฒ๋ฅผ ๊ฝ์์ฃผ๋ ์์ด๋ค.
์ฝ๋๋ฅผ ๋ค์ฌ๋ค๋ณด๋ฉด ๋์ถฉ ๋ค์๊ณผ ๊ฐ๋ค. (WEB-INF == resources)
public class GTVGApplication {
...
private final TemplateEngine templateEngine;
...
public GTVGApplication(final ServletContext servletContext) {
super();
ServletContextTemplateResolver templateResolver =
new ServletContextTemplateResolver(servletContext);
// HTML is the default mode, but we set it anyway for better understanding of code
templateResolver.setTemplateMode(TemplateMode.HTML);
// This will convert "home" to "/WEB-INF/templates/home.html"
templateResolver.setPrefix("/WEB-INF/templates/");
templateResolver.setSuffix(".html");
// Template cache TTL=1h. If not set, entries would be cached until expelled
templateResolver.setCacheTTLMs(Long.valueOf(3600000L));
// Cache is set to true by default. Set to false if you want templates to
// be automatically updated when modified.
templateResolver.setCacheable(true);
this.templateEngine = new TemplateEngine();
this.templateEngine.setTemplateResolver(templateResolver);
...
}
}
'๐ฟSpring > Spring Framework' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
| [Spring Framework] Spring Boot 2.* vs 3.* (0) | 2024.06.11 |
|---|---|
| [Spring Framework] Spring Boot์ ์์ ํ๋ก์ธ์ค (0) | 2024.05.13 |
| [Spring Framework - Thymeleaf] Decoupled Logic (0) | 2024.01.21 |
| [Spring Framework] Transction (1) | 2024.01.11 |
| [Spring Framework] Filter ์ Interceptor (1) | 2024.01.11 |
