Application web de planning avec gestion de formateurs

Le contexte du projet

Un centre de formation avait besoin d'une solution plus adaptée à ses méthodes de travail pour gérer son planning. Auparavant, un fichier Excel stocké sur le PC d'une assistante de gestion était l'outil officiel de gestion de planning, ce qui rendait la collaboration difficile et présentait plusieurs limitations :

• L'accès au planning était limité à un seul poste de travail

• Les modifications n'étaient pas tracées

• Le risque de perte ou de corruption des données était élevé

• La visualisation et les modifications étaient peu intuitives

La solution technique

L'application web a été développée avec les technologies suivantes :

Frontend

• React.js comme framework principal, choisi pour sa flexibilité et sa gestion efficace du state management

• Next.js en surcouche, apportant des fonctionnalités essentielles comme :

  • Le routing optimisé

  • Le server-side rendering pour de meilleures performances

  • Une structure de projet organisée

• Utilisation de composants réutilisables pour une maintenance facilitée

• Interface responsive adaptée à différentes tailles d'écran

Backend et Base de données

• Base de données SQL hébergée localement, garantissant :

  • Une structure relationnelle adaptée aux liens entre formateurs et événements

  • La cohérence des données

  • Des requêtes optimisées pour la gestion du planning

• API REST pour la communication entre le frontend et la base de données

Architecture et Organisation

• Structure MVC (Model-View-Controller) pour une séparation claire des responsabilités

• Système de gestion d'état centralisé pour les données du planning

• Mise en place de composants réutilisables pour :

  • Le calendrier interactif

  • Les formulaires de création/édition

  • Le système de drag & drop

  • Le sélecteur de couleurs

Cette architecture technique permet d'assurer :

• Une expérience utilisateur fluide

• Des performances optimales même avec de nombreux événements

• Une maintenance facilitée grâce à la modularité du code

• Une évolutivité simple pour ajouts futurs de fonctionnalités

Fonctionnalités principales

Gestion intuitive du planning La vue principale de l'application se présente sous forme d'un calendrier interactif offrant une vision claire des emplois du temps de chaque formateur. L'interface épurée permet une prise en main rapide par les utilisateurs, même les moins techniques. La navigation entre les mois se fait de manière fluide et intuitive.

Création et gestion des événements L'ajout d'un événement au planning se fait en quelques clics via un formulaire ergonomique. Chaque événement peut être :

• Programmé sur une ou plusieurs journées

• Associé à un formateur spécifique

• Catégorisé par type (formation, réunion, congés, etc.)

• Personnalisé avec une couleur distinctive

• Modifié ou supprimé facilement

Système de drag & drop Une des fonctionnalités phares de l'application est la possibilité de déplacer les événements par simple glisser-déposer. Ce système permet de :

• Réaffecter un événement à un autre formateur

• Modifier les dates d'un événement

• Ajuster rapidement le planning en cas d'imprévu

Gestion des formateurs Un module dédié permet d'administrer l'équipe de formateurs avec la possibilité de :

• Ajouter de nouveaux formateurs

• Modifier leurs informations

• Gérer leur disponibilité

• Visualiser leur charge de travail

Personnalisation des types d'événements L'application offre une grande flexibilité dans la catégorisation des événements :

• Création de types d'événements personnalisés

• Sélection de couleurs via une roue chromatique

• Attribution automatique des couleurs dans le planning

• Organisation visuelle claire grâce au code couleur

Export et partage Pour faciliter la communication avec l'équipe, le planning peut être :

• Consulté en temps réel par tous les utilisateurs autorisés

• Filtré par formateur ou par type d'événement

• Partagé avec les parties prenantes concernées

• Envoi par mail du planning individuel à chaque formateur