Optimiser, déployer, démontrer

01 Contexte

Votre application fonctionne, mais est-elle optimale et à tout épreuve pour faire face aux diverses conditions qu'elle rencontrera en production?
La phase 3 est composée de sept activités concrètes visant à rendre la solution robuste, utilisable et extensible :

1. Ajouter et justifier (dans votre rapport) une fonctionnalité additionnelle qui améliore significativement l'expérience utilisateur ;
2. Améliorer la maintenabilité de l'application, l'usage de hooks, de contexte, de store et la réutilisabilité des composants ;
3. Ajouter des tests unitaires couvrant les services du backend ;
4. Ajouter et décrire la stratégie de cache, frontend et backend ;
5. Déployer le backend et le frontend sur Render (ou une plateforme équivalente) ;
6. Documenter les optimisations et les faiblesses restantes ;
7. Produire une vidéo de 8 à 10 minutes démontrant l'utilisation de l'application.

02 Travail à réaliser

Tâche 1 : Fonctionnalité additionnelle

Ajoutez à l'application une fonctionnalité qui améliore concrètement l'expérience d'un utilisateur, et justifiez-la : quel besoin elle sert, pourquoi elle vaut l'effort. Elle doit s'inscrire dans le domaine de l'application, l'ambiance des lieux, plutôt que d'être un ajout technique isolé.

Tâche 2 : Maintenabilité et réutilisabilité

Améliorez la maintenabilité de l'application et la réutilisabilité de ses composants. Séparez les responsabilités, isolez la logique de l'affichage et de l'accès aux données, et extrayez les composants et fonctions destinés à servir à plusieurs endroits. Mettez à profit les outils que React offre pour cela : des hooks personnalisés pour extraire une logique répétée, lecontexte pour partager un état sans le faire transiter de proche en proche, et un store lorsqu'un état gagne à être géré hors des composants. On évalue la clarté du découpage et la justesse des frontières, pas le nombre de fichiers.

Tâche 3 : Tests unitaires des services

Ajoutez des tests unitaires couvrant les services du backend. Rendez-les testables en isolant la logique métier de l'accès aux données : une fonction pure se teste sans serveur ni base de données. Couvrez au moins trois cas pour chaque service. Les tests se lancent par la commande npm test (ou npm run test) et doivent tous passer sur le code livré et déployé.

Tâche 4 : Stratégie de cache, frontend et backend

Implémenterz une stratégie de cache côté frontend et côté backend, puis décrivez-la dans votre rapport. Précisez, pour chaque côté, ce qui est mis en cache, où elle est préservée, pour combien de temps et comment la copie est invalidée. Précisez également dans votre rapport ce qui ne doit jamais être mis en cache.

Tâche 5 : Déploiement sur Render

Déployez le backend et le frontend sur Render, ou une plateforme équivalente : l'API comme service, le client servi en ligne, reliés par CORS et configurés par variables d'environnement, le tout sur HTTPS. Fournissez les adresses des deux dans votre rapport et dans le README.

Tâche 6 : Documenter optimisations et faiblesses

Documentez les optimisations réalisées et les faiblesses qui subsistent.
Pour les optimisations, indiquez clairement ce que vous avez amélioré, et ce que la mesure utilisée montre (score avant/après, poste corrigé).
Pour les faiblesses, indiquez ce qui reste limité, mal couvert ou reporté et proposez une piste d'atténuation pour chacune.

Tâche 7 : Vidéo de démonstration de huit à dix minutes

Produisez une vidéo de huit à dix minutes qui démontre l'utilisation complète de l'application en ligne du point de vue de l'utilisateur finale. Tenez-vous dans cette durée, et faites en sorte que chaque membre y contribue.

03 Gestion de projet

La conduite du projet suit lesmêmes exigences que la phase précédente :

• Des tickets attribués. Le travail est découpé en tickets sur le suivi du dépôt, chacun affecté à un membre et doté d'un statut (à faire, en cours, terminé).
• Un rythme de commits régulier. Au moins trois commits par semaine et par membre, dont le message indique le type d'action, les éléments visés et l'intention.

04 Livrables

Implémentation Dépôt Git

Le code de l'application enrichie et refactorisée, la stratégie de cache, et les tests des services. Les tests se lancent par npm test et passent sur le code livré et déployé.

Application déployée Render

Le backend et le frontend en ligne, reliés, sur HTTPS, avec les adresses des deux.

Rapport final PDF sur StudiUM

Comme aux phases précédentes, un rapport décrit les choix faits. Il suit la structure suivante :

1. Fonctionnalité additionnelle : ce qui a été ajouté, le besoin servi, et la justification de son intérêt pour l'utilisateur.
2. Maintenabilité et réutilisabilité : le découpage retenu, l'usage des hooks, du contexte et/ou du store, et les composants rendus réutilisables.
3. Tests des services : ce qui est couvert, comment les services ont été isolés pour devenir testables, les cas limites retenus.
4. Stratégie de cache : côté frontend et côté backend, ce qui est mis en cache, où, pour combien de temps, comment la copie est invalidée, et ce qui ne l'est jamais.
5. Déploiement : la plateforme, l'architecture en ligne, et la configuration par variables d'environnement.
6. Optimisations et faiblesses : ce qui a été amélioré et comment vous l'avez constaté, puis les faiblesses restantes, assumées.

Vidéo de démonstration 8 à 10 minutes

Huit à dix minutes démontrant l'utilisation complète de l'application déployée, ses parcours, la fonctionnalité ajoutée, ses points forts et ses limites.

05 Évaluation

06 Pénalités

Une remise qui ne s'exécute pas ou qui n'est pas propre coute du temps à la correction et pénalise l'équipe. Les situations suivantes entrainent une pénalité :

• une erreur rencontrée à l'exécution de l'application ;
• des tests qui ne passent pas ;
• un manque d'informations pour exécuter les scripts (démarrage, dépendances, commandes) ;
• la présence de node_modules dans le dossier de remise ou dans le dépôt ;
• l'absence du fichier .env nécessaire à l'exécution dans la remise.