Este documento describe Twig, un motor de plantillas para PHP incluido en Symfony. Twig es rápido, seguro y flexible, permitiendo definir etiquetas personalizadas. Ofrece atajos para tareas comunes como iterar sobre arrays vacíos. Incluye herencia múltiple, bloques de código y escape automático. Es fácil de aprender, extensible y está bien documentado y probado.

1. Twig en Symfony 2.1
Para programadores y diseñadores

2. ¿Qué es Twig?
 Twig is a modern template engine for PHP (definición de
la web de twig)
 Rápido (compila los templates en código php
optimizado)
 Seguro (tiene un modulo de sandbox para evaluar código
no verificado)
 Flexible (permite al desarrollador definir sus própios
custom tags)

3. ¿Por qué otro motor de templates?
 PHP es el mismo un motor de templates (muy largo de
escribir)
 Me explico:
 <?php echo htmlspecialchars($var, ENT_QUOTES, 'UTF-8') ?>
 {{ var|e }}

4. Sintaxis orientada a Templates
 Hay muchos accesos directos (Shortcuts) para realizar
las acciones mas comunes.
 Un ejemplo (cuando iteramos sobre un array vacio):
{% for user in users %}
* {{ user.name }}
{% else %}
No user have been found.
{% endfor %}

5. Todas las funciones
 Con twig tenemos todas las opciones posibles a la hora
de crear templates, tenemos herencia multiple, bloques
de código, escape automático y muchas otras
funcionalidades.
{% extends "layout.html" %}
{% block content %}
Content of the page...
{% endblock %}

6. Mas cosas que tiene twig
 Fácil de aprender
 Extensible (Permite crear tus propios tags, filtros, etc..)
 Unit Tested (Twig está testeado completamente y
preparado para grandes proyectos)
 Documentado
 Seguro
 Mensajes de error claros
 Rápido

7. ¿Quien está detrás de todo?
 @fabpot

8. ¿qué nos da twig?

