How to Build Dynamic Web Pages with Spring Boot and Thymeleaf
This tutorial explains how to serve static resources, configure Thymeleaf as the template engine, and create a Spring Boot controller that renders HTML pages, including step‑by‑step code examples and configuration tips for customizing template locations and caching.
Static Resource Access
Spring Boot serves static resources from classpath directories that match one of the following names: /static, /public, /resources, /META-INF/resources. For example, placing an image in src/main/resources/static makes it accessible at http://localhost:8080/D.jpg.
Render Web Page
When using @RestController, responses are JSON. To render HTML, a traditional @Controller returning a view name is required.
Template Engine
Spring Boot auto‑configures several template engines, including Thymeleaf, FreeMarker, and Groovy. Templates are located by default in src/main/resources/templates, though this can be changed.
Note: Spring Boot recommends using a template engine and avoiding JSP.
Thymeleaf
Thymeleaf is an open‑source Java template engine for XML/XHTML/HTML5, suitable for both web and non‑web environments. It integrates with Spring MVC and allows developers to add attributes to HTML tags, which are ignored by browsers but processed by Thymeleaf.
<table>
<thead>
<tr>
<th th:text="#{msgs.headers.name}">Name</th>
<th th:text="#{msgs.headers.price}">Price</th>
</tr>
</thead>
<tbody>
<tr th:each="prod : ${allProducts}">
<td th:text="${prod.name}">Oranges</td>
<td th:text="${#numbers.formatDecimal(prod.price,1,2)}">0.99</td>
</tr>
</tbody>
</table>The above demonstrates how Thymeleaf binds data to HTML using attributes.
Hands‑On Example
Step 1: Add the Thymeleaf starter dependency to pom.xml:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>Step 2: Create a controller:
@Controller
public class HelloController {
@GetMapping("/")
public String index(ModelMap map) {
map.addAttribute("host", "http://blog.didispace.com");
return "index";
}
}This controller adds a host attribute and returns the view name index, which resolves to src/main/resources/templates/index.html.
Step 3: Create index.html with Thymeleaf syntax:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title></title>
</head>
<body>
<h1 th:text="${host}">Hello World</h1>
</body>
</html>The th:text attribute binds the host value to the h1 element.
Running the application and visiting http://localhost:8080/ displays the host URL defined in the controller.
Thymeleaf Configuration Parameters
Common properties can be set in application.properties to customize Thymeleaf behavior:
# Enable template caching.
spring.thymeleaf.cache=true
# Check that the templates location exists.
spring.thymeleaf.check-template-location=true
# Content-Type value.
spring.thymeleaf.content-type=text/html
# Enable MVC Thymeleaf view resolution.
spring.thymeleaf.enabled=true
# Template encoding.
spring.thymeleaf.encoding=UTF-8
# Template mode.
spring.thymeleaf.mode=HTML5
# Prefix for view names.
spring.thymeleaf.prefix=classpath:/templates/
# Suffix for view names.
spring.thymeleaf.suffix=.htmlTypical adjustments:
Set spring.thymeleaf.cache=false to disable caching during development.
Change spring.thymeleaf.prefix to use a custom template directory.
Modify spring.thymeleaf.suffix to use a different file extension.
Set spring.thymeleaf.mode=LEGACYHTML5 to relax HTML5 validation.
For more details, refer to the official Thymeleaf documentation.
Code Repository
Examples are available in the chapter4-1 directory of the following repositories:
GitHub: https://github.com/dyc87112/SpringBoot-Learning/
Gitee: https://gitee.com/didispace/SpringBoot-Learning/
Signed-in readers can open the original source through BestHub's protected redirect.
This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactand we will review it promptly.
Programmer DD
A tinkering programmer and author of "Spring Cloud Microservices in Action"
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.