Your SlideShare is downloading. ×
0
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Clase 6 twig
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Clase 6 twig

408

Published on

www.hydrascs.com

www.hydrascs.com

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
408
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  1. Twig Realizada por: Gonzalo Alonso |@GonzaloAlonsoD Diego Barros |@Inmzombie Para: Hydras C&S |@hydras_cs Basada en Libro Symfony 2 en español Nacho Pacheco y The Book
  2. Plantillas Una plantilla simplemente es un archivo de texto que puede generar cualquier formato basado en texto (HTML, XML, CSV, etc.)
  3. <!DOCTYPE html> <html> <head> <title>Welcome to Symfony!</title> </head> <body> <h1><?php echo $page_title ?></h1> <ul id="navigation"> <?php foreach ($navigation as $item): ?> <li> <a href="<?php echo $item->getHref() ?>"> <?php echo $item->getCaption() ?> </a> </li> <?php endforeach; ?> </ul> </body> </html>
  4. <!DOCTYPE html> <html> <head> <title>Welcome to Symfony!</title> </head> <body> <h1>{{ page_title }}</h1> <ul id="navigation"> {% for item in navigation %} <li><a href="{{ item.href }}">{{ item.caption }}</a></li> {% endfor %} </ul> </body> </html>
  5. Sintaxis especiales {{ ... }} «Dice» {% ... %} «Hace» {# ... #} «Comenta» {{ title|upper }} «Filtro»
  6. La siguiente función, utiliza una etiqueta for estándar y la función cycle para imprimir diez etiquetas div, alternando entre clases par e impar: {% for i in 0..10 %} <div class="{{ cycle(['odd', 'even'], i) }}"> <!-- some HTML here --> </div> {% endfor %}
  7. Manejando las vistas con Twig ¿Por qué Twig? Las plantillas son simples y no procesan etiquetas PHP. Está destinado a expresar la presentación, no la lógica del programa. ● controlar el espacio en blanco ● cuenta con un recinto de seguridad ● escape de salida automático y contextual ● incluye funciones personalizadas ● filtros que sólo afectan a las plantillas
  8. ● contiene pequeñas características que facilitan la escritura de plantillas y estas son más concisas. <ul> {% for user in users if user.active %} <li>{{ user.username }}</li> {% else %} <li>No users found</li> {% endfor %} </ul>
  9. Guardando en caché plantillas Twig Cada plantilla Twig se compila hasta una clase PHP nativa. Directorio app/cache/{entorno}/twig Modo debug desactivado (prod), regenerar las plantillas. Modo debug (dev), compilación automática.
  10. Plantillas, herencia y diseño Una plantilla se puede decorar con otra. La herencia permite tener una plantilla base. <!DOCTYPE html> <html> <head> <title>{% block title %}Welcome!{% endblock %}</title> {% block stylesheets %}{% endblock %} </head> <body> <div class="container">{% block body %}{% endblock %}</div> {% block javascripts %}{% endblock %} </body> </html>
  11. Una plantilla hija puede extender el diseño base y reemplazar cualquiera de sus bloques. {% extends '::base.html.twig' %} {% block title %}My cool blog posts{% endblock %} {% block body %} {% for entry in blog_entries %} <h2>{{ entry.title }}</h2> <p>{{ entry.body }}</p> {% endfor %} {% endblock %}
  12. A tener en cuenta {% extends %} primer etiqueta. Mas {% block %} mejor. Contenido duplicado un nuevo {% block %}. Obtener contenido {{ parent() }}. {% block sidebar %} <h3>Table of Contents</h3> {# ... #} {{ parent() }} {% endblock %}
  13. Nomenclatura y ubicación de plantillas Symfony2 utiliza una sintaxis de cadena paquete: controlador:plantilla AcmeBlogBundle:Blog:index.html.twig ● AcmeBlogBundle: (paquete) src/Acme/BlogBundle. ● Blog: (controlador) Resources/views. ● index.html.twig: (plantilla) nombre real.
  14. Nomenclatura y ubicación de plantillas ruta final src/ Acme/BlogBundle/Resources/views/Blog/index.html.twig. AcmeBlogBundle::layout.html.twig: Plantilla base específica para AcmeBlogBundle Resources/views/layout.html.twig ::base.html.twig: Esta sintaxis se refiere a una plantilla o diseño base de la aplicación. app/Resources/views/
  15. Sufijo de plantilla paquete:controlador:plantilla.(formato).(motor) ● AcmeBlogBundle:Blog:index.html.twig — formato HTML, motor Twig ● AcmeBlogBundle:Blog:index.html.php — formato HTML, motor PHP ● AcmeBlogBundle:Blog:index.css.twig — formato CSS, motor Twig
  16. Incluyendo otras plantillas {# src/Acme/ArticleBundle/Resources/views/Article/articleDetails.html.twig #} <h2>{{ article.title }}</h2> <h3 class="byline">by {{ article.authorName }}</h3> <p> {{ article.body }} </p>
  17. {# src/Acme/ArticleBundle/Resources/views/Article/list.html.twig #} {% extends 'AcmeArticleBundle::layout.html.twig' %} {% block body %} <h1>Recent Articles<h1> {% for article in articles %} {{ include( 'AcmeArticleBundle:Article:articleDetails.html.twig', { 'article': article } )}} {% endfor %} {% endblock %} { 'article': article } (arreglo con claves nombradas). Si tuviéramos que pasar varios elementos sería: { 'foo': foo, 'bar': bar }.
  18. Integrando controladores // src/Acme/ArticleBundle/Controller/ArticleController.php class ArticleController extends Controller { public function recentArticlesAction($max = 3) { // hace una llamada a la base de datos u otra lógica $articles = ...; return $this->render( 'AcmeArticleBundle:Article:recentList.html.twig', array('articles' => $articles) ); } }
  19. Integrando controladores {# src/Acme/ArticleBundle/ Resources/views/Article/recentList.html.twig #} {% for article in articles %} <a href="/article/{{ article.slug }}"> {{ article.title }} </a> {% endfor %} {# app/Resources/views/base.html.twig #} <div id="sidebar"> {{ render(controller( 'AcmeArticleBundle:Article:recentArticles', { 'max': 3 })) }} </div>

×