tutorial3 desymfony - la vista. twig

Download Tutorial3 Desymfony - La Vista. Twig

If you can't read please download the document

Upload: marcos-labad

Post on 13-Jun-2015

13.937 views

Category:

Technology


2 download

DESCRIPTION

Presentación del tutorial de construcción de página ficticia de las jornadas #desymfony 2011.

TRANSCRIPT

  • 1.

2. 3. @me Antes Ahora 4. La Vista en MVC

  • Representa los datos del modelo, gestionados por el controlador. Misin: Representacin

5. Define formato(s) de visualizacin, agregando assets necesarios (css, js, imgenes...) 6. Es el interfaz final de usuario 7. Plantillas y Motores

  • La plantilla (template) es el archivo donde se instalan los datos (dinmicos) a mostrar al usuario

8. Una de las funciones originales de PHP, y lo ha sido durante todo este tiempo,es la de servir de motor de templates 9. Soluciones avanzadas y especficas para esta funcin 10. Twig: Ventajas

  • Herencia de templates / bloques

11. Funciones especficas de templates (output-escaping) 12. Limpio y sencillo 13. Extensible 14. Rapidez Plantillas son transformadas en PHP 15. Etiquetas Bsicas

  • Mostrar variables
  • Acceso a atributos
  • {{ var }}
  • {{ var.name }} //evaluar si es un array y existe la clave //evaluar si es un objeto y existe la propiedad //evaluar si es un objeto y existe el mtodo //evaluar si es un objeto y existe el mtodo getXXX() //evaluar si es un objeto y existe el mtodo isXXXX()

16. Etiquetas Bsicas

  • Filtros
  • Comandos
  • {{ nombre | capitalize }} // Federico
  • {% for persona in personas %} {{ persona.nombre }} - {{ persona.fechanacimiento | date('Y-m-d') }} {% else %} No hay personas {% endfor %}

17. Symfony y Twig

  • Twig se presenta como opcin por defecto

18. Estructura de archivos 19. Sintaxis de nombres

  • return $this->render(' DesymfonyBundle:Ponente:index.html.twig ', array( 'ponentes' => $ponentes ));
      • app/config.yml
    • 20. app/Resources/views
  • 21. src/Desymfony/DesymfonyBundle/Resources/views

22. src/Desymfony/DesymfonyBundle/Resources/public 23.

  • DesymfonyBundle:Ponente:index.html.twig

Bundle deReferencia Grupo de Templates (Directorio - Controlador) Nombre archivo template Denominacin Formato Motor 24. Aplicacin deSymfony

  • Symfony instalado y configurado (Tutorial #1)

25. Entidades creadas (Tutorial #2) 26. Maquetas html creadas Punto de partida

  • > git checkout tutorial3

27. Aplicacin deSymfony

  • Construir homepage, vista de ponentes, vista de ponencias y detalle de ponencia

28. Mostrar pginas de error 29. Ponencias en formatos XML e iCal Objetivos en Tutorial #3 30.

  • NetBeans + Ubuntu 10.10 (recin instalado)

31. Twig Extension for NetBeans 32. Riguroso directo (tendremos apuntes) Aplicacin deSymfony Acerca del Screencast 11 33.

  • Sealamos brevemente directorios y ficheros afectados y naming de Symfony

34. Aplicarmos filtros y mejoramos foreach dejado por Nacho en Ponente 35. Mostrarmos rpidamente maquetas y localizacion. 36. Recrear index ponencia, poner etiquetas brevementeSCREENCAST 19 37. Herencia en Twig Las plantillas se comportan como clases que es posible extender, los bloques se comportan como mtodos. Los Bloques nacen para ser sobrescritos 38. 39. Estructura tres niveles 40.

  • Creamos base.html.twig, layout.html.twig y aplicamos ponentes

41. Creamos includes en ponecias 42. (UPDATE templates) 43. Pararmos para explicar assets (images + js + css) e integracin de routing para construir enlacesSCREENCAST 34 44.

  • CSS, JS e imgenes accesibles desde web/, pero residentes en los Bundles (Resources/public)

45. Etiqueta asset. Ventajas: path manejado por Symfony2, optimizacin Assetic, YUI Compressor... Assets en Sf2 + Twig

  • > ./app/console assets:install web --symlink

46.

  • Tag especial para construir enlaces, propio de Symfony2. Similar a url_for() en Symfony 1

47. Utilizamos informacin de routing, podemos pasar parmetros Elaces y sistema routing

  • Copyright
  • Copyright

48.

  • Introduciomos la funcin asset.

49. Terminamos detalles de las vistas (enlaces en footer) 50. Nos damos cuenta de que nos hacen falta extensiones para:

  • Acortar descripciones (filtro truncate)

51. Autolink de urls 52. Formatear Meta-descripcin Vamos a explicar extensionesSCREENCAST 40 53.

  • Extensiones oficiales, como Vendor en Symfony2

54. Extensiones propias. Mxima flexibilidad 55. Se configuran como Servicio en Symfony2 + Dependency Injection Tags Extender Twig 56.

  • Creamos filtros propios, Service Injection tags

57. Habilitamos core extensions Twig (indicar que estn en vendors) 58. Aplicamos los filtros auto_link_text SCREENCAST 49 59.

  • Symfony2 ya tiene pgina de error. Vamos a sobrescribirla

60. Podemos sobrescribir templates de cualquier Bundle = modularidad Error pages - Overriding 61.

  • Creamos pgina de error, distinguiendo errores (ver si hacemos extensin condicional si es error 500)

62. Sobreescribimos pgina de Desymfony SCREENCAST 63.

  • Fabien Pontencier's blog: Templating Engines in PHP

64. http://fabien.potencier.org/article/34/templating-engines-in-php 65. Proyecto Desymfony 66. https://github.com/desymfony/desymfony 67. Diferencias entre Symfony 1 y Symfony2 68. http://symfony.com/doc/2.0/cookbook/symfony1.html 69. Documentacin Symfony2 referente a Templating 70. http://symfony.com/doc/2.0/book/templating.html 71. Proyecto Twig 72. http://www.twig-project.org/documentation 73. Crear una Extensin para Twig en Symfony2 74. http://www.martinsikora.com/how-to-make-twig-extension-for-symfony2 Referencias 75. {{ Gracias! }} {{ Gracias! }} Marcos Labad [email_address] @esmiz JORNADAS SYMFONY 2011 1-3 JULIO, CASTELLN DESYMFONY.COM {% if action.contact %} {% endif %}