Handlebars

Handlebars start

Handlebars is a simple templating language. It uses a template and an input object to generate HTML or other text formats. Handlebars templates look like regular text with embedded Handlebars expressions.

A handlebars expression is a {{, some contents, followed by a }}. When the template is executed, these expressions are replaced with values from an input object, e.g.

<p>{{firstname}} {{lastname}}</p>

We tried to make Dashly's developing process easier, so we integrated Handlebars to manage partials and variables passing by webpack and the site global config file.
All partial files are in dashly/theme/src/partials folder, like header and footer, modal views and navigations. Using partials you can re-use these html files anywhere in the code, you can even pass through parameters and create statements.

For example in the following piece of code we are rendering dir and data-navigation-color attributes based on our config file. We are also rendering a partial file into <head> and passing "Dashboard" title to it..

<html {{#if isRTL}}dir="rtl"{{/if}} data-navigation-color="{{navigationColor}}">
    <head>
        {{> layouts/head title="Dashboard"}}
    </head>

    ...
</html>