Blog

Contexte du projet

Ce projet a été réalisé dans le cadre de ma formation à l’UHA 4.0 en développement web full stack, au cours de l’année 2025.
Il s’agit d’un projet de groupe développé en deux itérations de 6 semaines chacune. Lors de la seconde itération, j’ai occupé le rôle de Scrum Master.

L’objectif du projet était de créer une application web ludique et pédagogique, inspirée du célèbre jeu Trivial Pursuit, permettant aux utilisateurs de créer leurs propres questions de culture scientifique et d’y jouer en équipe.

Objectif

Développer une application collaborative où des équipes peuvent rejoindre une session de jeu, créer leurs propres questions selon plusieurs types (QCM, vrai/faux, association, etc.), et jouer sur un plateau interactif.
L’outil est pensé pour un usage en milieu éducatif, afin de favoriser l’apprentissage par le jeu.

Fonctionnalités principales

• Création de sessions de jeu avec génération de code d’invitation

• Rejoindre une session existante et intégrer une équipe

• Création de questions personnalisées selon différents types :

  • Vrai ou faux

  • QCM (choix unique ou multiple)

  • Classement

  • Association (relier des paires)

  • Trouver un nombre

• Choix du thème de la question

• Possibilité pour l’administrateur de :

  • Valider, modifier ou refuser une question

  • Consulter l’historique des modifications visibles par l’auteur

• Lancement de la partie avec :

  • Lancer de dé

  • Déplacement du pion sur un plateau circulaire SVG

  • Pioche de questions créées par l’équipe adverse

  • Réponse enregistrée en base de données

  • Suivi du tour de jeu

Technologies utilisées

• Front-end : Next.js (React)

• Back-end : Node.js avec API REST

• ORM : Prisma avec base de données MySQL

• Conteneurisation : Docker (environnements développement et production)

Travail réalisé

Voici les principales tâches que j’ai effectuées sur le projet :

• Initialisation du projet avec Docker : configuration multi-environnement (dev/prod), docker-compose, volumes, réseaux

• Création des formulaires de question : interface dynamique selon le type de question, gestion des réponses, intégration des thèmes

• Modélisation du plateau de jeu en SVG : structure circulaire avec cases colorées, points de jonction et cases spéciales

• Déplacement du pion : implémentation d’un graph représentant les connexions entre les cases, et d’un algorithme DFS (recherche en profondeur) pour calculer les déplacements possibles en fonction du résultat du dé

• Historique des modifications : enregistrement des changements effectués sur une question par l’administrateur, avec visualisation côté auteur

Défis rencontrés

• Modéliser un plateau circulaire interactif tout en conservant une logique de navigation algorithmique

• Rendre l’application collaborative en gérant différents rôles (créateur, joueur, admin)

• Créer des composants réutilisables pour tous les types de questions, avec un rendu cohérent et une structure de données claire

Ce que j’ai appris

• Approfondissement de Next.js et Prisma dans un contexte full-stack

• Gestion de projet agile en tant que Scrum Master

• Mise en place d’une architecture front/back isolée avec Docker

• Application concrète d’algorithmes (DFS) dans un projet de jeu

• Importance de l’expérience utilisateur dans la conception de formulaires dynamiques et de feedbacks clairs (ex. visualisation des modifications)