Thymeleaf Tutorial: Chapter 1. Introduction
Table of contents
Thymeleaf is a modern Java template engine for web and standalone environments that can handle HTML, XML, JavaScript, CSS, and even plain text.
The main goal of Thymeleaf is to create an elegant and convenient way of templating. To achieve this, Thymeleaf relies on the concept of Natural Templates to embed its logic in template files so that this template does not affect the display of the prototype design. This improves communication in the team and reduces the gap between design and programmer groups.
Thymeleaf has also been designed from the beginning to web standards, especially HTML5 , which allows you to create fully compliant templates.
')
Out of the box, Thymeleaf allows you to work with six types of templates, each of which is called “Template Format / Template Mode”:
Total: two pharmacist markup (HTML and XML), three text formats (TEXT, JAVASCRIPT and CSS) and simple format (RAW).
HTML format refers to the HTML standard, including HTML5, HTML 4 and XHTML. Validation is not performed, and the code / structure of the original template will be followed as much as possible.
The XML template format allows you to create an XML template. In this case, it is expected that the code will be well-formed, otherwise, without closed tags, without attribute quotes and other things, the parser will generate exceptions. Please note that no DTD or XML schema check will be performed.
Template mode TEXT allows you to use special syntax for templates without markup. Examples of such templates can be text letters or template documents. Please note that HTML or XML templates can also be processed as TEXT, in which case the markup is not parsed, and each tag, DOCTYPE, comment, etc. will be treated as plain text.
JAVASCRIPT template mode allows you to process JavaScript files in the Thymeleaf application. This means that you can use model data inside JavaScript files in the same way that you can do it in HTML files, but with JavaScript-specific integrations, such as specialized escaping or scripting. The JAVASCRIPT template mode is considered a text mode and therefore uses the same special syntax as the TEXT template mode.
CSS Template mode allows you to process CSS files that are part of the Thymeleaf application. Like the JAVASCRIPT mode, the CSS template mode is also text mode and uses special processing syntax from the TEXT template mode.
RAW template mode simply will not process templates. It is designed to insert intact resources (files, responses to URLs, etc.) into processed templates. For example, external, uncontrolled HTML resources can be included in application templates, knowing that any Thymeleaf code that includes these resources will not be executed.
Thymeleaf is an extremely extensible mechanism (in fact, it can be called a template platform), which allows you to define and customize how your templates are processed to a fine level of detail.
An object that applies some logic to a markup artifact (tag, text, comment) is called a processor, and the set of these processors — plus perhaps some additional artifacts — is what the dialect consists of. Out of the box, the main Thymeleaf library provides a dialect called the standard dialect , which should be sufficient for most users.
This tutorial covers the standard dialect. Each attribute and syntax that you learn about on the following pages is determined by this dialect, even if it is not explicitly mentioned.
Of course, users can create their own dialects (even extending the standard one) if they want to define their own processing logic, taking advantage of the advanced functions of the library. Thymeleaf can also be configured to use multiple dialects simultaneously.
The official integration packages, thymeleaf-spring3 and thymeleaf-spring4, define a dialect called SpringStandard Dialect , which basically matches the standard dialect, but with small adaptations, to better use some of the Spring Framework functions (for example, Spring Expression Language ( SPEL) or SpringEL instead of OGNL). Therefore, if you are a Spring MVC user, you do not waste your time, since almost everything you learn here will be useful in your Spring applications.
Most standard dialect processors are attribute processors. This allows browsers to correctly display HTML templates even without processing, since they simply ignore the additional attributes. For example, while JSPs using tag libraries may include a snippet of code that cannot be displayed directly by the browser, for example:
... Thymeleaf Standard Dialect will allow us to achieve functionality with:
Not only will this be correctly displayed by browsers, but it also allows us (optionally) to specify the value attribute ("James Marrot") in it, which will be displayed when the prototype is statically opened in the browser and which will be replaced with the value obtained as a result $ {user.name} during template processing.
This helps your designer and developer work with the same template file and reduce the effort required to convert a static prototype into a working template file. The ability to do this is the Natural Templating feature.
Continued. Chapter 2. Good Thymes Virtual Grocery
1 Meet Thymeleaf
1.1 What is Thymeleaf?
Thymeleaf is a modern Java template engine for web and standalone environments that can handle HTML, XML, JavaScript, CSS, and even plain text.
The main goal of Thymeleaf is to create an elegant and convenient way of templating. To achieve this, Thymeleaf relies on the concept of Natural Templates to embed its logic in template files so that this template does not affect the display of the prototype design. This improves communication in the team and reduces the gap between design and programmer groups.
Thymeleaf has also been designed from the beginning to web standards, especially HTML5 , which allows you to create fully compliant templates.
')
1.2 What types of templates can Thymeleaf handle?
Out of the box, Thymeleaf allows you to work with six types of templates, each of which is called “Template Format / Template Mode”:
- HTML
- XML
- TEXT
- JAVASCRIPT
- CSS
- RAW
Total: two pharmacist markup (HTML and XML), three text formats (TEXT, JAVASCRIPT and CSS) and simple format (RAW).
HTML format refers to the HTML standard, including HTML5, HTML 4 and XHTML. Validation is not performed, and the code / structure of the original template will be followed as much as possible.
The XML template format allows you to create an XML template. In this case, it is expected that the code will be well-formed, otherwise, without closed tags, without attribute quotes and other things, the parser will generate exceptions. Please note that no DTD or XML schema check will be performed.
Template mode TEXT allows you to use special syntax for templates without markup. Examples of such templates can be text letters or template documents. Please note that HTML or XML templates can also be processed as TEXT, in which case the markup is not parsed, and each tag, DOCTYPE, comment, etc. will be treated as plain text.
JAVASCRIPT template mode allows you to process JavaScript files in the Thymeleaf application. This means that you can use model data inside JavaScript files in the same way that you can do it in HTML files, but with JavaScript-specific integrations, such as specialized escaping or scripting. The JAVASCRIPT template mode is considered a text mode and therefore uses the same special syntax as the TEXT template mode.
CSS Template mode allows you to process CSS files that are part of the Thymeleaf application. Like the JAVASCRIPT mode, the CSS template mode is also text mode and uses special processing syntax from the TEXT template mode.
RAW template mode simply will not process templates. It is designed to insert intact resources (files, responses to URLs, etc.) into processed templates. For example, external, uncontrolled HTML resources can be included in application templates, knowing that any Thymeleaf code that includes these resources will not be executed.
1.3 Dialects: Standard Dialect
Thymeleaf is an extremely extensible mechanism (in fact, it can be called a template platform), which allows you to define and customize how your templates are processed to a fine level of detail.
An object that applies some logic to a markup artifact (tag, text, comment) is called a processor, and the set of these processors — plus perhaps some additional artifacts — is what the dialect consists of. Out of the box, the main Thymeleaf library provides a dialect called the standard dialect , which should be sufficient for most users.
This tutorial covers the standard dialect. Each attribute and syntax that you learn about on the following pages is determined by this dialect, even if it is not explicitly mentioned.
Of course, users can create their own dialects (even extending the standard one) if they want to define their own processing logic, taking advantage of the advanced functions of the library. Thymeleaf can also be configured to use multiple dialects simultaneously.
The official integration packages, thymeleaf-spring3 and thymeleaf-spring4, define a dialect called SpringStandard Dialect , which basically matches the standard dialect, but with small adaptations, to better use some of the Spring Framework functions (for example, Spring Expression Language ( SPEL) or SpringEL instead of OGNL). Therefore, if you are a Spring MVC user, you do not waste your time, since almost everything you learn here will be useful in your Spring applications.
Most standard dialect processors are attribute processors. This allows browsers to correctly display HTML templates even without processing, since they simply ignore the additional attributes. For example, while JSPs using tag libraries may include a snippet of code that cannot be displayed directly by the browser, for example:
<form:inputText name="userName" value="${user.name}" /> ... Thymeleaf Standard Dialect will allow us to achieve functionality with:
<input type="text" name="userName" value="James Carrot" th:value="${user.name}" /> Not only will this be correctly displayed by browsers, but it also allows us (optionally) to specify the value attribute ("James Marrot") in it, which will be displayed when the prototype is statically opened in the browser and which will be replaced with the value obtained as a result $ {user.name} during template processing.
This helps your designer and developer work with the same template file and reduce the effort required to convert a static prototype into a working template file. The ability to do this is the Natural Templating feature.
Continued. Chapter 2. Good Thymes Virtual Grocery
Source: https://habr.com/ru/post/350864/
All Articles