読者です 読者をやめる 読者になる 読者になる

m_shige1979のささやかな抵抗と欲望の日々

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

なんとなく作ったサイト

http://www.it-check-matome.info/


Github(注意すること)

https://github.com/mshige1979

JavaのSpring bootでthymeleafを使用する

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アプリもどきを作成できるように考えておく。

広告を非表示にする