Templating
Contents
Templates engines may be used to simplify output generation from controllers.
Introduction
Enonic XP does ship with a standard templating engine, but supports use of 3rd party engines. In this section we give examples of how you may use templating engines with your controllers.
A range of integrated templating engines are available as libraries on Enonic Market. |
React / JSX
Enonic offers a solution for server-side rendering with JSX React templates. Details are available in a separate tutorial called React4XP.
Thymeleaf
Here we will demonstrate templating using the Thymeleaf templating engine. Thymeleaf is available as an Enonic library.
For a more extensive tutorial using Thymeleaf, visit the My first site tutorial |
Start by including the library in your app:
dependencies {
include 'com.enonic.lib:lib-thymeleaf:<version>'
}
Replace <version> with the version of the library you want to use. |
Add a template file to your project:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>My first page, with a view!</h1>
<h2>Hello <span data-th-text="${name}">World</span></h2>
</body>
</html>
Your controller must then be updated to use the template:
var thymeleaf = require('/lib/thymeleaf');
exports.get = function(req) {
// Resolve the view
var view = resolve('/view/my-template.html');
// Define a model
var model = {
name: "John Doe"
};
// Render a thymeleaf template
var body = thymeleaf.render(view, model);
// Return the result
return {
body: body,
contentType: 'text/html'
};
};
Unlike some controller files, templates may reside anywhere within the src/main/resources
structure of your project.
If the view file is in the same folder as your controller, it can be resolved with only the file name resolve('my-template.html')
. Otherwise, the full or relative path should be used.