Introduction | Conventions | Layouts | Blocks | Actions | Datasources | Translations | Forms Management | Best practices | Documentation

YAML Layout Description system

The YAML Layout Description System is a declarative approach to defining the layout and structure of web pages or application views.this system allows developers to define the placement and configuration of components, blocks, and other elements using YAML syntax. they can also add interaction with data sources, sending forms data etc...

Using of YAML format to describe layout.

The layout description is written in YAML (YAML Ain't Markup Language) format, known for its human-readable and intuitive structure. The YAML file represents a hierarchical structure that defines the relationships between components and their properties.

Core features.

• Defining the structure of the layout using blocks.
• Customizing block attributes and classes.
• Support form generation with validation and custom actions.
• Ability to include variables and configurations in the layout description.
• Support for internationalization.
• Defining data sources to get dynamic data.

Installation

(WIP)

Architecture

Our architecture is based on one main component :

• YLDS-SERVER : Detect import, handling missing dependencies, and updating app hooks useLayoutParser which provides all requirements needed by LayoutParser.vue in order to display layout defined in the config file. The process enables automatic import of new components defined in YAML without manual intervention.

Usage of pipes pattern

Pipes are used to extract each informations from Yaml file by chaining them together.

By using the pipe pattern, we can easily compose multiple operations or transformations together in a clean and readable way. It allows us to break down complex operations into smaller, reusable functions that can be combined together to achieve the desired result.

The pipe pattern simplifies the process of applying a series of transformations or operations to a value or object, making our code more modular and easier to understand.

More details about our architecture

Conventions

Find all conventions and notations used in YAML LAYOUT Description System.

More details about conventions

Best practices

Guidelines and recommendations. By following these best practices, we'll create well-structured, efficient, and robust layout.

More details about best practices

Documentation

Code source documentation.

See code documentation