Spring Boot Templating in Baby Steps 🚀

Learn how to connect Java with HTML using Thymeleaf in the simplest way possible.

What is templating?

Templating means Java sends data and HTML displays it dynamically.

Controller → Model → Template → Browser

implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'

src/main/resources/templates/index.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
  <h1>Hello Template</h1>
</body>
</html>

@Controller
public class PageController {

  @GetMapping("/")
  public String home() {
    return "index";
  }
}

model.addAttribute("name","Champak");

<h1>Hello <span th:text="${name}">User</span></h1>

@GetMapping("/hello")
public String hello(@RequestParam String name, Model model){
  model.addAttribute("name",name);
  return "hello";
}

<li th:each="t : ${topics}" th:text="${t}"></li>

<p th:if="${name=='Champak'}">Welcome!</p>

<div th:replace="fragments/header :: header"></div>

src/main/resources/static/css/style.css

<link rel="stylesheet" th:href="@{/css/style.css}">

@Controller → HTML page
@RestController → API/data

Do not map two controllers to the same URL like /.

Controller → Model → Template → Browser