Thymeleaf is a popular server-side template engine for both web and standalone Java applications. It was developed to process different kinds of files like HTML, XML, JavaScript, CSS, and plain-text.
The biggest advantage of using Thymeleaf is that it brings natural templates to your development workflow — HTML templates that can be directly opened in browsers and still render correctly as web pages. This offers great flexibility to quickly develop static prototypes without wasting time on creating a backend server.
Thymeleaf makes the whole development process very easy and rapid when compared with other notable template engines such as JavaServer Pages (JSP). In this article, you'll learn how to use the Thymeleaf template engine with Spring Boot to serve dynamic web content.
Dependencies
Spring Boot provides excellent support for the Thymeleaf template engine, making the whole integration process very simple and straightforward. All you need to do is just include Spring Boot starter for Thymeleaf to your application dependencies. Spring Boot will auto-configure everything you need to use the Thymeleaf engine. To activate Spring Boot web support, make sure to include the Spring Boot Web starter dependency (spring-boot-starter-web) as well.
For a Gradle project, include the following dependencies to your build.gradle file:
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
implementation 'org.springframework.boot:spring-boot-starter-web'
For Maven, add the below dependencies to pom.xml file:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
If you are starting from scratch, just use Spring Initializr web tool or Spring Boot CLI to quickly bootstrap a new Spring Boot project with the above dependencies.
Thymeleaf Templates
Thymeleaf templates are just HTML static files (.html extension) that works both in browsers and web applications. By default, these templates are stored in src/main/resources/templates/ folder. Spring Boot automatically picks and renders these HTML files when required.
Let us create our first Thymeleaf template called index.htmland place it into the src/main/resources/templates folder:
index.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Spring Boot Thymeleaf Web Application</title>
</head>
<body>
<h1>Welcome to Spring Boot Thymeleaf</h1>
<p>
Hey there! <th:block th:text="${message}">message</th:block>
</p>
</body>
</html>
Thymeleaf engine will parse the above index.html file, evaluates th:text expression and replaces ${message} with its actual value provided by the Spring Boot web controller class.
Spring Boot Controller
Let us now define a Spring Boot controller class named IndexController.java that handles all HTTP GET requests on / endpoint and returns the name of the view that needs to be rendered as a response:
IndexController.java
package com.attacomsian.getstarted.controllers;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class IndexController {
@GetMapping("/")
public String index(Model model) {
// add `message` attribute
model.addAttribute("message", "Thank you for visiting.");
// return view name
return "index";
}
}
As you can see above, we have defined a simple Spring controller that accepts only GET requests on the / endpoint. The @Controller annotation indicates that the annotated class is a "Controller" (e.g. a web controller).
The @GetMapping annotation is used for mapping HTTP GET requests onto a specific controller method. In the above example, it maps the / endpoint onto the index() method. Model is a special interface that is used to share data between controllers and views in Spring Boot. We have added the message attribute to the Model object that we need in our view template — index.html file.
The index() method returns the name of the view template as a string. Thymeleaf will search for this template in the default folder (src/main/resources/templates/) and render it.
Running & Testing the Application
Finally, let us create the Spring Boot main application to launch the project:
Application.java
package com.attacomsian.getstarted;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class Application {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
}
To run the application, execute the following command in your terminal from the root directory of the project:
$ ./gradlew bootRun
If you use Maven, run the following command:
./mvnw spring-boot:run
Once the application is started, open http://localhost:8080/ in a web browser to see the output. Here is how it looks like:
Changing Thymeleaf Default Properties
Spring Boot provides a default configuration for the Thymeleaf template engine. To override the default properties values, you can define properties in application.properties or application.yml configuration file.
Change Templates Folder Location
To change the default folder location for HTML templates, you need to override the following property:
# change location from `templates` to `views`
spring.thymeleaf.prefix=classpath:/views/
Disable Templates Caching
By default, Spring Boot caches Thymeleaf templates to improve the performance. If you want templates to be automatically updated when modified, override the following property (not recommended in production):
spring.thymeleaf.cache=false
Check out the official documentation to view all templating configuration properties.
Source Code: Download the complete source code from GitHub available under MIT license.
Conclusion
That's all folks! In this article, we learned how to create a Spring Boot web application with Thymeleaf. Thymeleaf is a modern server-side Java template engine that introduced the concept of natural templates.
Natural templates are just HTML static files written in Thymeleaf but still look and work like HTML. These templates can be correctly rendered in web browsers and can also work in Java web applications. This makes it easier to quickly create static prototypes without the backend server.
Spring Boot provides a starter package to auto-configure the Thymeleaf template engine in a web application. You don't need to do anything except if you want to override the default configuration properties.
✌️ Like this article? Follow @attacomsian on Twitter. You can also follow me on LinkedIn and DEV. Subscribe to RSS Feed.
👋 If you enjoy reading my articles and want to support me to continue creating free tutorials, ☕ Buy me a coffee (cost $5) .
Need help to launch a new product? I am available for contract work. Hire me to accomplish your business goals with engineering and design.