mirror of
https://github.com/twbs/bootstrap.git
synced 2024-12-04 16:24:22 +01:00
140 lines
4.6 KiB
Plaintext
140 lines
4.6 KiB
Plaintext
|
<!DOCTYPE html>
|
||
|
|
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
|
||
|
|
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
|
||
|
|
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
|
||
|
|
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
|
||
|
|
<head>
|
||
|
|
|
||
|
|
<!-- Basic Page Needs
|
||
|
|
================================================== -->
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<title>Hogan.js</title>
|
||
|
|
<meta name="description" content="">
|
||
|
|
<meta name="author" content="">
|
||
|
|
<!--[if lt IE 9]>
|
||
|
|
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||
|
|
<![endif]-->
|
||
|
|
|
||
|
|
<!-- Mobile Specific Metas
|
||
|
|
================================================== -->
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||
|
|
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
|
||
|
|
|
||
|
|
<!-- CSS
|
||
|
|
================================================== -->
|
||
|
|
<link rel="stylesheet" href="stylesheets/skeleton.css">
|
||
|
|
<link rel="stylesheet" href="stylesheets/layout.css">
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<!-- Primary Page Layout
|
||
|
|
================================================== -->
|
||
|
|
|
||
|
|
<header class="hogan-hero">
|
||
|
|
<div class="stripes"></div>
|
||
|
|
<div class="noise"></div>
|
||
|
|
<div class="container">
|
||
|
|
<h1>Hogan.js</h1>
|
||
|
|
<h3>JavaScript templating from Twitter.</h3>
|
||
|
|
<a href="https://github.com/twitter/hogan.js" class="download button">View on Github</a>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
<div class="primary container">
|
||
|
|
|
||
|
|
<!-- Layout 1 -->
|
||
|
|
<div class="five columns">
|
||
|
|
<h4>Getting started</h4>
|
||
|
|
<p>
|
||
|
|
Hogan.js is a 2.5k JS templating engine developed at Twitter. Use it as a part of your asset packager to compile templates ahead of time or include it in your browser to handle dynamic templates.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
If you're developing with Node.js, just use NPM to add the Hogan package.
|
||
|
|
</p>
|
||
|
|
<pre><code>$ npm install hogan.js</code></pre>
|
||
|
|
<p>
|
||
|
|
Alternatively, drop hogan.js in your browser by adding the following script.
|
||
|
|
</p>
|
||
|
|
<pre><code><script src="http://twitter.github.com/hogan.js/builds/{{version}}/hogan.js"></script></code></pre>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div class="ten columns offset-by-one">
|
||
|
|
<script src="https://gist.github.com/1484613.js"> </script>
|
||
|
|
</div>
|
||
|
|
<div class="hogan-divider">
|
||
|
|
<div class="hogan-icon"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Layout 2 -->
|
||
|
|
<div class="five columns">
|
||
|
|
<h4>Templates</h4>
|
||
|
|
<p>
|
||
|
|
Hogan.js was developed against the mustache test suite, so everything that holds true for templates as specified <a href="//mustache.github.com/mustache.5.html">here</a>, is also the case for hogan.js.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
That means you get variables, sections, lambdas, partials, filters, and everything else you've come to expect from mustache templating - only much, much faster.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="ten columns offset-by-one">
|
||
|
|
<script src="https://gist.github.com/1484342.js"></script>
|
||
|
|
</div>
|
||
|
|
<div class="hogan-divider">
|
||
|
|
<div class="hogan-icon"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Layout 3 -->
|
||
|
|
<div class="five columns">
|
||
|
|
<h4>Compiling</h4>
|
||
|
|
<p>
|
||
|
|
Use <code>hogan.compile()</code> to precompile your templates into vanilla JS.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
It's best to serve your templates precompiled whenever you can (rather than the raw templates), as parsing is the most time consuming operation.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="ten columns offset-by-one">
|
||
|
|
<script src="https://gist.github.com/1484513.js"> </script>
|
||
|
|
</div>
|
||
|
|
<div class="hogan-divider">
|
||
|
|
<div class="hogan-icon"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Layout 4 -->
|
||
|
|
<div class="five columns">
|
||
|
|
<h4 id='rendering'>Rendering</h4>
|
||
|
|
<p>
|
||
|
|
Once compiled, call the <code>render()</code> method with a context and optional partials object.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
If supplying partials, you can compile them ahead of time, or pass string templates.</p>
|
||
|
|
<p>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="ten columns offset-by-one">
|
||
|
|
<script src="https://gist.github.com/1575714.js"> </script>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="sixteen columns hogan-footer">
|
||
|
|
<span class="copyright">
|
||
|
|
Designed and built with all the love in the world <a href="http://twitter.com/twitter" target="_blank">@twitter</a> by <a href="http://twitter.com/sayrer" target="_blank">@sayrer</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>.<br />
|
||
|
|
Code licensed under the <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>. Documentation licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.
|
||
|
|
</span>
|
||
|
|
<span class="colophon">
|
||
|
|
<a href="#">Back to top</a>
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</div><!-- container -->
|
||
|
|
|
||
|
|
|
||
|
|
<!-- End Document
|
||
|
|
================================================== -->
|
||
|
|
</body>
|
||
|
|
</html>
|