Thymeleafとは？初心者がまず知るべき特徴まとめ
新人
「Thymeleafって最近よく聞くんですけど、どんなテンプレートエンジンなんでしょうか？」
先輩
「Thymeleafは、JavaのWebアプリで使うテンプレートエンジンで、HTMLに動的な値を埋め込みやすいのが特徴だよ。」
新人
「PleiadesのGradleで使えるんですか？」
先輩
「もちろん。PleiadesでGradleプロジェクトを作って@Controllerと一緒に使うのが標準的な方法だよ。」
1. Thymeleafとは？
ThymeleafはJavaでWebアプリケーションを構築するときに使われるテンプレートエンジンです。HTMLの中にth:textやth:eachなどの属性を追加することで、動的に値やリストを表示できます。Gradle＋Pleiadesの開発環境で、@Controllerを使う設定も簡単です。
テンプレートエンジンと言えばJSPやFreemarkerがありますが、Thymeleafは「ブラウザでHTMLをそのまま開いて見た目を確認できる」「直感的な属性記述が可能」といった点で初心者にも扱いやすいメリットがあります。
2. Thymeleafを使うメリット
2‑1. HTMLをそのまま使える
Thymeleafの記述はHTML構文を壊しません。デザイナーと共有しやすく、HTMLファイルをブラウザで開いても違和感なく確認できます。
2‑2. 動的な値や繰り返し処理が簡単
コントローラから渡されたModelの値を${}で簡単に表示できます。リストの繰り返し表示もth:each一行で実装できます。
2‑3. Springと相性抜群
Spring Bootのspring-boot-starter-thymeleafを追加すれば、PleiadesでGradleに依存関係を登録するだけで、すぐにテンプレート機能を使えます。@ControllerからModelへ値を渡して、HTMLにそのまま埋め込む流れがシンプルです。
2‑4. 国際化や文字コード対応にも優れる
国際化（多言語対応）がしやすく、messages.propertiesを使ったth:text="#{key}"による文字列翻訳もできます。UTF‑8出力に対応しており、日本語文字がきれいに表示されます。
2‑5. 保守性と見通しが良くなる
XML風の属性でロジックを直接管理するので、変数や条件分岐の構造がHTMLの中で整理しやすく、メンテナンス性にも優れています。
3. Thymeleafの基本的な構造（テンプレートと変数展開）
ThymeleafではHTMLファイルにth:textやth:eachなどの専用属性を追加して、動的な値やリストを展開します。まず、テンプレートとはHTMLの骨組みであり、そこにJava側から渡したデータを埋め込むイメージです。
3‑1. テンプレートとModelの連携
コントローラでModelに値を追加すると、テンプレート側では${}で参照できます。たとえば：
@Controller
public class SampleController {
@GetMapping("/greet")
public String greet(Model model) {
model.addAttribute("name", "太郎");
return "greet";
}
}
そして、テンプレート（greet.html）では：
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>あいさつ</title></head>
<body>
<p th:text="'こんにちは、' + ${name} + 'さん！'">こんにちは、ゲストさん！</p>
</body>
</html>
このように、Modelから渡したnameに「太郎」が入り、実際には「こんにちは、太郎さん！」と表示されます。
4. Thymeleafでできること（条件分岐、繰り返しなど）
Thymeleafには条件分岐や繰り返しなど、テンプレート制御に使える便利な機能があります。初心者でも簡単に使えるようになっているため、UI表示の工夫がしやすいです。
4‑1. 条件分岐（th:if／th:unless）
th:ifを使えば特定条件下で要素を表示できます。逆にth:unlessで条件を満たさないときに表示できます。
<p th:if="${loggedIn}">ログイン中です</p>
<p th:unless="${loggedIn}">ログインしてください</p>
4‑2. 繰り返し処理（th:each）
リストデータを表示したいときにはth:eachが便利です。
@Controller
public class ItemController {
@GetMapping("/items")
public String showItems(Model model) {
model.addAttribute("items", List.of("リンゴ", "バナナ", "イチゴ"));
return "items";
}
}
<ul>
<li th:each="item : ${items}" th:text="${item}">サンプル</li>
</ul>
これでリスト要素が3つ生成され、それぞれに果物名が表示されます。
4‑3. URLリンクやデータ属性（th:href／th:src）
画像やリンクのURLはth:hrefやth:srcで動的に指定できます。
<a th:href="@{/home}">ホームへ</a>
<img th:src="@{/images/logo.png}" alt="ロゴ画像" />
5. Pleiades＋GradleでThymeleafを使う環境構築の基本
Pleiadesで開発する場合、Gradle＋Spring Boot＋Thymeleafを組み合わせた環境は簡単に構築できます。ここではその手順を解説します。
5‑1. Gradleプロジェクト作成と依存関係設定
まずPleiadesで新規Gradleプロジェクトを作成し、build.gradleに以下を追加します：
dependencies {
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
implementation 'org.springframework.boot:spring-boot-starter-web'
}
Pleiadesのチェック機能で依存関係が自動認識され、Thymeleafが利用可能になります。
5‑2. application.properties設定
Thymeleafのテンプレート場所やキャッシュの設定を行います。
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.cache=false
これで、src/main/resources/templates/内のHTMLファイルがビューとして使われるようになります。
5‑3. サンプルコントローラの作成
最低限の動作確認用にコントローラを用意します：
@Controller
public class HelloController {
@GetMapping("/hello")
public String hello(Model model) {
model.addAttribute("greeting", "こんにちは、Thymeleaf！");
return "hello";
}
}
同じ名前のhello.htmlファイルをtemplatesに置けば、/helloにアクセスすることで動作確認ができます。
6. Thymeleafを使うときの注意点（バージョンや構文の違いなど）
Thymeleafを使い始めるとき、つまずきやすいポイントを整理しました。Pleiades＋Gradle環境で開発するときに注意すると良い点を紹介します。
6‑1. バージョンによる構文や仕様の違い
Thymeleafには3.0、3.1、4.xなどのバージョンがあり、th:insertやlayout:decorateのサポート範囲が異なることがあります。Gradleのbuild.gradleでimplementation 'org.thymeleaf:thymeleaf:3.1.0'のように明示しておくと、環境が安定します。
6‑2. 名前空間（xmlns）宣言の不備
テンプレートでThymeleaf属性やカスタム属性を使うには、HTMLルート要素で宣言が必要です。宣言を忘れるとPleiadesで警告が出るほか、正しく動作しなくなります。
<html xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
6‑3. キャッシュ設定の切り替え
開発中はテンプレート編集の反映をすぐに確認したいため、spring.thymeleaf.cache=falseにしておくのが便利です。デプロイ後はtrueに戻すことで、表示速度が改善されるケースが多いです。
6‑4. nullや存在しない値の取り扱い
Modelに値を渡していない場合、直接th:text="${value}"と書くとエラーになることがあります。?:演算子やth:ifを使って、デフォルトの表示や条件付き表示を活用しましょう。
<p th:text="${value ?: '未設定です'}">未設定です</p>
7. これからThymeleafを学ぶためのおすすめの方法
これからThymeleafを学ぶ人に向けて、効率的で初心者に優しい学習ステップを紹介します。
7‑1. 公式ドキュメント・チュートリアルを参照
まずThymeleaf公式の属性リファレンスやチュートリアルを確認しましょう。属性th:text、th:each、th:ifなどの使い方がひと通り学べます。
7‑2. 小さなWebアプリを作ってみる
Pleiades＋Gradleで「ToDoリスト」や「簡易掲示板」などを作成し、テンプレートにデータを表示・条件分岐・リスト展開などの機能を盛り込んでみましょう。実際に手を動かすことで理解が深まります。
7‑3. QiitaやStackOverflowで実際の使用例を調べる
「Thymeleaf Pleiades Gradle 環境構築」などで検索すれば、実務的な設定やトラブルシューティング記事が見つかります。エラー時の対応例をチェックするのも効果的です。
7‑4. GitHubからサンプルプロジェクトをcloneして実際に動かす
Spring Boot＋Thymeleafのサンプルアプリをcloneして、templatesフォルダの構造やコントローラとの連携方法を確認してみましょう。コピペではわからない構造も実際に動かすと見えてきます。
8. 実践的なサンプルコード例とまとめ
最後に、これまでの内容を踏まえた実践的なサンプルを紹介します。Pleiades＋Gradle＋Spring Boot環境でそのまま動く構成です。
8‑1. コントローラ（WelcomeController.java）
@Controller
public class WelcomeController {
@GetMapping("/welcome")
public String welcome(Model model) {
model.addAttribute("user", "花子");
model.addAttribute("tasks", List.of("洗濯", "掃除", "買い物"));
return "welcome";
}
}
8‑2. テンプレート（welcome.html）
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title th:text="'ようこそ、' + ${user} + 'さん'">ようこそ</title>
</head>
<body>
<h2 th:text="'こんにちは、' + ${user} + 'さん!'">こんにちは！</h2>
<ul>
<li th:each="task : ${tasks}" th:text="${task}">タスク</li>
</ul>
<p th:text="${tasks.size() > 0 ? '未完了タスク：' + ${tasks.size()} + '件' : 'タスクはありません'}">タスク情報</p>
</body>
</html>
この構成で/welcomeにアクセスすると、ユーザー名とタスク一覧が表示されます。条件分岐付きの件数表示も含まれており、実用的なテンプレート例として最適です。
この記事で学んだポイントを活かせば、Thymeleafの基本機能がしっかり身につき、テンプレート開発やHTML構成の理解が深まります。ぜひ実際に手を動かして、自分だけのWebアプリに挑戦してみてください！
この記事を読んだ人からの質問