9. Básico de twig
 {# Comentario #}
 {{ mostrar_algo }}
 {% hacer algo %}

10. Variables
 {{ name }} === <?php echo $name; ?>

11. Tags
{% if online == false %}
<p>Our website is in maintenance mode.
Please, come back later.</p>
{% endif %}

12. Filters
 {{ 'my first car'|capitalize }}

13. Funciones
 {{ random() }}
 (funciona como la nativa de PHP `mt_rand`)
 {{ random(5) }}

14. Tests
{# Se evalúa a true si la variable is null, false, o cadena
vacía #}
{% if foo is empty %}
...
{% endif %}

15. NOTA:
 Twig no tiene el operador ===
 Para esto usamos una función “sameas”
{% if foo.attribute is sameas(false) %}
the foo attribute really is the ``false`` PHP value
{% endif %}

16. Embed
 Include
 Extends
 Embed
{% embed "lateral.twig” %}
{% block principal %}
...
{% endblock %}
{% endembed %}

17. Documentación interesante
 http://twig.sensiolabs.org/
 http://twig.sensiolabs.org/documentation
 http://www.symfony.es/2012/06/17/desymfony2012-
twig-los-mejores-trucos-y-tecnicas-avanzadas/

18. Vale, Fin de diapositivas
Creamos un proyecto de symfony 2.1 para hacer cositas
php composer.phar create-project symfony/framework-
standard-edition twig-formacion
Copiamos composer.phar en twig-formacion y ejecutamos:
php composer.phar install
Chmod –R 777 app/cache
Chmod –R 777 app/logs
http://local.twig-formacion.com/app_dev.php/demo/hello/

19. Un poquito de Symfony
 Accedemos a
 DemoBundle -> Controller -> DemoController.php
 helloAction
 Template
 Resources/views/demo/hello.html.twig
 Interesante para pasar parámetros Symfony hace un
return de un array con las variables a pasar a la vista.

20. Ejercicios
1. Pasar una variable nueva desde el controller a twig y printar
por pantalla.
2. Imprimir un array ordenado
1. {{ array | sort }}
3. Escapar una variable
1. {{ string | e(„html‟) }}
4. Escapar una cadena de texto larga
{% filter escape('html') %}
<script type="text/javascript">
Var texto="<p>Loremipsumdolorsitamet</p>";
alert(texto);
</script>
{%end filter %}

21. Random
 Presenta por pantalla un numero aleatorio
 Presenta por pantalla un numero aleatorio menor que 10
 Presenta por pantalla un carácter aleatorio de un string
 Presenta por pantalla un elemento aleatorio de un array

22. Fechas
 Print dia de hoy
 {{„now‟ | date(“d”)}}
 Print fecha completa dd/mm/yyyy HH:mi:ss
 {{„now‟ | date(“d/m/Y H:i:s”)}}
 Print de la fecha y la hora de ahora en Argentina
 {{'now'|date("d/m/Y H:i:s","America/Argentina/Buenos_Aires")}}
 Print la fecha de aquí a 30 días
 {{date('+30days')|date}}

23. Date
 Ejemplo interesante
 Si tenemos una variable fechaNacimiento como hacemos
la comprobación si el usuario es menor de edad ?
{% if date(fechaNacimiento) < date(„-18years‟) %}
Eres menor de edad
{% endif %}

24. Otra de date
 Queremos imprimir la fecha del proximo viernes.
El curso de formularios en SF2 será el
{{date('next Friday')|date(„d/m/Y 14:00‟)}}

25. Arrays
 Tenemos el siguiente array
{% set oferta = {
'precio':30,
'fechaExpiracion':date('+30days')
}%}
Como mostramos lo siguiente:
La oferta cuesta 30 euros (35.4 con IVA) y es válida hasta el
19/08/2012

26. Varias opciones
 ~ (concatenar con el MAC alt + ñ)
 {{'La oferta cuesta‟ ~ oferta.precio ~ 'euros(‟ ~
oferta.precio*1.18 ~‟ con IVA)y es válida hasta el‟
~oferta.fechaExpiracion|date()}}
 Format()
 {{'La oferta cuesta %.2f euros(%.2f con IVA)y es válida
hasta el
%s'|format(oferta.precio, oferta.precio*1.18,oferta.fech
aExpiracion|date())}}

27. Mas opciones
 Replace()
 {{'La oferta cuesta :precio euros( :total con IVA)y es
válida hasta el
:fecha'|replace({':precio':oferta.precio,':total':oferta.pr
ecio*1.18,':fecha':oferta.fechaExpiracion|date()})}}
 La chula
 {{"La oferta cuesta #{oferta.precio}
euros(#{oferta.precio*1.18} con IVA) y es válida
hasta el #{oferta.fechaExpiracion|date()}"}}

28. Listas
 Dada una lista como esta
 {% set lista=['a','b','c','d'] %}
 Queremos imprimir solo b, c, d
 Solucion:
{% for value in lista[1:] %}
{{value}}
{% endfor %}

29. Includes
{% extends request.ajax ? "base_ajax.html" : "base.html" %}
{% block content %}
Este es el contenido a mostrar.
{% endblock %}

30. Ejercicios
 Crear un template que herede de otro y que cree un
bloque con una capa con fondo de color rojo.
 Podemos usar el layout por defecto
 El que herede que sea de color azul

31. Include
 Crear un template hello2.html.twig que se incluya al
principio del bloque content.
 NOTA: no se puede añadir contenidos en templates que
hereden de otros, fuera de los bloques.
{% include 'AcmeDemoBundle::demo/hello2.html.twig' %}
Podemos usar include con el simbolo de concatenar (~)
incluso usando filtros.
{% include var|default('index') ~ '_foo.html' %}

32. Muchas Gracias
 Preguntas
 @fabpot