SpringでWebアプリケーションを開発するにあたって
Thymeleafというテンプレートエンジンを使っています。
こちらについてまとめました。
1. Thymeleafについて
既に書きましたがSpringで主流のテンプレートエンジンです。
Laravelでいうbladeみたいなものです。
公式サイトでは日本語対応しています。やさしいですね。
2. コードを見てみる
<p th:text="${message}"></p>
<table border="1">
<tr>
<th>名前</th>
<th>年齢</th>
</tr>
<tr th:each="user : ${users}">
<td th:text="${user.id}"></td>
<td th:text="${user.name}"></td>
<td th:text="${user.age}"></td>
</tr>
</table>
HTMLでは見慣れない「th」や「"$~~~~"」などの記述がみられます。
これらはサーバから受け取ったデータを出力する場所になります。
${message}ではコントローラで以下のコードを動かすことで
model.addAttribute("message", "タイムリーフ");
このように表示されます!
このようにしてサーバからの情報を画面上に表示することができます。
そして実際の自社開発でもこのような方法で画面上にDB上から抽出した情報を表示しています。
なによりすっごく簡単です。
画面に情報を渡す、画面上に受け取った情報を表示する、
これらは上記にあるように書くだけで実装することができます。
Thymeleafに限った話ではありませんがテンプレートエンジンは偉大です。
Web開発の味方。
3. Thymeleafを使えるようにする
ここではWeb上でSpringプロジェクトを作る方法から進めます
Eclipceからでもプロジェクトを作成できるらしいですが自分で試したことが無いので割愛
↓にアクセスすると
↓のような画面が表示されます。
画面上左上の「ADD DEPENDENCIES」を押下
↓検索用の画面が表示されるので「Thymeleaf」と検索し、結果を押下する
↓そうするとこれから作られるSpringプロジェクトでThymeleafを使うとことができます!
4. もうちょい深堀してみる
Thymeleafの主な属性をまとめてみました!
(ちゃっかり個人的なメモの役割も果たしている)
属性名 | 詳細 |
---|---|
th:each | ループを作成してリストや配列の各要素を処理する |
th:if, th:unless | 条件に基づいて要素を表示または非表示にする |
th:object | フォームのバインディングオブジェクトを指定する |
th:text | 要素のテキストコンテンツを設定する |
th:src, th:href | 画像やリンクのソースやリンク先を設定する |
th:attr | HTML属性を設定する |
th:class, th:id | 要素のクラスやIDを動的に設定します |
th:style | 要素のスタイルを設定する |
↑の記事ですがタイトルにあるようにThymeleafの使い方が綺麗にまとめられています。
めっちゃ感謝です。これからの開発に重宝する予定です!!
5. 終わりに
テンプレートエンジンはWeb開発するにあたって必須(だよね!?)なのでしっかり身に付けようと思います。
6. 予告
次回の投稿は2月2日の予定です!
Googleでのログインについて書こうかな