Template Engine

SUI Template Engine, a new feature in Yao v0.10.4, is AI-friendly and streamlines web page creation and data integration. It supports backward compatibility, enabling developers to use HTML, CSS, and TypeScript/JavaScript while promoting code reusability with a component-based architecture.

Note: SUI is a new feature and still experimental. For advanced frontend requirements, consider using frameworks like React or Vue. Place the built files in the public directory and connect them to Yao via REST API.

👉 Template Engine Reference

Section	Description
Overview	An introduction to the Template Engine and its purpose.
Template	Introduction to the SUI template for defining the structure of a web page.
Document	Defining a new SUI document for displaying content.
Assets	Managing assets like images, CSS, and JavaScript files.
Global Data	Managing global data for SUI templates.
Page	Introduction to the SUI page for defining the layout of a web page.
Template Syntax	The syntax for writing SUI templates. Variables, expressions, loops, conditions, and more.
Page as a Component	Using components to build reusable UI elements.
Component Communication	Communicating between components in SUI templates.
Partial Rendering	Rendering a part of the SUI template instead of the whole page.
Libsui	The fontend library for rendering SUI templates.
Event Handling	Handling events in SUI templates.
Backend Script	Writing backend scripts for data integration.
SUI Request	Making requests to the backend for data retrieval.
Cache Control	Managing cache for SUI templates.
I18n	Internationalization and localization for SUI templates.
TailwindCSS Integration	Integrating Tailwind CSS for styling SUI templates.

Table of Contents