Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Hogan.js

Avatar for sayrer sayrer
February 01, 2012

 Hogan.js

Twitter Open Source Summit
January, 31, 2012

Avatar for sayrer

sayrer

February 01, 2012
Tweet

Other Decks in Technology

Transcript

  1. What is Mustache? {{#showform}} <form> <label>Label</label> {{{some_markup}}} <label class="checkbox"> <input

    type="checkbox"> {{#i18n}}Check me out{{/i18n}} </label> <button class="{{class}}">Submit</button> </form> {{/showform}}
  2. Why Mustache? •Similar to HTML, easy to edit •Mock data

    as JSON files •Programmers not required
  3. At Runtime var s = "some {{example}} text"; var template

    = Hogan.compile(s); template.render({example: "foo"}); "some foo text"
  4. Compiled var s = "some {{example}} text"; var template =

    Hogan.compile(s); function(c,p,i){ var _ = this; _.b(i=i||""); _.b("some "); _.b(_.v(_.f("example",c,p,0))); _.b(" text"); return _.fl(); } "some foo text"