Développeuse Web Laravel / Designer Web

Développeuse Web Laravel & UX/UI Designer

WordPress | Figma | Adobe Creative Suite |

Profil Pont : de la maquette au code.

Sommaire

Présentation

Un jeu pour apprendre le code autrement.

L’idée de « Trivi-All Dev Trek » est née d’une constatation personnelle : apprendre les langages de programmation peut être ardu et parfois décourageant. Me remémorant mes apprentissages réussis avec le célèbre Trivial Pursuit, j’ai voulu adapter ce concept ludique à l’univers du développement web.

L’objectif : transformer l’apprentissage du code en une expérience interactive et engageante.

Cette application de quiz permet aux développeurs de tester et réviser leurs connaissances dans un environnement gamifié.

Ce projet, réalisé dans le cadre de mon titre professionnel de développeuse web, est à la fois une démonstration technique et un terrain de jeu pour explorer ma créativité.

J’ai choisi de me concentrer d’abord sur les fonctionnalités essentielles afin d’obtenir une version testable et fonctionnelle, avant de travailler sur la partie design graphique, qui viendra dans une deuxième phase.

Réalisation Technique

Application Laravel 11 avec système de quiz de 60 questions : Architecture MVC avec programmation orientée objet.

Gestion utilisateurs : authentification, rôles et permissions (Spatie).

Interface administrateur :  la gestion complète du contenu et des utilisateurs.

Base de données structurée : MySQL avec relations optimisées pour les quiz.

Technologies Utilisées

  • Framework & Backend
    • Laravel 11 avec architecture MVC et programmation orientée objet
    • PHP 8 pour les performances optimisées
    • MySQL avec relations via Eloquent ORM
    • Spatie Laravel Permission pour la gestion des rôles et permissions 
  • Frontend & UX
    • Interface responsive développée avec Blade Templates
    • Bootstrap intégré via Laravel UI pour l’authentification
    • JavaScript pour les interactions dynamiques
    • Design adaptatif mobile-first compatible tous appareils
  • Outils de Développement
    • VS Code 
    • phpMyAdmin pour la gestion base de données
    • Lunacy pour wireframes et maquettes
    • Looping pour modélisation MCD/MLD

Processus de Développement

Analyse & Conception : Définition des besoins, architecture BDD et wireframes avec Lunacy.

Architecture Laravel : Mise en place MVC, migrations, modèles et système de permissions.

Interface Utilisateur : Développement des vues Blade et intégration responsive. 

Défis Techniques Relevés

Intégration Spatie Permissions : Mise en place d’un système de rôles et système de permissions précis pour différencier utilisateurs et administrateurs.

Architecture évolutive : Conception d’une base de données flexible permettant l’ajout de nouvelles catégories,  de questions ou autres. 

Optimisation des requêtes : Gestion des relations entre les tables pour de meilleures performances.

Interface de l'application

Interface utilisateur

Interface administrateur

Panel de gestion complète des utilisateurs et du contenu avec contrôle des permissions.

Compétences Développées

Architecture MVC Laravel : Connaissances du framework avec implémentation de la logique métier séparée.

Conception Base de Données : Modélisation relationnelle avec les tables.

Gestion Utilisateurs : Système complet d’authentification avec middleware de protection des routes.

Résultats Obtenus

Fonctionnalités déjà disponibles

  • Côté joueur :

    • création de compte,

    • accès à un quiz de 60 questions (sans sauvegarde pour l’instant).

  • Côté administrateur :

    • gestion des utilisateurs et de leurs rôles,

    • gestion des questions/réponses,

    • gestion des catégories.

Application avec architecture complète et fonctionnalités de base opérationnelles.

Panel administrateur opérationnel pour la gestion du contenu et des utilisateurs.

Architecture technique validée dans le cadre du titre professionnel.

Système évolutif prêt pour l’ajout de nouvelles fonctionnalités.

Vidéo de présentation