Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Twig en Symfony 2.1     Para programadores y diseñadores
¿Qué es Twig? Twig is a modern template engine for PHP (definición de  la web de twig) Rápido (compila los templates en ...
¿Por qué otro motor de templates? PHP es el mismo un motor de templates (muy largo de  escribir) Me explico: <?php echo...
Sintaxis orientada a Templates Hay muchos accesos directos (Shortcuts) para realizar  las acciones mas comunes. Un ejemp...
Todas las funciones Con twig tenemos todas las opciones posibles a la hora  de crear templates, tenemos herencia multiple...
Mas cosas que tiene twig Fácil de aprender Extensible (Permite crear tus propios tags, filtros, etc..) Unit Tested (Twi...
¿Quien está detrás de todo? @fabpot
¿qué nos da twig?
Básico de twig {# Comentario #} {{ mostrar_algo }} {% hacer algo %}
Variables {{ name }} === <?php echo $name; ?>
Tags{% if online == false %}   <p>Our website is in maintenance mode.   Please, come back later.</p>{% endif %}
Filters {{ my first car|capitalize }}
Funciones {{ random() }}     (funciona como la nativa de PHP `mt_rand`) {{ random(5) }}
Tests{# Se evalúa a true si la variable is null, false, o cadenavacía #}  {% if foo is empty %}     ...  {% endif %}
NOTA: Twig no tiene el operador === Para esto usamos una función “sameas”  {% if foo.attribute is sameas(false) %}     t...
Embed Include Extends Embed  {% embed "lateral.twig” %}       {% block principal %}       ...       {% endblock %}  {% ...
Documentación interesante http://twig.sensiolabs.org/   http://twig.sensiolabs.org/documentation http://www.symfony.es/...
Vale, Fin de diapositivas  Creamos un proyecto de symfony 2.1 para hacer cositasphp composer.phar create-project symfony/f...
Un poquito de Symfony Accedemos a   DemoBundle -> Controller -> DemoController.php helloAction Template   Resources/v...
Ejercicios1. Pasar una variable nueva desde el controller a twig y printar   por pantalla.2. Imprimir un array ordenado  1...
Random Presenta por pantalla un numero aleatorio Presenta por pantalla un numero aleatorio menor que 10 Presenta por pa...
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...
Date Ejemplo interesante Si tenemos una variable fechaNacimiento como hacemos  la comprobación si el usuario es menor de...
Otra de date Queremos imprimir la fecha del proximo viernes.El curso de formularios en SF2 será el{{date(next Friday)|dat...
Arrays Tenemos el siguiente array  {% set oferta = {      precio:30,      fechaExpiracion:date(+30days)   }%}  Como mostr...
Varias opciones ~ (concatenar con el MAC alt + ñ) {{La oferta cuesta‟ ~ oferta.precio ~ euros(‟ ~  oferta.precio*1.18 ~‟...
Mas opciones Replace() {{La oferta cuesta :precio euros( :total con IVA)y es  válida hasta el  :fecha|replace({:precio:o...
Listas Dada una lista como esta {% set lista=[a,b,c,d] %} Queremos imprimir solo b, c, d Solucion:  {% for value in li...
Includes{% extends request.ajax ? "base_ajax.html" : "base.html" %}{% block content %}  Este es el contenido a mostrar.{% ...
Ejercicios Crear un template que herede de otro y que cree un  bloque con una capa con fondo de color rojo.   Podemos us...
Include Crear un template hello2.html.twig que se incluya al  principio del bloque content. NOTA: no se puede añadir con...
Muchas Gracias Preguntas @fabpot
Upcoming SlideShare
Loading in …5
×

Twig

3,958 views

Published on

Presentación de Twig para symfony 2 formacion emagister.com

Published in: Technology
  • Be the first to comment

Twig

  1. 1. Twig en Symfony 2.1 Para programadores y diseñadores
  2. 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. 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. 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. 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. 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. 7. ¿Quien está detrás de todo? @fabpot
  8. 8. ¿qué nos da twig?
  9. 9. Básico de twig {# Comentario #} {{ mostrar_algo }} {% hacer algo %}
  10. 10. Variables {{ name }} === <?php echo $name; ?>
  11. 11. Tags{% if online == false %} <p>Our website is in maintenance mode. Please, come back later.</p>{% endif %}
  12. 12. Filters {{ my first car|capitalize }}
  13. 13. Funciones {{ random() }}  (funciona como la nativa de PHP `mt_rand`) {{ random(5) }}
  14. 14. Tests{# Se evalúa a true si la variable is null, false, o cadenavacía #} {% if foo is empty %} ... {% endif %}
  15. 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. 16. Embed Include Extends Embed {% embed "lateral.twig” %} {% block principal %} ... {% endblock %} {% endembed %}
  17. 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. 18. Vale, Fin de diapositivas Creamos un proyecto de symfony 2.1 para hacer cositasphp composer.phar create-project symfony/framework-standard-edition twig-formacionCopiamos composer.phar en twig-formacion y ejecutamos:php composer.phar installChmod –R 777 app/cacheChmod –R 777 app/logshttp://local.twig-formacion.com/app_dev.php/demo/hello/
  19. 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. 20. Ejercicios1. 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. 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. 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. 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. 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. 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. 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. 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. 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. 29. Includes{% extends request.ajax ? "base_ajax.html" : "base.html" %}{% block content %} Este es el contenido a mostrar.{% endblock %}
  30. 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. 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. 32. Muchas Gracias Preguntas @fabpot

×