Projet de Fin d’Année
Présenté pour validation du 3eme année d’Ingénierie
Informatique et Réseaux
Système de Réservation de Salles de Formation :
Avec Framework Django
Présenté еt soutenu pаr :
RAJEB Mohammmed
EZZAHRAOUI Hoda
MODAKIR Mourad
Dеvаnt lе Jury composé dе :
Pr. Hassna bensag EMSI Encadrante
26 Mai 2025
Table des matières
Introduction Générale :.......................................................................................................... 7
Chapitre 1............................................................................................................................ 8
Présentation de projet ...................................................................................................... 8
Chapitre 2.......................................................................................................................... 11
Conception et analyse.................................................................................................... 11
Chapitre 3.......................................................................................................................... 15
Réalisation de l’application ............................................................................................ 15
Conclusion générale : .......................................................................................................... 20
1
Table des figures
FIGURE 1 DIAGRAMME DE CLASSE............................................................................................................................. 13
FIGURE 2 DIAGRAMME DE CAS D'UTILISATION ............................................................................................................. 14
Table des images
IMAGE 1 PAGE DE LOGIN ....................................................................................................................................... 17
IMAGE 2 PAGE Sign-up ........................................................................................................................................ 17
IMAGE 3 GESTION DES Réservations...................................................................................................................... 18
IMAGE 4 PAGE DE d’accueil..................................................................................................................................... 18
IMAGE 5 PAGE DE Login Django............................................................................................................................ 19
IMAGE 6 Administrateur Django......................................................................................................................... 19
2
Remerciement :
Nous tenons tout d’abord à exprimer notre profonde gratitude à Allah, le Tout-Puissant, pour
la force, la persévérance et la volonté qu’Il nous a accordées tout au long de la réalisation de ce
projet.
Nous adressons nos sincères remerciements à toutes les personnes qui ont, de près ou de loin,
contribué à l’aboutissement de ce travail.
Nous souhaitons particulièrement remercier Mme Hasna BENSAG, notre encadrante, pour sa
disponibilité constante, ses conseils éclairés, sa bienveillance et la confiance qu’elle nous a
accordée durant toute la durée de ce projet. Son accompagnement a été d’une grande valeur
pour nous.
Nos remerciements vont également à l’ensemble des enseignants du département
d’informatique de l’école marocaine des sciences de l’ingénieur à Casablanca, pour la qualité
de leur enseignement et leur accompagnement tout au long de notre parcours académique.
3
Dédicaces :
Je dédie ce mémoire à ma chère sœur Salma Rajeb, dont le soutien, les encouragements et la
bienveillance m’ont été d’un grand réconfort tout au long de ce parcours. Je pense également
avec gratitude à mes amis Anass Kida, Youness Sabaoui, Youssef Khalafto et Abdesslam
Ouazrii, pour leur amitié sincère, leur humour et leur présence constante. Mes remerciements
vont aussi à mon professeur, pour ses conseils éclairés et son accompagnement bienveillant. À
mes parents, que Dieu les protège et leur accorde santé et bonheur, pour leur amour
inconditionnel et leur courage inestimable. À mes frères Zineddine et Mohammed, à ma grand-
mère, et à toute ma famille, pour leur soutien moral et leurs prières. Enfin, je dédie ce travail à
toutes les personnes qui, de près ou de loin, m’ont encouragé, guidé ou soutenu dans la
réalisation de ce mémoire. Merci du fond du cœur.
4
Résumé :
La plateforme de réservation de salles propose une solution complète, intuitive et accessible
pour réserver en ligne des espaces selon les besoins des utilisateurs. Dès leur arrivée sur le site,
les utilisateurs peuvent consulter les disponibilités des salles via un calendrier interactif, filtrer
selon différents critères (capacité, équipements, horaires, etc.) et effectuer une réservation en
quelques clics. Chaque salle dispose d’une fiche descriptive détaillée avec ses caractéristiques
et équipements. Le processus de réservation est simple, rapide et fluide. Un espace personnel
permet à chaque utilisateur de suivre ses réservations, de les modifier ou de les annuler
facilement. L’interface administrateur, quant à elle, permet de gérer les salles, de consulter les
réservations et d’avoir une vue d’ensemble sur l’activité. La plateforme est sécurisée,
responsive et conçue pour offrir une expérience utilisateur optimale sur tous les types d’écrans
(ordinateur, tablette, mobile). Moderne, efficace et évolutive, cette application répond aux
besoins des établissements souhaitant optimiser la gestion de leurs espaces partagés.
Mots clés : Réservation, salle, utilisateur, administrateur, calendrier interactif, Django, React,
application web.
5
Abstract:
The room reservation platform offers a complete, intuitive, and accessible solution for booking
spaces online according to users’ needs. Upon arriving on the site, users can check room
availability through an interactive calendar, filter by various criteria (capacity, equipment,
schedules, etc.), and make a reservation in just a few clicks. Each room has a detailed
descriptive sheet outlining its characteristics and available equipment. The booking process is
simple, fast, and seamless. A personal space allows each user to track their reservations, modify
or cancel them easily. The administrator interface enables room management, reservation
monitoring, and provides an overview of overall activity. The platform is secure, responsive,
and designed to deliver an optimal user experience across all types of devices (desktop, tablet,
mobile). Modern, efficient, and scalable, this application meets the needs of institutions looking
to optimize the management of their shared spaces.
Keywords: Reservation, room, user, administrator, interactive calendar, Django, React, web
application.
6
Introduction Générale :
Dans un contexte où la gestion efficace des ressources est essentielle, les
établissements éducatifs et les entreprises se trouvent confrontés à un besoin croissant
d’organisation et d’optimisation de l’utilisation de leurs espaces, notamment les salles
de réunion, de formation ou d’enseignement. La réservation manuelle ou dispersée de
ces espaces engendre souvent des conflits de disponibilité, une perte de temps et un
manque de visibilité pour les utilisateurs.
Le domaine utilisé est le web (World Wide Web) qui consiste à la conception et la
réalisation des logiciels applicatifs manipulable grâce à un navigateur web. Notre mission
consiste à la création d’un site web pour un système de gestion bancaire.
Ce projet vise à développer une plateforme centralisée de gestion des réservations de
salles, accessible en ligne, permettant aux utilisateurs (étudiants, formateurs, employés,
etc.) de consulter les disponibilités en temps réel, de réserver une salle selon leurs
besoins, et aux administrateurs de gérer efficacement les espaces disponibles. L’objectif
principal est d’offrir un outil intuitif, interactif et automatisé afin d’améliorer la
planification, d’éviter les doublons et de faciliter la gestion quotidienne des salles.
Cette solution repose sur des fonctionnalités clés telles que la création et la modification
des salles, la réservation avec vérification automatique de disponibilité, l’historique des
réservations, ainsi qu’un système de rôles différenciés entre utilisateurs et
administrateurs pour assurer une gestion fluide et sécurisée.
Pour mieux organiser notre projet, on l’a structuré de la manière suivante :
Chapitre I : « Présentation de projet » comporte un aperçu général sur les systèmes
d’information et les différents types d'applications : desktop, mobiles et web, ainsi que le
cycle de vie d’un logiciel.
Chapitre II : « Conception et analyse » comporte la problématique, les objectifs,
analyse et étude de l’existant ainsi que la conception de notre système.
Chapitre III : « Réalisation de l’application » comporte la présentation de
l’environnement dont lequel notre application a été réalisé, les outils utilisés et quelques
interfaces de notre application.
Enfin, nous clôturons ce mémoire par une conclusion générale sur le travail développé
ainsi que quelques perspectives.
7
Chapitre I
Présentation de projet
8
I. Introduction :
De nos jours, l’évolution rapide des technologies web a profondément transformé les
modes d’organisation au sein des établissements éducatifs et des entreprises. Presque
tous les domaines — qu’il s’agisse de l’éducation, des services, ou de l’administration —
intègrent des applications web pour optimiser leurs processus internes.
Parmi ces outils numériques, les plateformes de gestion de réservation en ligne
répondent à un besoin croissant d’organisation, de gain de temps et de transparence.
Elles permettent aux utilisateurs de consulter les disponibilités en temps réel et de
réserver des ressources (comme des salles) de manière simple et rapide.
Dans ce chapitre, nous présenterons les concepts fondamentaux liés au développement
d’une application web de réservation de salles. Nous exposerons également la démarche
méthodologique adoptée pour analyser les besoins, concevoir et développer une
solution adaptée aux attentes des utilisateurs et des administrateurs.
II. Objectif du projet :
L’objectif de ce projet est de concevoir et de développer une application web dédiée à la
gestion des réservations de salles au sein d’un établissement éducatif ou d’une
organisation. Cette plateforme permettra aux différents utilisateurs de consulter les
disponibilités, effectuer des réservations, et gérer l’ensemble des interactions liées à
l’occupation des salles.
Deux types d’utilisateurs sont distingués :
• Les administrateurs, qui auront la possibilité d’ajouter, modifier ou supprimer
des salles, de configurer leurs équipements, ainsi que de consulter et valider les
réservations effectuées par les utilisateurs.
• Les utilisateurs (étudiants, formateurs, employés, etc.), qui pourront réserver des
salles en ligne via un calendrier interactif, consulter leurs historiques de
réservation, ainsi qu’annuler ou modifier une réservation selon les règles définies
(par exemple, jusqu’à 24h avant la date prévue).
L’ensemble du projet sera développé à l’aide du Framework Django pour le backend, afin
de garantir une structure robuste, une bonne gestion des données, et une interface fiable
côté serveur. Le frontend sera réalisé avec React, permettant d’offrir une interface
utilisateur dynamique, moderne et réactive répondant aux besoins identifiés.
9
III. Spécifications fonctionnelles :
L'application de gestion de réservation de salles comprend un ensemble de spécifications
fonctionnelles essentielles. Elle intègre un système d'authentification des utilisateurs,
permettant la création de compte via un formulaire React, la connexion sécurisée par
mot de passe, ainsi que la déconnexion. La gestion des salles, réservée à l’administrateur,
inclut l’ajout de nouvelles salles avec des informations détaillées telles que le nom, la
capacité d’accueil, les équipements disponibles (Wi-Fi, vidéoprojecteur, tableau blanc,
etc.) et les horaires d’ouverture et de fermeture. L’administrateur peut également modifier
ou supprimer les salles existantes.
La réservation de salles se fait en ligne, avec une validation automatique en fonction de
la disponibilité. Chaque utilisateur dispose d’un espace personnel lui donnant accès à
un tableau de bord récapitulant ses réservations actuelles, avec la possibilité d’annuler
une réservation si nécessaire. Du côté administratif, un espace de gestion permet à
l’administrateur de consulter la liste des salles, des utilisateurs, ainsi que les réservations
en cours ou passées.
Enfin, l’interface utilisateur, développée avec React, offre une expérience fluide et
interactive, avec des formulaires dynamiques, un affichage visuel du calendrier de
réservation et une navigation simplifiée entre les différentes pages de l’application.
10
Chapitre II
Conception et analyse
11
I. Définition :
La conception et l’analyse constituent une phase essentielle dans tout processus de
développement logiciel. Cette étape intervient en amont de l’implémentation et vise à
étudier, structurer et formaliser les besoins du client ou des utilisateurs finaux. L’objectif
principal est de garantir que le système à développer réponde de manière précise et fiable
aux attentes fonctionnelles et opérationnelles exprimées.
L’analyse permet de recueillir les exigences, de comprendre les processus métiers
existants, d’identifier les acteurs du système, leurs interactions et les contraintes
techniques ou organisationnelles. Elle aboutit à une description claire du "quoi faire".
La conception, quant à elle, transforme ces exigences en une architecture logique et
technique du système, définissant le "comment le faire". Cela passe par la modélisation
des entités, des flux de données, des interactions utilisateur-système, et parfois même
des interfaces graphiques. Elle peut s’appuyer sur des outils comme les diagrammes UML
(cas d’utilisation, classes, séquences), des maquettes fonctionnelles, ou encore des
spécifications détaillées.
II. Analyse :
Dans cette phase on va pouvoir d’identifier les acteurs et leurs rôles.
Identification des acteurs :
Un acteur est un utilisateur qui interagit avec un système. Un acteur peut être une
personne, une organisation ou un système externe qui interagit avec l’application ou le
système lui-même. Dans notre cas on distingue deux types d’acteurs :
• Administrateur : qui détient tous les droits et peut accéder à toutes les
fonctionnalités de l’application.
• Utilisateur (étudiants, formateurs, employés, etc.) : celui qui effectue toutes les
transactions possibles après avoir obtenu son propre compte.
III. Conception :
Dans cette phase on va pouvoir utiliser un langage de modélisation de UML a fin de facilite
la réalisation :
12
Définition UML :
Ce chapitre présente les différents diagrammes UML intervenus dans le développement
de notre application. Le langage de modélisation UML (Unified Modeling Language) est
celui qui a été choisi en raison de la place prépondérante qu’elle occupe dans le génie
logiciel. En effet, UML est le langage consensuel qui est adopté dans la plupart des
projets de construction de système logiciel. C’est une notation graphique destinée à la
création de modèles orientés objet en vue de conception et de l’analyse des systèmes.
Les différents diagrammes utilisés sont : les diagrammes de classes, les diagrammes de
cas d’utilisation.
1. Diagramme de classe :
Il s’agit d’une vue statique du système, autrement dit, les concepts du domaine qui seront
manipulés à l’intérieur du système et leurs relations les uns aux autres. Le diagramme de
classes est le diagramme le plus important dans une conception orientée objet. Alors que
le diagramme de cas d’utilisation montre le système du point de vue des acteurs, le
diagramme de classes en montre la structure interne. La figure ci-dessous représente le
diagramme classe de notre système. Il est réalisé avec l’outil StarUML :
Figure 1 : Diagramme de classe.
13
2. Diagramme de cas d’utilisation :
C’est le rôle des diagrammes de cas d’utilisation que de permettre l’expression des
besoins de l’utilisateur de façon beaucoup plus simple. Ils permettent de recenser les
principales fonctionnalités du système. Les diagrammes de cas d’utilisation sont
composés d’acteurs et de cas d’utilisation. Un acteur est un utilisateur, humain ou non,
du système qui est doté d’un nom qui correspond à son rôle. Un cas d’utilisation est une
manière spécifique d’utiliser le système. Il permet de décrire ce que le futur système
devra faire, sans spécifier comment il le fera. Le diagramme ci-dessous représente les
différents cas d’utilisation de notre système. Il a été réalisé avec l’outil StarUML.
Figure 2 : Diagramme de cas d'utilisation.
14
Chapitre III
Réalisation de l’application
15
I. Architecture technique :
StarUML est un logiciel de modélisation UML, qui a été « cédé
comme open source » par son éditeur, à la fin de son exploitation
commerciale, sous une licence modifiée de GNU GPL
Django est un Framework open-source de développement web en
Python. Il a pour but de rendre le développement web 2.0 simple et
rapide.
Python est un langage de programmation objet impérative
structurée, fonctionnelle et orientée objet. Il est doté d’un typage
dynamique fort, d’une gestion automatique de la mémoire par
ramasse-miettes et d’un système de gestion.
React est une bibliothèque JavaScript développée par Facebook
permettant de créer des interfaces web interactives et dynamiques
en se basant sur des composants réutilisables. Elle facilite la mise à
jour de l’interface en temps réel grâce à un DOM virtuel.
JSX (JavaScript XML) est une extension de syntaxe utilisée avec
React qui permet d’écrire du HTML directement dans du javaScript.
Elle rend le code plus lisible et proche de la structure réelle de
l’interface.
16
II. Implémentation et Réalisation :
1. Page de login :
Pour les raisons de sécurité il est indispensable d’ajouter une couche de sécurité dans
l’application :
Figure 1 : Page de login.
2. Page de sign-up :
La page d'inscription (Sign Up) permet à l’utilisateur de créer un compte en saisissant ses
informations personnelles telles que le nom, l’email et le mot de passe. Une fois le
formulaire validé, le compte est enregistré et l’utilisateur peut accéder à la plateforme.
Figure 2 : Page de sign-up.
17
3. Page d’accueil :
La page d’accueil ou page d’entrée elle représente l’image principale de notre
application :
Figure 3 : Page d’accueil.
4. Page pour la réservation :
La page de réservation permet à l’utilisateur de choisir une salle disponible via un
calendrier interactif. Il sélectionne la date, l’heure et la salle souhaitée, puis valide sa
réservation en quelques clics. Une confirmation lui est ensuite affichée.
Figure 4 : Gestion de réservation.
18
5. Pages de Login d’administrateur sur Django :
La page de connexion Django Admin permet aux administrateurs du site de s’authentifier
à l’aide de leur nom d’utilisateur et mot de passe. Une fois connectés, ils accèdent à une
interface d’administration sécurisée pour gérer les données du site.
Figure 5 : Page de login sur Django.
6. Page accueil D’administrateur sur Django
La page d’accueil de l’administration Django (après connexion) affiche un tableau de bord
centralisé où l’administrateur peut visualiser et gérer les différentes sections du site
(utilisateurs, salles, réservations, etc.) via une interface claire et structurée.
Figure 6 : Page d’accueil D’administrateur sur Django.
19
II. Conclusion générale et Perspectives :
Ce projet de fin de module a porté sur la conception et le développement d’une
application web de réservation de salles, visant à faciliter l’organisation des espaces
partagés au sein d’un établissement. L’application permet aux utilisateurs de consulter
les disponibilités des salles, d’effectuer des réservations en ligne, et aux administrateurs
de gérer les salles et de suivre les réservations en toute simplicité.
Le projet s’appuie sur une architecture moderne combinant Django pour la gestion du
backend et React pour l’interface utilisateur, permettant une expérience fluide et
réactive. Ce travail m’a permis de mettre en pratique les notions abordées en cours, de
renforcer mes compétences techniques en développement web, mais aussi de mieux
comprendre les étapes clés d’un projet logiciel : analyse, modélisation, conception et
implémentation.
Les objectifs pédagogiques fixés au début du module ont été atteints, et cette expérience
m’a également permis d’identifier des pistes d’amélioration telles que l’intégration d’un
système de notification, une gestion avancée des rôles ou encore le développement
d’une version mobile.
Perspectives :
Dans une logique d’évolution continue, plusieurs améliorations fonctionnelles peuvent
être envisagées afin d’optimiser l’expérience utilisateur et d’enrichir les capacités de la
plateforme. Parmi les évolutions les plus pertinentes, on peut envisager l’intégration d’un
système de notifications (par e-mail ou in-app) permettant aux utilisateurs d’être
informés en temps réel lors de la validation, l’annulation ou la modification d’une
réservation. Le développement d’une version mobile responsive ou d’une application
native serait également un atout majeur pour renforcer l’accessibilité et la flexibilité du
service. D’autres fonctionnalités pourraient venir compléter le système, telles que la
gestion des conflits de réservation en temps réel, la réinitialisation de mot de passe, la
génération de rapports statistiques pour les administrateurs, ou encore la possibilité de
télécharger ou imprimer un récapitulatif de réservation. Ces améliorations offriraient une
solution plus complète, évolutive et parfaitement adaptée aux besoins d’un
environnement professionnel ou académique.
20