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

Hogan.js

sayrer
February 01, 2012

 Hogan.js

Twitter Open Source Summit
January, 31, 2012

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"