banner

ブログ

Jun 06, 2023

Thymeleaf とは何ですか? Spring Boot アプリケーションでどのように使用できますか?

このテンプレート エンジンを Spring アプリケーションに統合する方法を学びます。

Thymeleaf は Java テンプレート エンジンです。 Web アプリケーションとスタンドアロン アプリケーションの両方のテンプレートを開発します。 このテンプレート エンジンは、Natural Templates の概念を使用して、デザインを損なうことなくロジックをレイアウトに挿入します。 Thymeleaf を使用すると、作成したテンプレートをアプリケーションがどのように処理するかを制御できます。

Thymeleaf を使用して、HTML、XML、テキスト、JavaScript、CSS、RAW の 6 種類のテンプレートを処理できます。 Thymeleaf は各テンプレートをテンプレート モードと呼び、HTML はこのエンジンで作成された最も一般的なテンプレートです。

Thymeleaf を Spring Boot アプリケーションに追加するには 2 つの方法があります。 Spring のInitializr ツールを使用してボイラープレートを生成するときに、Thymeleaf を依存関係として選択できます。 後でビルド仕様ファイルの依存関係セクションに追加するオプションもあります。

Gradle プロジェクト オプションのいずれかを選択した場合、依存関係を含むファイルはbuild.gradleファイル。 ただし、Maven を選択した場合、そのファイルはpom.xml

あなたのpom.xmlファイルには次の依存関係セクションが含まれている必要があります。

あなたがbuild.gradleファイルには次の依存関係セクションが含まれている必要があります。

この記事で使用されているサンプル アプリケーションは、この GitHub リポジトリで入手でき、MIT ライセンスに基づいて無料で使用できます。

Thymeleaf を Spring アプリケーションに追加すると、そのコア ライブラリにアクセスできるようになり、Thymeleaf の Spring 標準方言を使用できるようになります。 Spring Standard Dialect には、レイアウトにさまざまな機能を追加するために使用できる固有の属性と構文が含まれています。

Spring アプリケーションで Thymeleaf を使用する場合、最初のステップはテンプレート ドキュメントを作成することです。 このサンプル アプリケーションのテンプレート ドキュメントは HTML です。 Thymeleaf テンプレートは常に Spring Boot で作成する必要があります。テンプレートフォルダーにあり、リソース ファイルで利用できます。

上記の Thymeleaf テンプレートは、1 つの外部属性 (xmlns:th )。 の目的xmlns:th属性は、すべてのスコープを提供することです。番目:*この HTML ドキュメントで使用する属性。 Thymeleaf テンプレート内の他の属性とタグは、従来の HTML タグと属性です。

Web サイトやアプリケーションの最初の最も重要な要素の 1 つはヘッダーです。 これは、アプリケーションの内容を (ロゴを通じて) 示し、アプリケーションを簡単にナビゲートするのに役立ちます。 基本的なヘッダーにはロゴといくつかのナビゲーション リンクが必要です。

Thymeleaf を使用すると、上記のヘッダーを Web アプリケーションの任意のページに追加できます。th:挿入属性。 のth:挿入そしてth:置き換える属性は、Thymeleaf がフラグメント式の値と呼ぶものを受け入れます。 フラグメント式を使用すると、マークアップのフラグメントをレイアウト内の任意の場所に配置できます。

上記のマークアップを先頭に挿入します。ホーム.html<本文>タグは、ホームページの上部にヘッダー マークアップを挿入します。 フラグメント式にはいくつかのコンポーネントがあり、2 つはオプションで、2 つは必須です。

したがって、次のマークアップは上記と同じ結果を生成します。

Thymeleaf では、テンプレートで 5 種類の式を使用できます。

メッセージ式を使用すると、外部化されたテキストの断片をレイアウトに追加できます。 メッセージ式を使用すると、レイアウト内のテキストを簡単に置き換えたり再利用したりできます。 メッセージ式を使用するときは、外部テキストのフラグメントを常に。プロパティ配下のファイルリソースフォルダ。

このサンプル アプリケーションの場合、そのファイルは次のとおりです。メッセージ.プロパティには、次のテキストの断片が含まれています。

上記のテキスト (またはメッセージ) の断片には一意​​のキー (/strong of your HTML file will allow you to style your template using a strongstyle.css/strong file. This file is available in a strongcss/strong folder under the strongstatic/strong section of the strongresources/strong file of the sample application. You should always assign the link URL expression to the strongth:href/strong attribute./p>/strong>/strong>

共有