templite

Lightweight, minimalist Javascript templating

templite

Templite aims to be a very small and lightweight, javascript template rendering engine. It can be used standalone, in node, bower or with ender.

# With npm 
npm install templite
 
# With bower 
bower install templite
 
# With ender 
ender add templite
templite.render( string, object );

This format parses properties directly from the root data object. Note the leading dot notation.

<h1>{{.name}}</h1>
<h2>{{.stats.kickflips}}</h2>
templite.render( html, {
    name: "kitajchuk",
    stats: {
        kickflips: 37
    }
});

This format uses the mustache style hash syntax for iteration and/or defined or not null.

{{#dude}}
    <h3>{{name}}</h3>
    <h4>{{age}}</h4>
    
    {{#stats}}
    <p>{{power}}</p>
    <p>{{transport}}</p>
    {{/stats}}
{{/dude}}
templite.render( html, {
    dude: {
        age: 27,
        name: "kitajchuk",
        stats: {
            power: null,
            transport: "skateboard"
        }
    }
});

If a tag represents a function, it will be called.

<h1>{{.pi}}</h1>
templite.render( html, {
    pifunction () {
        return Math.PI;
    }
});

This format allows using a single {{.}} tag to print the current array index.

<!-- Print current array index if string -->
{{#dudes}}
    <li>{{.}}</li>
{{/dudes}}
 
<!-- Print prop of current array index if object -->
{{#folks}}
    <li>{{name}}</li>
{{/folks}}
templite.render( html, {
    dudes: [
        "Him",
        "You",
        "Me"
    ],
    
    folks: [
        {name: "Scott"},
        {name: "Todd"},
        {name: "Neil"}
    ]
});
# Render the template 
node test/test.js
 
# Test with Grunt 
grunt nodeunit
# Start the node server 
node server/server.js

You should be able to go here localhost:5050