Thymeleaf作為模板引擎,可以輕鬆地創建基於伺服器的動態網頁。本文將帶您一步一步實現一個簡單的Spring Boot Web應用,並使用Thymeleaf作為模板引擎來顯示網頁。
首先,需要創建一個新的Spring Boot專案。可以使用 Spring Initializr 來生成基礎專案。
選擇以下配置:
如果使用Maven,確保pom.xml中已經包含Thymeleaf的依賴:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
再來建立簡單的web應用
創建一個HomeController.java控制器:
@Controller
public class HomeController {
@GetMapping("/")
public String home(Model model) {
model.addAttribute("message", "Hello, Thymeleaf!");
return "home"; // 返回模板名稱
}
}
在這個控制器中,我們使用@Controller註解來標記它,並使用@GetMapping定義根路徑的請求
創建一個home.html模板文件:
<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
<title>示例網頁</title>
<meta charset="UTF-8" />
</head>
<body>
<h1>歡迎使用Thymeleaf</h1>
<p th:text="${message}">這是顯示的信息。</p>
</body>
</html>
在這個HTML文件中,我們使用th:text屬性來將模型中的message屬性值顯示在網頁上
應用程序類:
package com.example.demo;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class DemoApplication {
public static void main(String[] args) {
SpringApplication.run(DemoApplication.class, args);
}
}
如果想要更美觀一些,可以在src/main/resources/static/css目錄中創建一個CSS文件
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
}
h1 {
color: #007bff;
}
然後在home.html中引用:
<head>
<title>示例網頁</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" th:href="@{/css/styles.css}" />
</head>
Thymeleaf與Spring Boot的整合使得開發動態網站變得直觀易行,這使得它成為Java中非常流行的選擇