m_shige1979のときどきITブログ

プログラムの勉強をしながら学習したことや経験したことをぼそぼそと書いていきます

Github(変なおっさんの顔でるので気をつけてね)

https://github.com/mshige1979

JavaのSpring bootでthymeleafを使用する

直接HTMLを記載するわけにはいかない

いろいろなフレームワークではテンプレートを使用する

環境

Mac mini
Spring Boot 1.4.x
Java 8

Maven設定

	<dependencies>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
	</dependencies>

※「spring-boot-starter-thymeleaf」を追加

ソース設定

HelloController.java
package com.example;

import java.util.Date;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class HelloController {
	
	@RequestMapping("/")
	public String index(Model model) {
		// 日時を取得、設定
		model.addAttribute("now", new Date().toString());
		// テンプレートを指定
		return "index";
	}
	
	@RequestMapping("/test1")
	public String test1Index(Model model) {
		// テンプレートを指定
		return "test1/index";
	}
	
}

※@RestControllerではテンプレートを使用しないので@Controllerに変更する
※アクションメソッドにModelを指定することで画面へ反映するオブジェクトを設定できる
※returnにはテンプレートのパスを設定する

テンプレート設定

src/main/resources/templates/index.html
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Spring Sample Demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
	<h1>Spring Sample</h1>
	<div>
    	Spring Sample Test
	</div>
	<p>Now <span th:text="${now}"></span></p>
	<p>
		<a href="test1/">test1</a>
	</p>
</body>
</html>
src/main/resources/templates/test1/index.html
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Spring Sample Demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
	<h1>Spring Sample Test1/index</h1>
	<div>
    	Spring Sample Test Test1/index
	</div>
</body>
</html>

結果

f:id:m_shige1979:20161122074419p:plain
f:id:m_shige1979:20161122074427p:plain

所感

WebアプリケーションフレームワークではHTMLをたくさん書くことになるのでテンプレートを使用するのは必須となる。
MVCとして使うことになると思うのでDBを実際に使用してTODOアプリもどきを作成できるように考えておく。