Twital
Feel power of Twig using an AngularJS-like syntax
Who Am I?
Asmir Mustafic
Born in Bonsia, grew up in Italy, living in Berlin!
Working as freelance/consultant
(mainly PHP)
Twig
Twig is a modern template engine for PHP
-
Fast:
Twig compiles templates down to plain optimized PHP code. The overhead compared to regular PHP code was reduced to the very minimum.
-
Secure:
Twig has a sandbox mode to evaluate untrusted template code. This allows Twig to be used as a template language for applications where users may modify the template design.
-
Flexible:
Twig is powered by a flexible lexer and parser. This allows the developer to define its own custom tags and filters, and create its own DSL.
http://twig.sensiolabs.org/
<!DOCTYPE html>
<html>
<head>
<title>My Webpage</title>
</head>
<body>
<ul id="navigation">
{% for item in navigation %}
<li>
<a href="{{ item.href }}">{{ item.caption }}</a>
</li>
{% endfor %}
</ul>
<h1>My Webpage</h1>
{{ a_variable }}
</body>
</html>
Twig template example
This presentation is about
template engines ...
Ok...
Yet another template engine?
yes! let's see....
Twital
Twig plugin (template loader)
Allows to mix Twig and Twital syntax
AngularJs/PHPTal like
Adds some features and syntactic sugar on top of Twig
100% compatible with Twig
Twig
$fileLoader = new Twig_Loader_Filesystem('/path/to/templates');
$twig = new Twig_Environment($fileLoader);
echo $twig->render('demo.twig', array('name' => 'John'));
How to render a twig template
Twital
$fileLoader = new Twig_Loader_Filesystem('/path/to/templates');
$twitalLoader = new Goetas\Twital\TwitalLoader($fileLoader);
$twig = new Twig_Environment($twitalLoader);
echo $twig->render('demo.twig', array('name' => 'John'));
How to render a twital template
{% if users | length %}
<div>
<h1>{{ 'Details' | translate }}</h1>
<ul class="{{ list }}">
{% for user in users %}
<li>
<a {% if user.active %}href="{{ user.link }}"{% endif %}>
{{ user.name | upper }}
</a>
<span class="item{% if user.active %} active{% endif %}">
{{ form[user.id].name | form_widget }}
</span>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
page.twig
{% if users | length %}
<div>
<h1>{{ 'Details' | translate }}</h1>
<ul class="{{ list }}">
{% for user in users %}
<li>
<a {% if user.active %}href="{{ user.link }}"{% endif %}>
{{ user.name | upper }}
</a>
<span class="item{% if user.active %} active{% endif %}">
{{ form[user.id].name | form_widget }}
</span>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
page.twital
<div t:if="if users | length">
<h1>{{ 'Details' | translate }}</h1>
<ul class="{{ list }}">
{% for user in users %}
<li>
<a {% if user.active %}href="{{ user.link }}"{% endif %}>
{{ user.name | upper }}
</a>
<span class="item{% if user.active %} active{% endif %}">
{{ form[user.id].name | form_widget }}
</span>
</li>
{% endfor %}
</ul>
</div>
page.twital
<div t:if="if users | length">
<h1>{{ 'Details' | translate }}</h1>
<ul class="{{ list }}">
<li t:for="user in users">
<a {% if user.active %}href="{{ user.link }}"{% endif %}>
{{ user.name | upper }}
</a>
<span class="item{% if user.active %} active{% endif %}">
{{ form[user.id].name | form_widget }}
</span>
</li>
</ul>
</div>
page.twital
<div t:if="if users | length">
<h1>{{ 'Details' | translate }}</h1>
<ul class="{{ list }}">
<li t:for="user in users">
<a t:attr="user.active ? href=user.link">
{{ user.name | upper }}
</a>
<span class="item{% if user.active %} active{% endif %}">
{{ form[user.id].name | form_widget }}
</span>
</li>
</ul>
</div>
page.twital
<div t:if="if users | length">
<h1>{{ 'Details' | translate }}</h1>
<ul class="{{ list }}">
<li t:for="user in users">
<a t:attr="user.active ? href=user.link">
{{ user.name | upper }}
</a>
<span class="item"
t:attr-append="user.active ? href = ' active'">
{{ form[user.id].name | form_widget }}
</span>
</li>
</ul>
</div>
page.twital
<div t:if="if users | length">
<h1 t:trans="">Details</h1>
<ul class="{{ list }}">
<li t:for="user in users">
<a t:attr="user.active ? href=user.link">
{{ user.name | upper }}
</a>
<span class="item"
t:attr-append="user.active ? href = ' active'">
{{ form[user.id].name | form_widget }}
</span>
</li>
</ul>
</div>
page.twital
That's it!
Extra info:
Template Inheritance,
Auto escaping + Context aware escaping,
Fast as Twig,
Symfony2 support (assetic, forms, routing, translations...)
.. if it can be done with Twig, it can be done with Twital*
Info
- MIT License
- ~90% test coverage
- 9.1 scrutinizer-ci score
- PHP 5.3 -> PHP 7
- HHVM 3.3 -> 3.8
- stable and used in production
(v1.0 will be released when Twig 2.0 will be ready)