Réalisation d’une
Application Web
Projet : bus management systeme – S5
2024/2025
Realiser par :
Nada Tayebi & Hajar Bouhali
Remerciements
Nous souhaitons exprimer notre gratitude à M. Idrais pour l'opportunité qui nous a été donnée de
travailler sur ce projet, cela a représenté pour nous une excellente occasion de développer nos
compétences, d’explorer de nouvelles méthodologies et d’acquérir une expérience précieuse dans la
gestion et la réalisation d’un projet de cette envergure.
Son initiative de nous assigner ce projet a joué un rôle clé en nous motivant à repousser nos limites et à
mettre en œuvre des solutions innovantes pour répondre aux besoins identifiés. Cela a également renforcé
notre autonomie et notre capacité à prendre des décisions critiques dans un contexte de développement
informatique.
Nous le remercions chaleureusement pour cette expérience formatrice, qui a contribué à notre progression
académique et professionnelle.
3
Table des Matières
Remerciements ....................................................................................................................................................................... 3
Introduction ............................................................................................................................................................................. 5
I. Présentation du Projet ............................................................................................................................................ 6
A. Contexte ..................................................................................................................................................................... 6
B. Cahier des charges................................................................................................................................................... 7
II. Avancement ............................................................................................................................................................13
A. fonctionnalités des acteurs: .................................................................................................................................13
B. Base de données ....................................................................................................................................................13
C. Maquette Visuelle .................................................................................................................................................21
III. Travaux effectuées .......................................................................................................................................................33
A. Taches ......................................................................................................................................................................33
4
Introduction
Dans le cadre de nos études, nous avons eu l’opportunité de travailler sur un projet intitulé "Gestion
des bus", visant à concevoir une application complète facilitant la gestion des trajets, des
abonnements, et des informations liées aux utilisateurs et aux stations. Ce projet, réalisé sur une
période d’un mois, a mobilisé nos compétences techniques et notre capacité à collaborer efficacement
pour atteindre nos objectifs.
Le projet a été mené par notre binôme composé de Nada Tayebi et Hajar Bouhali, chacune
apportant ses compétences et sa créativité pour développer une solution utile et fonctionnelle. Nous
avons eu la liberté d’organiser notre travail tout en respectant les délais, ce qui nous a permis
d’approfondir nos connaissances en développement web et en conception d’applications.
L’objectif principal de ce projet est de fournir un outil digitalisé aux entreprises ou collectivités qui
gèrent les bus, afin d’améliorer leur efficacité opérationnelle et de simplifier l’expérience utilisateur.
Grâce à cette application, les administrateurs peuvent superviser les trajets, les abonnements et les
stations, tandis que les utilisateurs ont accès à des fonctionnalités telles que la recherche de trajets, la
soumission de demandes d’abonnement et la visualisation d’informations détaillées.
Ce rapport détaille le contexte, les enjeux, ainsi que les étapes de conception et de réalisation du
projet. Il met également en lumière les défis rencontrés et les perspectives futures pour l’amélioration
de cette solution.
5
I. Présentation du Projet
A. Contexte
Le secteur du transport urbain connaît une croissance rapide, entraînant des besoins croissants en termes
d'organisation et de gestion. Dans de nombreuses entreprises de transport, la gestion des trajets, des
abonnements et des ressources repose encore sur des systèmes manuels ou obsolètes. Cela entraîne une
perte de temps, des inefficacités dans les opérations et une insatisfaction des passagers.
Face à ces défis, le projet "Gestion des bus" a été conçu pour moderniser et digitaliser la gestion des
transports.
Il vise à fournir une solution numérique qui :
• Centralise les données relatives aux trajets, bus et abonnements.
• Améliore l'expérience des utilisateurs grâce à des fonctionnalités intuitives et accessibles.
• Simplifie la supervision des chauffeurs et des stations pour les administrateurs.
6
B. Cahier des charges
Le projet "Gestion des Bus" vise à fournir une solution numérique pour la gestion efficace des
trajets, abonnements et ressources liés au transport urbain. Destinée à être utilisée par les
administrateurs et les utilisateurs finaux (passagers), cette application facilite la planification, la
supervision et l’accès aux informations essentielles liées aux bus. Ce projet repose sur l’utilisation
de technologies modernes pour assurer des performances optimales et une expérience utilisateur
fluide.
1. Fonctionnalités de l’application
A. Interfaces proposées
L’application se compose de deux principales interfaces :
1. Interface administrateur : Une interface web intuitive permettant de gérer tous les aspects du
système (trajets, abonnements, stations, chauffeurs, etc.).
2. Interface utilisateur : Une interface dédiée aux passagers pour rechercher des trajets, consulter les
informations sur les bus et soumettre des demandes d’abonnement.
B. Fonctionnalités côté administrateur
1. Gestion des trajets :
o Ajouter de nouveaux trajets avec les détails des stations (départ, arrivée et arrêts
intermédiaires).
o Modifier ou supprimer des trajets existants.
o Associer des bus spécifiques aux trajets.
2. Gestion des abonnements :
o Recevoir, examiner et valider les demandes de cartes d’abonnement.
o Rejeter des demandes en précisant les raisons.
o Suivre les abonnements actifs (hebdomadaire, mensuel, annuel).
3. Supervision des chauffeurs et stations :
o Suivre les activités des chauffeurs (horaires, trajets assignés).
o Ajouter ou modifier des stations de bus.
4. Génération de rapports et analyses :
7
o Générer des statistiques sur l’utilisation des bus et les demandes d’abonnements.
o Analyser les trajets les plus utilisés pour optimiser les services.
5. Gestion des utilisateurs :
o Gérer les comptes des utilisateurs et leur accès.
o Suivre les activités des utilisateurs sur la plateforme.
C. Fonctionnalités côté utilisateur
1. Recherche de trajets :
o Saisir une station de départ et une station d’arrivée pour afficher les trajets disponibles.
o Consulter les informations des trajets (horaires, arrêts intermédiaires, noms des bus).
2. Demande de cartes d’abonnement :
o Remplir un formulaire de demande pour les différents types de cartes (hebdomadaire,
mensuelle, annuelle).
o Suivre l’état de leur demande (en attente, validée, rejetée).
3. Visualisation des informations :
o Accéder aux détails des trajets.
o Consulter les informations sur les bus et leurs horaires en temps réel.
2. Contraintes techniques
A. Technologies utilisées
Pour garantir la robustesse et la scalabilité du projet, nous avons utilisé :
• Backend :
o Framework : CodeIgniter 4.5.
o Langage : PHP 8.2.
o Gestion de base de données : MySQL.
• Frontend :
o Framework CSS : Tailwind CSS pour une conception moderne et réactive.
o Langage : HTML5, JavaScript .
• Serveur de développement :
o XAMPP pour un environnement local avec Apache et MySQL.
8
B. Performance et sécurité
1. Performance :
o Temps de réponse optimisé pour les recherches de trajets.
o Prise en charge simultanée de plusieurs utilisateurs sans ralentissement.
2. Sécurité :
o Authentification sécurisée pour les administrateurs et les utilisateurs.
o Protection des données personnelles via le cryptage (mot de passe, informations sensibles).
3. Solutions techniques mises en œuvre
A. Développement des interfaces
1. Les interfaces ont été conçues en HTML5/CSS3 avec l’utilisation de Tailwind CSS pour garantir une
expérience utilisateur fluide et adaptée à différents appareils (responsive design).
2. Les formulaires interactifs permettent à l’administrateur et aux utilisateurs de réaliser facilement
leurs tâches. Ces formulaires envoient des requêtes SQL via le backend (CodeIgniter) pour effectuer
des opérations sur la base de données.
B. Authentification
1. Un système d’authentification robuste a été mis en place
2. Les mots de passe sont stockés de manière sécurisée (hachage cryptographique).
4. Langages et outils utilisés
Langages de programmation :
• HTML5/CSS3 : Pour la structure et le design des interfaces.
• JavaScript : Pour la logique côté client (validation des formulaires, interactivité).
9
• PHP : Pour le backend, utilisé avec CodeIgniter pour la gestion des requêtes serveur.
• SQL : Pour les opérations sur la base de données MySQL.
Outils et logiciels :
10
• XAMPP : Plateforme de développement pour tester le projet localement.
• Apache : Serveur web intégré à XAMPP.
• CodeIgniter 4.5 : Framework PHP utilisé pour le développement rapide et organisé.
11
• Tailwind CSS : Framework CSS pour un design moderne.
• Visual Studio Code : Outils pour l’édition de code.
• phpMyAdmin : Interface pour la gestion de la base de données.
5. Objectifs à long terme
1. Étendre les fonctionnalités de l’application pour inclure la réservation de billets en ligne.
2. Intégrer des systèmes de suivi GPS en temps réel pour les bus.
3. Créer une application mobile complémentaire pour une accessibilité accru
12
II. Avancement
A. fonctionnalités des acteurs:
Le diagramme de cas d’utilisation de notre projet représente les différentes interactions entre les acteurs
et les fonctionnalités principales du système. Les acteurs incluent l’utilisateur, l’administrateur, et les
chauffeurs, chacun ayant des rôles distincts. Pour l’utilisateur, les cas d’utilisation couvrent des
fonctionnalités telles que la recherche des lignes de bus, la visualisation des trajets et stations, et la
soumission de demandes de cartes d’abonnement via un formulaire. L’administrateur, quant à lui, a accès
à des cas d’utilisation comme la gestion des trajets, des chauffeurs, des utilisateurs, des bus, ainsi que le
traitement et le suivi des demandes de cartes. Ce diagramme met en évidence les interactions clés et
simplifie la compréhension globale des fonctionnalités et des responsabilités de chaque acteur dans le
système.
B. Base de données
Nous avons tout d’abord réalisé une étude préliminaire. Nous avons analysé les besoins de chaque
utilisateur. Suite à cette analyse, nous avons établi notre diagramme de classes.
Il a pour but de décrire les structures des objets, des informations utilisées par notre application et
les relations entre elles
13
Figure 12 : Diagramme de classes
14
La base de données est réalisée avec phpMyAdmin, nous proposons une architecture avec 10
tables qui répondent, selon nous, à tous les besoins de ce projet (nous pouvons modifier cette base
de données si besoin).
Figure 13 : Tables de la base de données
Nous pouvons voir ci-dessus l’ensemble des tables de la base de données. Nous allons maintenant
vous les présenter sous forme détaillée.
Figure 14 : Table admin
Admin : Cette table est utilisée pour stocker les informations des administrateurs du système.
Chaque administrateur possède un identifiant unique (clé primaire) ainsi que son nom, prénom,
adresse email et mot de passe. Ces informations sont essentielles pour la gestion des utilisateurs du
système
15
Figure 15 : Table Bus
Bus : Cette table contient les détails des bus. Chaque bus a un identifiant unique (clé primaire), un numéro
d'immatriculation, une marque et une capacité. Ces informations sont importantes pour la gestion des
véhicules affectés aux trajets.
Figure 16 : Table CarteRéduction
CarteRéduction : Cette table stocke les informations sur les différents types de cartes de réduction
disponibles, telles que pour les étudiants, les seniors, les militaires et les professeurs. Chaque type de carte
est associé à un pourcentage de réduction. Ces données sont utilisées pour appliquer les réductions
appropriées lors de la demande de cartes.
16
Figure 17 : Table CartesDemandées
CartesDemandées : Cette table contient les demandes de cartes de réduction faites par les utilisateurs.
Chaque demande est liée à un utilisateur (nom, email), au type de carte demandée (étudiant, senior, etc.),
et comprend un message et des documents éventuels. Cela permet à l'administrateur de suivre et traiter les
demandes de cartes.
Figure 18 : Table Chauffeur
Chauffeur : Cette table répertorie les chauffeurs de bus, avec un identifiant unique pour chaque chauffeur (clé
primaire), ainsi que leur nom, prénom, numéro de téléphone, adresse email et numéro de permis de conduire.
Ces informations permettent de gérer les chauffeurs affectés aux différents trajets.
17
Figure 19 : Table Horaire
Horaire : Cette table contient les horaires des passages des bus à différentes stations. Chaque
horaire est lié à un trajet et à une station spécifique, avec l'heure exacte du passage. Ces
informations sont essentielles pour la gestion des trajets et pour informer les utilisateurs des
horaires de bus.
Figure 20 : Table Station
Station : Cette table répertorie les stations desservies par les bus. Chaque station a un identifiant unique, un
nom et une adresse. Ces données permettent de gérer les lieux de passage des bus et de planifier les trajets.
18
Figure 21 : Table Trajet
Trajet : Cette table contient les trajets effectués par les bus entre les différentes stations. Chaque
trajet a un identifiant unique, un nom et est associé à un bus spécifique. Cela permet de savoir quel
bus effectue quel trajet.
Figure 22 : Table TrajetStation
TrajetStation : Cette table relie les trajets aux stations. Chaque entrée spécifie un trajet, une station
et l'ordre de passage de la station dans ce trajet. Ces informations permettent de déterminer le
parcours exact d'un bus et l'ordre dans lequel les stations sont desservies.
Figure 23 : Table utilisateurs
Utilisateurs :contient des informations sur les utilisateurs du système, incluant leur nom, prénom,
email et mot de passe. Elle gère différents rôles tels qu'admin, chauffeur, ou passager. Chaque
utilisateur est identifié de manière unique par un id. La table suit également des timestamps pour la
création et la mise à jour des informations
19
Ces 10 tables et leurs structures nous semblent le minimum requis pour répondre aux besoins des différents
utilisateurs dans le cadre de la gestion des bus. Nous avons envisagé, selon l'avancement du projet, la
possibilité d'ajouter des tables et des champs dans les tables existantes pour intégrer des fonctionnalités
supplémentaires, telles que le suivi des trajets, l'optimisation des horaires, ou encore la gestion des passagers
et des conducteurs. Cela permettrait d’améliorer l’expérience utilisateur et de répondre de manière plus
précise aux divers besoins de gestion des déplacements et des ressources.
20
C. Maquette Visuelle
21
Après la réalisation de la base de données, nous avons commencé à réfléchir sur une maquette de
l'application. Nous voulions vous présenter les différentes interfaces utilisateurs. A travers ces
interfaces, vous pourrez voir la disposition des différentes rubriques et les informations utiles à
chaque utilisateur. Nous devions proposer une application web facile d’utilisation avec un
environnement conviviale.
Figure 23 : Interface users
L'interface "Espace Utilisateur" de notre application est conçue pour offrir une expérience simple et
intuitive pour les usagers souhaitant planifier leurs trajets en bus. Dès leur connexion, les utilisateurs
peuvent entrer facilement leur station de départ et de destination dans les champs appropriés. Une fois ces
informations soumises, le système leur fournit un résultat détaillé indiquant le bus le plus adapté à leur
itinéraire, incluant l'heure de départ, l'itinéraire, ainsi que les arrêts intermédiaires. Cette interface permet
ainsi aux utilisateurs de visualiser rapidement le trajet qui leur convient, simplifiant ainsi la gestion de
leurs déplacements. De plus, des filtres supplémentaires pourraient être ajoutés pour affiner les résultats
selon les horaires, les types de bus ou la disponibilité en temps réel.
22
Figure 27 : Moteur de recherche
Dans la partie "Interface Utilisateur" de notre application, les utilisateurs peuvent facilement accéder aux
lignes de bus, aux trajets, et aux stations grâce à une fonctionnalité de recherche en temps réel. Ils
disposent d'un champ de recherche intuitif où ils peuvent saisir des informations telles que la ligne de bus,
le nom de la station ou un itinéraire spécifique. Dès qu'ils commencent à taper, les résultats s'affichent
instantanément, permettant de trouver rapidement les trajets, les stations et les informations pertinentes
liées aux bus. Cette fonctionnalité de recherche dynamique offre une expérience fluide et rapide pour les
utilisateurs, leur permettant d'obtenir les informations dont ils ont besoin sans délai.
23
24
Dans l'espace utilisateur de notre application, les utilisateurs ont la possibilité d'envoyer une demande de
carte d'abonnement directement depuis leur compte. Ils peuvent accéder à une section dédiée où sont
clairement affichés les prérequis nécessaires pour obtenir la carte, tels que l'âge, le type de transport
souhaité, ou toute autre condition spécifique.
Une fois les informations consultées, un formulaire est mis à disposition, dans lequel l'utilisateur peut
remplir les champs requis avec ses données personnelles, comme son nom, prénom, adresse, et toute autre
information pertinente. Ce processus simplifié permet de soumettre facilement une demande de carte
d'abonnement, tout en s'assurant que toutes les informations nécessaires sont fournies pour traiter la
demande rapidement.
25
Espace d'authentification des utilisateurs
Dans l'application, l'espace d'authentification des utilisateurs permet à chaque individu de se connecter à
son compte personnel. Cet espace comprend un formulaire de connexion où l'utilisateur entre son nom
d'utilisateur et son mot de passe. Une fois ces informations vérifiées, l'utilisateur est redirigé vers son
tableau de bord, où il peut gérer ses informations personnelles, soumettre une demande de carte
d'abonnement, consulter les trajets disponibles, et interagir avec d'autres fonctionnalités de l'application.
Pour garantir la sécurité des données, des mécanismes de validation tels que la gestion des sessions et la
possibilité de réinitialiser son mot de passe sont également disponibles. L'authentification est essentielle
pour assurer que seules les personnes autorisées accèdent à des informations et services spécifiques.
26
Espace d'authentification de l'admin
L'espace d'authentification pour les administrateurs est similaire à celui des utilisateurs, mais avec des
privilèges et accès différents. Les administrateurs doivent se connecter à un espace dédié via un
formulaire d'authentification sécurisé où ils entrent leur identifiant et leur mot de passe.
Une fois connectés, les administrateurs ont un accès complet aux fonctionnalités d'administration, telles
que la gestion des utilisateurs, la validation des demandes de cartes d'abonnement, la consultation des
statistiques de transport, la gestion des trajets et des lignes de bus, et bien plus. L'authentification de
l'administrateur est essentielle pour assurer que seuls les utilisateurs autorisés peuvent effectuer des
actions critiques sur le système, garantissant ainsi la sécurité et la confidentialité des données de
l'application.
27
Espace Admin : Vue d'ensemble des Interfaces
L'espace administrateur (admin) de l'application permet une gestion complète des différents aspects du
système de transport, offrant des interfaces dédiées pour gérer les trajets, les chauffeurs, les utilisateurs,
les bus, les cartes d'abonnement et leurs demandes, ainsi que les paramètres de l'administrateur.
5. Interface des cartes d'abonnement et demandes de carte
Dans cette interface, l'administrateur peut gérer les demandes de cartes d'abonnement soumises par les
utilisateurs. Cela inclut la validation des demandes, l'attribution de cartes d'abonnement, et la gestion des
informations relatives aux cartes (durée, types de carte, etc.). L'administrateur peut également examiner
les demandes en attente et approuver ou refuser l'octroi d'abonnements en fonction des critères définis.
28
1. Interface des trajets
Dans cette section, l'administrateur peut consulter et gérer tous les trajets de bus disponibles dans le
système. Cela inclut la visualisation des détails des trajets, tels que les stations de départ et d'arrivée, les
horaires, et les itinéraires. L'administrateur peut également ajouter, modifier ou supprimer des trajets en
fonction des besoins de l'entreprise.
29
2. Interface des chauffeurs
L'interface des chauffeurs permet à l'administrateur de visualiser et de gérer les informations relatives aux
chauffeurs. Cela inclut la consultation des profils des chauffeurs, leur affectation aux différents trajets et
la gestion des horaires de travail. L'administrateur peut aussi mettre à jour les informations concernant les
chauffeurs et s'assurer que tous les chauffeurs sont affectés aux bonnes lignes et sont en conformité avec
les exigences de sécurité et les réglementations.
30
4. Interface des buses
L'interface des buses permet à l'administrateur de gérer la flotte de véhicules (bus) utilisés dans le
transport. L'administrateur peut consulter les détails de chaque bus, tels que les numéros
d'immatriculation, les disponibilités, les maintenances programmées, et les affectations de bus aux
différents trajets. Cette interface est cruciale pour garantir que la flotte de bus fonctionne efficacement et
que les trajets sont toujours couverts par des véhicules adaptés.
31
6. Interface des paramètres de l'administrateur (Settings)
Cette interface permet à l'administrateur de configurer et personnaliser les paramètres de l'application.
Cela inclut la gestion des utilisateurs admin (création, modification ou suppression de comptes admin), la
configuration des notifications, les options de sécurité, les politiques de confidentialité et la
personnalisation des fonctionnalités du système. L'administrateur peut aussi ajuster les paramètres relatifs
aux trajets, chauffeurs, bus et abonnements pour adapter l'application à l'évolution des besoins du système
de transport.
32
III. Travaux effectuées
A. Taches
Dans le cadre du projet Bus Management, plusieurs travaux ont été réalisés afin de créer une application
complète et fonctionnelle permettant de gérer le système de transport en commun. Voici un aperçu des
principales tâches effectuées :
1. Conception de la base de données :
o Création des tables nécessaires pour la gestion des trajets, des utilisateurs, des chauffeurs,
des bus, des cartes d’abonnement et des demandes de carte.
o Définition des relations entre les différentes tables pour assurer l'intégrité des données et
leur accessibilité.
o Implémentation de requêtes SQL pour la gestion en temps réel des informations liées aux
trajets, aux utilisateurs, et aux cartes.
2. Développement de l’interface utilisateur (User Interface) :
o Conception de l’interface utilisateur intuitive pour la recherche de trajets, la consultation des
horaires de bus et la gestion des demandes de cartes d’abonnement.
o Mise en place d'un système de recherche en temps réel pour permettre aux utilisateurs de
trouver rapidement les trajets qui les concernent.
o Développement de l’interface de soumission des demandes de cartes d’abonnement, avec la
possibilité de voir les prérequis et remplir les informations nécessaires.
3. Création de l’espace utilisateur :
o Mise en place d’un espace où les utilisateurs peuvent saisir les stations de départ et d’arrivée
pour trouver les trajets adaptés.
o Ajout d’une fonctionnalité permettant aux utilisateurs de consulter les bus disponibles et
leurs horaires en fonction des informations saisies.
4. Développement de l’espace administrateur :
o Création d’un espace dédié à l’administration du système, permettant de gérer les trajets, les
chauffeurs, les utilisateurs et les bus.
o Intégration de la gestion des cartes d’abonnement et des demandes associées, avec la
possibilité d'approuver ou de refuser les demandes en fonction des critères définis.
33
o Développement d’une interface de paramétrage permettant de gérer les paramètres globaux
de l'application (notifications, paramètres de sécurité, gestion des comptes admin).
5. Mise en place de l’authentification :
o Implémentation de systèmes d’authentification pour les utilisateurs et les administrateurs,
garantissant un accès sécurisé à l’application.
o Création de formulaires d'inscription et de connexion pour les utilisateurs et les
administrateurs.
6. Tests et validation des fonctionnalités :
o Réalisation de tests unitaires pour vérifier le bon fonctionnement de chaque fonctionnalité
(recherche de trajets, gestion des cartes, création de profils utilisateurs).
o Tests d'intégration pour s’assurer que toutes les différentes parties de l’application
fonctionnent de manière fluide ensemble.
o Tests d'interface pour valider l’ergonomie et l'intuitivité de l'application.
34
Conclusion
Le projet Bus Management a permis de créer une solution complète et fonctionnelle pour la gestion des
trajets de bus, des utilisateurs, des chauffeurs, et des cartes d'abonnement. Grâce à une base de données
bien structurée et des interfaces utilisateurs et administrateurs intuitives, nous avons pu répondre aux
besoins essentiels des deux types d'utilisateurs de l'application.
L'application permet aux utilisateurs de facilement rechercher leurs trajets, consulter les horaires de bus, et
soumettre des demandes de cartes d’abonnement, tout en offrant aux administrateurs une interface dédiée
pour la gestion des trajets, des chauffeurs, des demandes et des paramètres globaux.
Le système d'authentification mis en place garantit une sécurité optimale, tandis que les tests effectués
assurent la stabilité et la performance de l'application. En somme, ce projet a permis de répondre aux
exigences de gestion du transport en commun tout en mettant en place une infrastructure évolutive,
capable d’intégrer de futures améliorations.
35
36