Frontend

1. Mise en place de Webpack Encore

Travail à réaliser

1. Installez Webpack Encore
2. Pour éviter d'avoir à installer les dépendances Javascript dans l'intégration continue, modifiez la config de test du bundle Webpack Encore config/packages/webpack_encore.yaml pour désactiver le mode strict.
3. Remplacer votre installation de Bootstrap 5 par CDN par une installation locale en suivant la documentation suivante : https://symfony.com/doc/5.4/frontend/encore/bootstrap.html

Attention

La documentation n'est pas forcément à jour pour les dernières versions de Bootstrap, des adaptations peuvent être nécessaires.

2. Indicateur de nouvelles citations

Mettre en place un indicateur avertissant l'utilisateur qu'une nouvelle citation a été ajouté depuis la dernière fois qu'il a rafraîchi la page.

Alerte indiquant à l'utilisateur qu'une nouvelle citation a été ajoutée

Travail à réaliser

1. Installez Symfony UX Live Components
2. Triez la liste des citations par date de création antéchronologique
3. En vous inspirant de l'exemple ci-dessus, créez un composant "live" NewQuoteIndicatorComponent. Ce composant sera ajouté en haut de la liste des citations et devra :
   • afficher une alerte si une nouvelle citation a été créée depuis que la page a été affichée
   • se rafraîchir automatiquement toutes les 10 secondes
   • permettre de rafraîchir la page en cliquant sur l'alerte

---

Ressources :

• Cours
• Documentation Webpack Encore - Exemple

---

Dernière mise à jour: February 27, 2023