R5.A.05-Symfony
/
ressources-etu
30
9
Fork 0
Code Releases Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'public'
${ noResults }
ressources-etu/labs/3/lab3_twig.md

4.0 KiB
Raw Permalink Blame History

TP3.2: Templating avec Twig

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License. Permission is explicitly granted to copy, distribute and/or modify this document for educational purposes under the terms of the CC BY-NC-SA license.

Objectifs

Les objectifs de ce TP sont :

  • Comprendre et mettre en œuvre les opérations CRUD (Create, Read, Update, Delete) avec Twig dans une application Symfony.
  • S'approprier les structures de contrôle de Twig (if/for/etc).
  • Comprendre les méchanismes d'héritage et d'extension de templates.

Consignes

  • Durée : 2 heures
  • Tous vos projets Symfony sont à placer votre dossier ~/public_html.
  • N'utilisez PAS le serveur londres.uca.local pour tester vos pages mais la commande symfony server:start.
  • Nous allons continuer notre réseau social nommé TweetTok où les messages sont nommés des Twok.
  • Lors du précédent TP, nous avons stocké les Twoks en BDD, mais avec un CRUD très rudimentaire.
  • Nous allons maintenant améliorer les vues avec Twig.
  • Repartez donc de votre précédent projet TweetTok.
  • Attention! L'utilisation des commandes symfony console make:crud et symfony console make:form sont interdites pour le moment ! L'objectif est de comprendre ce qu'elles font.

Ressources

Partie 1 : Affichage des Twoks (30 min)

  1. Template de base :

    • Créez un fichier base.html.twig qui contient les balises <head> et <body> de votre page web.
    • Créez un block body vide qui sera rempli par les autres templates.

  2. Liste des Twoks :

    • Créez un template index.html.twig pour afficher la liste des Twoks. Utilisez une boucle for pour itérer sur chaque Twok. Affichez le contenu du Twok, son auteur et sa date de création formatée.
    • Faites en sorte que le votre template index.html.twig étende le template base.html.twig pour ne pas avoir à dupliquer de code HTML.

  3. Filtres personnalisés :

    • Créez un filtre Twig personnalisé pour résumer les Twoks qui sont trop longs. Implémentez le filtre dans le fichier src/Twig/AppExtension.php et nommez ce filtre summarize. Voir doc sur les extension Twig.
    • Utilisez ce filtre dans votre template pour afficher un résumé des Twoks. 
      {{ twok.content|summarize(100) }}

Partie 2 : Interaction avec les Twoks (45 min)

  1. Affichage conditionnel :

    • Ajoutez un affichage conditionnel pour montrer un message spécial (ex: "Nouveau Twok !") si un Twok a été créé le jour même.

  2. Inclusion de Templates :

    • Créez un template séparé pour afficher les détails d'un Twok (twok_detail.html.twig) et incluez-le dans votre liste de Twoks.

  3. Macros Twig pour les boutons :

    • Définissez une macro Twig pour générer des boutons de like et de partage pour chaque Twok. Utilisez cette macro dans le template de détail du Twok.

Partie 3 : Fonctionnalités Avancées (45 min)

  1. Affichage alterné :

    • Expérimentez avec des structures de contrôle avancées en affichant les Twoks en alternance : un Twok sur fond clair, l'autre sur fond sombre.

  2. Twoks par utilisateur :

    • Créez un nouveau template twok_by_user.html.twig qui permettra de lister l'ensemble des utilisateurs avec pour chaqun une liste de ses Twoks.

  3. Ordre des Twoks :

    • Dans votre template index.html.twig, faites en sorte qu'il soit possible de lister les Twoks du plus ancien au plus récent et l'inverse.