Permalink
Fetching contributors…
Cannot retrieve contributors at this time
99 lines (78 sloc) 3.52 KB
{% extends "layouts/master.html" %}
{%- if DEV %}
{% set baseurl = '' %}
{% else %}
{% set baseurl = '/swig' %}
{% endif -%}
{% block title %}{% parent %} - A Node.js and Browser JavaScript Template Engine{% endblock %}
{% block page_content %}
<section class="content">
<h1>Swig</h1>
<div class="row guttered">
<p class="span6">A simple, powerful, and extendable JavaScript Template Engine.</p>
<p class="span6">Current Version: <strong>{{ version }}</strong>. <a href="{{ baseurl }}/docs/previous/">Looking for an older version?</a></p>
</div>
<hr class="small">
<div class="row guttered">
<section class="span6">
<h2>Super Quick Start</h2>
<p>For a more in-depth intro, check out the <a href="{{ baseurl }}/docs/">Getting Started docs</a>.</p>
<h3>Install Swig</h3>
<pre><code>npm install swig --save</code></pre>
<h3>Create Your Template</h3>
<pre><code data-language="swig">{% raw %}&lt;h1&gt;{{ pagename|title }}&lt;/h1&gt;
&lt;ul&gt;
{% for author in authors %}
&lt;li{% if loop.first %} class="first"{% endif %}&gt;
{{ author }}
&lt;/li&gt;
{% endfor %}
&lt;/ul&gt;{% endraw %}</code></pre>
<h3>Render Your Template</h3>
<pre><code data-language="javascript">var swig = require('swig');
swig.renderFile('/path/to/template.html', {
pagename: 'awesome people',
authors: ['Paul', 'Jim', 'Jane']
});</code></pre>
<h3>The End Result</h3>
<pre><code data-language="html">&lt;h1&gt;Awesome People&lt;/h1&gt;
&lt;ul&gt;
&lt;li class="first"&gt;Paul&lt;/li&gt;
&lt;li&gt;Jim&lt;/li&gt;
&lt;li&gt;Jane&lt;/li&gt;
&lt;/ul&gt;</code></pre>
</section>
<section class="span6">
<h2>Features</h2>
<ul>
<li>Available for node.js <em>and</em> major web browsers!</li>
<li>Uses similar methodologies as Django, Jinja2, and Twig template engines.</li>
<li><a href="http://expressjs.com/">Express</a> compatible.</li>
<li>Object-Oriented template inheritance.</li>
<li>Apply filters and transformations to output in your templates.</li>
<li>Automatically escapes all output for safe HTML rendering.</li>
<li>Lots of iteration and conditionals supported.</li>
<li>Robust without the bloat.</li>
<li>Extendable and customizable.</li>
<li>Great <a href="{{ baseurl }}/coverage.html">code coverage</a>.</li>
</ul>
<hr class="small">
<h2>Download For the Browser</h2>
<p>Swig also works in all major browsers. Just download the following file and follow the <a href="{{ baseurl }}/docs/#browser">Documentation</a>.</p>
<p class="download">
<a href="{{ baseurl }}/js/swig.min.js" class="btn">Download {{ version }}</a><br><br>
<a href="{{ baseurl }}/js/swig.js">Development</a> | <a href="{{ baseurl }}/js/swig.min.js">Production</a> (<a href="{{ baseurl }}/js/swig.js.map">source map</a>)
</p>
<hr class="small">
<h2>Resources</h2>
<ul>
<li><a href="https://groups.google.com/forum/#!forum/swig-templates">Mailing List</a></li>
<li><a href="https://travis-ci.org/paularmstrong/swig/builds">Travis CI Build History</a></li>
<li><a href="https://github.com/paularmstrong/swig/issues">Bug Reports</a></li>
<li><a href="http://stackoverflow.com/questions/tagged/swig-template">Stack Overflow Questions</a></li>
<li><a href="https://github.com/jonschlinkert/sublime-swig">Syntax Highlighting for Sublime Text</a></li>
</ul>
</section>
</div>
</section>
{% endblock %}