Introduction ToDust

What is DUST

▪ Dust is a Javascript templating engine

▪ Designed to run asynchronously on both the server and the browser

▪ Not truly Logic Less▪ Dust works where Javascript

works

Advantages

– Template is compiled to Javascript– Available on client side, so faster rendering and less network

load– Dust can precompile your templates , or dynamically load them– Dust works where Javascript works, No other dependencies

Example

// TemplateHello {name}! You have {count} new messages.

// Data {"name": "Mick","count": 30}

// ResultHello Mick! You Have 30 new messages.

Section and context

– A simple key reference will look first in the current context and, if not found, search all higher levels up to the root looking for the name– It will not search downward– {#A}{anotherName}{/A} outputs "rootName"

Paths

– If we want to work only with the data within a specific context, we can use dotted notation (called paths) to define the context– {A.B.name} will output "Bob"– Path notation allows you to reference a path outside a current

context

Paths // Template {#A.B}

Name in B = {name}, Name in A = {A.name}{/A.B}

// Data { "name": "root", "anotherName": "root2", "A":{ "name":"Albert", "B":{ "name":"Bob" } } } //Result Name in B = Bob, name in A = Albert

Explicit Context Setting

// Template {#A:A2}

{#names} {.} - {type}

{/names} {/A}

// Data {

"A": { names :

["Albert", "Alan"] }, "A2":{ "type":"Student" } }

Passing Parameters

{#A.B foo=A.name bar=anotherName myName="shashi"}

{foo} {name} {bar} {me} {/A.B}

References

http://www.dustjs.com/https://github.com/linkedin/dustjs