Académique Documents
Professionnel Documents
Culture Documents
* A Ma chère famille
A mes très chers parents qui ont toujours été là pour moi, et qui
m'ont donné un
Magnifique modèle de labeur et de persévérance. J'espère qu'ils
trouveront dans Ce travail toute ma reconnaissance
et tout mon amour.
* A Mon Cher père, à la personne la plus généreux au monde, à mon
artiste talentueux, à mon idole
-i-
…Aymen
Remerciements
-ii-
Table des matières
Introduction générale................................................................................................................1
Chapitre 1 : Cadre général du projet.........................................................................................2
Introduction.................................................................................................................................3
1.1 Présentation de la société.....................................................................................................3
1.2 Etude de l’existant.................................................................................................................4
1.2.1 Analyse et étude de l’existant..........................................................................................4
1.2.1.1 Solution 1 : TAHA voyages.......................................................................................4
1.2.1.2 Solution 1 : Traveltodo..............................................................................................5
1.2.1.3 Solution 3 : Tunisie booking......................................................................................5
1.2.2 Synthèse et critique de l'existant.....................................................................................6
1.3 Solution proposée..................................................................................................................7
1.4 Méthodologie de travail........................................................................................................8
1.4.1 Méthodologie agile..........................................................................................................8
1.4.2 Pourquoi Scrum ?...........................................................................................................8
1.4.3 Langages de modélisation.............................................................................................10
Conclusion................................................................................................................................11
Chapitre 2 : Spécification des besoins.....................................................................................12
Introduction...............................................................................................................................13
2.1 Capture des besoins............................................................................................................13
2.1.1 Capture des besoins fonctionnels..................................................................................13
2.1.2.1 Identification des acteurs........................................................................................13
2.1.2.2 Diagramme de cas d'utilisation général.................................................................13
2.1.1 Capture des besoins non fonctionnels...........................................................................14
2.1 Pilotage du projet avec scrum............................................................................................15
2.2.1 Equipe et rôle................................................................................................................15
2.2.2 Le backlog du produit...................................................................................................15
2.2.3 Planification de release.................................................................................................18
2.2 Environnement de travail....................................................................................................19
2.2.1 Environnement logiciel.................................................................................................19
2.2.1.1 Outils de développement, design et modélisation...................................................19
2.2.1.2 Plateforme de développement.................................................................................21
-iii-
2.2.1.3 Langages de programmation..................................................................................22
2.2.1.4 Framework utilisés..................................................................................................24
2.3 Architecture de l’application..............................................................................................29
Conclusion................................................................................................................................31
Chapitre 3 : Le Premier Release..............................................................................................32
Introduction...............................................................................................................................33
3.1 Développement du sprint 1 « authentification, inscription et gestion de profil »...............33
3.1.1 Analyse..........................................................................................................................34
3.1.1.1 Diagramme de cas d’utilisation sprint 1.................................................................34
3.1.1.3 Description de l’item « S’inscrire »........................................................................35
3.1.1.4 Description de l’item « Gérer profil ».....................................................................37
3.1.2 Conception....................................................................................................................39
3.1.2.1 Diagramme de séquence.........................................................................................39
3.1.2.2 Diagramme de classe sprint 1.................................................................................40
3.1.2.3 Réalisation...............................................................................................................41
3.2 Développement du sprint 2 « gestion des voyages, gestion de camping, gestion d’hôtel »45
3.2.1 Analyse..........................................................................................................................48
3.2.1.1 Diagramme de cas d’utilisation général.................................................................48
3.2.1.2 Descriptions de l’item « Gérer voyages »...............................................................48
3.2.1.4 Descriptions de l’item « Gérer hôtel »....................................................................51
3.2.2 Conception....................................................................................................................52
3.2.2.1 Diagramme de séquence.........................................................................................52
3.2.2.2 Diagramme de classe sprint 2.................................................................................56
3.2.2.3 Schéma Relationnel.................................................................................................56
3.2.2.4 Réalisation...............................................................................................................57
Conclusion................................................................................................................................60
Chapitre 4 : Le Deuxième Release..........................................................................................61
Introduction...............................................................................................................................62
4.1 Développement du Sprint 1 « Gestion de dossier, Gestion de groupe ».............................62
4.1.1 Analyse..........................................................................................................................64
4.1.1.1 Diagramme de cas d’utilisation du sprint 1............................................................64
4.1.1.2 Description de l’item « Gérer les dossiers »...........................................................65
4.1.1.3 Description de l’item « Gérer les groupes »...........................................................66
4.1.2 Conception....................................................................................................................67
-iv-
4.1.2.1 Diagrammes de séquence........................................................................................67
4.1.2.2 Diagramme de classe..............................................................................................68
4.1.2.3 Schéma Relationnel.................................................................................................69
4.1.3 Réalisation.....................................................................................................................69
4.1.3.1 Description des interfaces.......................................................................................69
4.2.1 Analyse..........................................................................................................................73
4.2.1.1 Diagramme de cas d’utilisation du sprint 2............................................................73
4.2.1.2 Description de l’item « Gérer les albums photos ».................................................73
4.2.1.3 Description de l’item « Statistiques »......................................................................74
4.2.2 Conception....................................................................................................................75
4.2.2.1 Diagramme de séquence.........................................................................................75
4.2.2.2 Diagramme de classe..............................................................................................76
4.2.2.3 Schéma Relationnel.................................................................................................76
4.2.2.4 Diagramme de classe général.................................................................................76
4.2.2.5 Réalisation...............................................................................................................78
Conclusion................................................................................................................................81
Conclusion générale................................................................................................................82
Liste des abréviations................................................................................................................83
Bibliographie............................................................................................................................84
-v-
Liste des figures
--
Figure 55: Diagramme de cas « Gérer les hôtels ».................................................................51
Figure 56: Diagramme de séquence « Consulter un voyage »................................................52
Figure 57: Diagramme de séquence « S’inscrire dans un voyage »........................................53
Figure 58: Diagramme de séquence « Supprimer un camping ».............................................54
Figure 59: Diagramme de séquence « Ajouter un hôtel ».......................................................55
Figure 60: Diagramme de classe de sprint 2...........................................................................56
Figure 61: Interfaces gestion de voyage (mobile)....................................................................57
Figure 62: Interface gestion de camping (mobile)...................................................................57
Figure 63: Interface liste de campings (web)...........................................................................58
Figure 64: Interface liste de voyages (web).............................................................................58
Figure 65: Interface mes voyages (back office).......................................................................59
Figure 66: Interface détails d'un voyage..................................................................................59
Figure 67: Interface destinations (web)...................................................................................60
Figure 68 : Décomposition sprint 1 en Items...........................................................................62
Figure 69: Diagramme de cas d’utilisation du sprint 1...........................................................64
Figure 70: Diagramme de cas d’utilisation « Gérer les dossiers ».........................................65
Figure 71 : Diagramme du cas d’utilisation « Gérer les groupes »........................................66
Figure 72: Diagramme de séquence « Valider un dossier »....................................................67
Figure 73: Diagramme de séquence « Envoyer un dossier »...................................................68
Figure 74: Diagramme de classe du sprint 1...........................................................................69
Figure 75: Interface « Ajout d’un dossier (mobile) »..............................................................70
Figure 76: Interface « Consulter un dossier (mobile) »...........................................................70
Figure 77: Interface « Consulter l’état d’un dossier et payement »........................................71
Figure 78: Interface user détails et chat..................................................................................71
Figure 79: Décomposition sprint 2 en Items............................................................................72
Figure 80: Diagramme de cas d’utilisation Sprint 2...............................................................73
Figure 81: Diagramme de cas d’utilisation « Gérer les albums photos »...............................73
Figure 82: Diagramme de cas d’utilisation « Consulter les statistiques »..............................74
--
Figure 83: Diagramme de séquence « Consulter les statistiques ».........................................75
Figure 84: Diagramme de classe de sprint 2...........................................................................76
Figure 85: Diagramme de classe général................................................................................77
Figure 86: Diagramme de déploiement....................................................................................78
Figure 87: Interface explorer et gestion de photos..................................................................78
Figure 88: Interface Chatbot (mobile).....................................................................................79
Figure 89: Interface Chatbot (web)..........................................................................................79
Figure 90: Dashboard Admin et notification (interface admin)..............................................80
Figure 91: Statistique (interface admin)..................................................................................80
Figure 92: Statistique (Interface membre professionnel).........................................................81
--
Liste des tableaux
--
Tableau 24 : Description textuelle du cas d’utilisation « Ajouter une image ».......................74
Tableau 25 : Description textuelle du cas d’utilisation « Consulter les statistiques »............74
--
Introduction générale
La digitalisation des tâches dans le secteur du voyage et du tourisme évolue de plus en plus
et elle est devenue une nécessité sur ce marché. Les voyageurs ont eu accès à plus de choix,
plus d’outils et plus d’information que jamais.
Malgré ce progrès, on ne peut pas nier que cette numérisation présente des carences qui
limite l’accès des voyageurs et des agences de voyages aux informations avec un temps de
réponse très lent, une utilisation restreinte et un manque de communication entre les différents
membres.
C’est dans ce cadre que s’inscrit le présent travail de fin d'études pour l'obtention du
diplôme national d’ingénieur au sein de l’École Polytechnique de Sousse, dont l’objectif est
de concevoir, développer et réaliser une application mobile plus performante et efficace qui
joue le rôle d'intermédiaire entre les agences de voyage, les guides et les clients désirant un
voyage ou un camping avec certains critères. Cette application est nommée « Ayya ween ».
Dans un premier chapitre, nous présenterons le cadre général de ce projet de fin d’études, à
savoir la société GPRO Consulting ainsi que le sujet sur lequel portera notre PFE et la
méthodologie de travail adoptée.
Ensuite, dans le second chapitre, nous nous proposons de présenter et d’analyser les besoins
fonctionnels et non fonctionnels ainsi que la description de l’environnement de travail.
Le troisième chapitre sera consacré à détailler le travail réalisé durant le premier release en
précisant les étapes d’analyse, de conception et de réalisation.
Dans le dernier et quatrième chapitre, nous allons détailler le travail réalisé durant le
deuxième release en précisant les étapes d’analyse, de conception et de réalisation.
Nous clôturerons ce rapport par une conclusion générale dans laquelle nous évaluerons le
travail réalisé.
1|Page
Chapitre 1
2|Page
Introduction
Le présent chapitre, est consacré à la présentation du cadre général du projet. Tout d’abord,
nous présentons l'organisme d'accueil où on a réalisé le projet de fin d'études. Ensuite, nous
effectuons une étude de l’existant. Enfin, nous expliquons notre méthode du travail, le
chronogramme du projet et le langage de modélisation que nous avons adoptée au cours de
notre travail.
L’entreprise d’accueil est « GPRO Consulting » est une société multi-facettes créée en
2015, elle permet d’effectuer un ensemble d’études et de consulting dans la mise en place des
systèmes d’informations, des logiciels de gestion industriel et du développement spécifique
adaptés aux besoins de ses clients.
GPRO Consulting est basée à Sousse et comporte une équipe dynamique, des consultants
et un large réseau de partenaires. Elle possède un service informatique de qualité auprès des
PME/PMI, à très forte valeur ajoutée misant sur l’innovation et l’expertise et qui s’engage à
garantir la satisfaction de ses clients.
L’entreprise fournit des solutions dans des domaines diversifier liés aux :
Infogérance,
GPRO Consulting propose une plateforme qui permet de gérer les voyages, les campings,
les hôtels, les dossiers de voyage. En effet, il s’agit d’une application qui joue le rôle
d'intermédiaire entre les agences de voyage, les guides et les clients désirant un voyage ou un
camping avec des certains critères.
Dans ce cadre, nous proposons d’analyser les solutions existantes sur le marché pour qu’on
puisse réaliser notre objectif.
TAHA Voyage est un Opérateur de Voyage basé en Tunisie, géré par une équipe
professionnelle et expérimentée, la manipulation à la fois entrantes et sortantes, Voyage
d'affaires en provenance et à tous les coins du monde.
4|Page
Figure 1: Taha Voyages
Traveltodo est la première agence de voyage en ligne en Tunisie qui offre des promotions
permanentes sur les voyages et les loisirs, pour découvrir La Tunisie du nord au sud, mais
aussi pour s’évader vers les 4 coins du monde.
Figure 2: Traveltodo
Tunisie booking est une agence de voyage spécialiste des voyages sur mesure en Tunisie.
Consultez toutes nos offres de séjours à la carte, voyages de luxe ou voyages de noces. Une
équipe de conseillers est disponible pour réussir votre projet Voyages
5|Page
Figure 3: TunisieBooking
- Pour les solutions existantes, la majorité des interfaces ne sont pas responsives. En effet,
l’utilisateur ne peut pas accéder à toutes les fonctionnalités en cas où il se connecte à travers
son smartphone car il y a une grande partie des interfaces ne sont pas visibles.
6|Page
- Pour réaliser une tâche, l’utilisateur doit passer par plusieurs interfaces pour accomplir son
objectif. Le principe de fonctionnement de ces solutions n’est pas basé sur l’approche de page
web unique (Single web page). Cette approche caractérise les applications modernes et c’est
la tendance actuelle au sein de la majorité des boîtes de développement internationales.
Les solutions existantes ne répondent pas parfaitement aux besoins de notre client car elles
ne possèdent pas par exemple, un module de gestion de dossiers qui permet de traiter les
dossiers des voyageurs. Ainsi, la plupart de ces solutions ne possèdent pas les modules de
gestion de camping et de paiement en ligne. Voici le tableau 2 qui compare les solutions
existantes selon des critères qui nous vise développer dans notre solution.
D’après l’étude comparative faite dans le tableau 2, nous avons constaté que les solutions
existantes possédent des insuffisances. Ces lacunes se voient surtout au niveau de la gestion
de dossiers et le regroupement de plusieurs agences dans une même plateforme, vu que la
plupart des applications analysées se limitent uniquement au système de gestion de voyages et
d’hôtels.
Notre plateforme intitulée « Ayya Ween » permet de gérer les voyages, les campings, les
hôtels et les dossiers de voyage. C’est une application qui joue le rôle d'intermédiaire entre les
7|Page
agences de voyage, les guides et les clients désirant un voyage ou un camping avec certains
critères.
La solution proposée respectera les quatre points fondamentaux présentés dans le tableau 3.
Équitable
Scrum (1996)
Scrum est une méthodologie agile qui consiste à avoir une équipe soudée orientant le projet
au fil de son avancement afin d’atteindre un but. Cette approche est à la fois dynamique et
productive, engendre la réalisation des fonctionnalités par itération en incluant la participation
du client. Chaque itération peut durer de deux à quatre semaines, à la fin de chaque sprint un
produit fonctionnel doit être livré. En effet, Scrum définit trois rôles qui sont :
Transformer les besoins exprimés dans le Sprint Backlog (est défini ci-dessous)
en fonctionnalités utilisables.
Sprint (itération)
Nous considérons que le langage le mieux adapté pour fournir une présentation
compréhensible. Les divers diagrammes UML permettent de bien exposer notre solution.
Conclusion
Dans ce chapitre, nous avons donné un aperçu du projet en décrivant l'organisme d'accueil,
GPRO Consulting, et le contexte du projet. Nous avons présenté aussi notre méthodologie de
travail pour réaliser notre projet, comme la méthode Scrum.
Le reste du rapport est organisé selon cette méthodologie. Le chapitre suivant traite la
préparation du projet.
11 | P a g e
Chapitre 2
12 | P a g e
Introduction
Ce chapitre est consacré à la capture des besoins fonctionnels et non fonctionnels de notre
système, au pilotage de projet avec scrum, par élaboration du Backlog du produit avec une
planification des sprints ainsi qu’à la description de l’environnement de travail.
Un acteur est la personne ou le matériel qui interagit avec notre système afin de réaliser
une valeur ajoutée. La plateforme de Place de marché IT fait intervenir quatre trois principaux
comme le montre le tableau 4.
Rôle Fonctions
Administrateur Un administrateur devra pouvoir approuver les voyages et les
campings, ajouter, modifier et supprimer les utilisateurs et les
données de référence. Il dispose de toutes les autorisations sur
l’application.
Membre Après sa connexion, il devra pouvoir ajouter des hôtels, des
professionnel voyages et des campings, valider des dossiers.
Membre Membre particulier : est connecté individuellement, il cherche des
particulier voyages et des camping ou il demande un voyage de groupe, il
envoie son dossier.
13 | P a g e
Figure 5: Diagramme de cas d'utilisation général
Portabilité : L’application doit être portable et fonctionnelle sur n’importe quel système
d’exploitation.
14 | P a g e
2.1 Pilotage du projet avec scrum
15 | P a g e
Gestion de profil Membre professionnel Changer mot de passe 3
Authenti
fication,
«
et membre particulier
Gérer les voyages Membre professionnel Afficher les voyages 4
et membre particulier
Gérer les voyages Membre professionnel Rechercher un voyage 4
et Membre particulier
Gérer les voyages Membre professionnel Ajouter un voyage 4
Gérer les voyages Membre professionnel Supprimer un voyage 4
Gérer les voyages Membre professionnel Modifier un voyage 4
Gérer les voyages Membre particulier Ajouter un voyage dans mes 4
favoris
Gérer les voyages Membre particulier Supprimer un voyage de mes 4
« Gestion des voyages »
favoris
Gérer les voyages Membre particulier S’inscrire dans un voyage 5
Gérer les voyages Membre particulier Annuler l’inscription dans un 5
voyage
Gérer les voyages Membre professionnel Commenter un voyage 6
et membre particulier
Gérer les voyages Membre professionnel Supprimer mon commentaire 6
et membre particulier d’un voyage
Gérer les voyages Membre professionnel Consulter le voyage dans la 6
et membre particulier carte
Gérer les voyages Membre professionnel Partager media 6
et membre particulier
Gérer les voyages Membre particulier Demander un voyage de groupe 7
Gérer les voyages Membre particulier Demander un Guide 7
Gérer les campings Membre professionnel Ajouter un camping 8
« Gestion des campings »
16 | P a g e
Gérer les campings Membre particulier S’inscrire dans un camping 8
photos
Gérer albums Membre particulier Voir l'ensemble des photos 12
photos
Gérer albums Membre particulier Supprimer mes photos 12
photos
Gérer albums Membre particulier Partager les photos dans les 12
photos réseaux sociaux
17 | P a g e
« Chatbot » « Statistique »
Pour créer un plan de diffusion, les éléments suivants doivent être disponibles :
Dans notre cas, nous avons découpé notre projet en deux Release.
18 | P a g e
Figure 6: Schéma de Release
Pour le développement front-end (Mobile + Web), nous avons utilisé un nouvel éditeur
développé récemment par Microsoft : c’est Visual code studio.
Cet éditeur a gagné une très bonne satisfaction au sein de développeur front-end, c’est un outil
open source qui facilite le développement avec la nouvelle version de JavaScript appelée
TypeScript. [B1]
IntelliJ IDEA :
Pour le développement Back-end, nous avons utilisé l’éditeur Intellij IDEA, est un
environnement de développement intégré de technologie Java destiné au développement de
logiciels informatiques. Il est développé par JetBrains et disponible en deux versions, l'une
communautaire, open source, tous deux supportent les langages de programmation Java,
Kotlin, Groovy et Scala. [B2]
Adobe Photoshop :
Adobe Photoshop est un logiciel de retouche, de traitement et de dessin assisté par ordinateur.
[B3]
19 | P a g e
Figure 9: Photoshop logo
Adobe Illustrator :
Xcode :
Xcode est un environnement de développement pour macOS, ainsi que pour iOS, watchOS et
tvOS. [B5]
Draw io :
Draw.io est une application gratuite en ligne, accessible via son navigateur (protocole https)
qui permet de dessiner des diagrammes ou des organigrammes [B6]
Bitbucket :
Il s'agit d'un service freemium dont la version gratuite permet déjà de créer jusqu'à un nombre
illimité de dépôts privés, accessibles par cinq utilisateurs au maximum. [B7]
20 | P a g e
Figure 13: Bitbucket logo
Jira :
Jira est un système de suivi de bugs, un système de gestion des incidents, et un système de
gestion de projets développé par Atlassian. [B8]
Swagger :
Swagger est c’est un ensemble d’outils pour aider les développeurs dans la conception, le
build, la documentation et la consommation d’API. [B10]
AWS (Amazon Web Services) est une plateforme de Cloud computing complète et évolutive
fournie par Amazon qui comprend un mélange d’offres :
Infrastructure en tant que service (IaaS), Plateforme en tant que service (PaaS), Logiciel en
tant que service (SaaS).
Les services AWS peuvent offrir à une organisation des outils tels que la puissance de calcul,
le stockage de bases de données et des services de livraison de contenu. [B11]
Donc pour mettre l'application en valeur, plus développer et répond aux besoins du marché
nous implémentons les web services suivants :
21 | P a g e
Amazon S3 : Amazon Simple Storage Service (Amazon S3) est un service de stockage
d'objet offrant une évolutivité, une disponibilité des données, une sécurité et des performances
de pointe. Les clients de toutes tailles et de tous secteurs peuvent ainsi utiliser ce service afin
de stocker et protéger n'importe quelle quantité de données. [B12]
Amazon Identity and Access Management (IAM) : permet de contrôler de façon sécurisée
l'accès aux services et ressources AWS. Avec IAM, vous pouvez créer et gérer Amazon
Elastic Compute Cloud (Amazon EC2) est un service Web qui fournit une capacité de calcul
sécurisée et redimensionnable dans le cloud. [B14]
Java :
Java est une technique informatique développée initialement par Sun Microsystems puis
acquise par Oracle suite au rachat de l'entreprise. Défini à l'origine comme un langage de
programmation, Java a évolué pour devenir un ensemble cohérent d'éléments techniques.
[B15]
22 | P a g e
Figure 20: Java logo
TypeScript :
C’est un langage de programmation libre et open source développé par Microsoft qui a pour
but d'améliorer et de sécuriser la production de code JavaScript. C'est un sur- ensemble de
JavaScript (c'est-à-dire que tout code JavaScript correct peut être utilisé avec TypeScript). Le
code TypeScript est transcompilé en JavaScript, pouvant ainsi être interprété par n'importe
quel navigateur web ou moteur JavaScript. [B16]
JavaScript :
C'est un langage de programmation qui est inclus dans le code HTML. Il permet d'apporter
des améliorations au langage HTML en permettant d'exécuter des commandes.
Mais dans notre projet en travaille par un outil de Java Script appelle TypeScript Type script
est un langage de programmation libre et open source développée par Microsoft qui a pour but
d'améliorer et de sécuriser la production de code JavaScript. [B17]
HTML5 :
« Hyper Text Markup Langage 5 » considéré comme l’une des nouvelles technologies les
plus importantes, qui étaient émergées en 2010, et qui sont encore un travail ne sont pas
totalement finalisées par le W3C.
Elle est un langage de balisage conçu pour la création des pages Web. [B18]
23 | P a g e
Figure 23: Html5 logo
CSS3 :
« Cascading Style Sheets » permet d’arrondir les images, faire des ombres sur les divas, des
ombres sur du texte, des polices de caractères plus fun, des bordures d’images, etc. Et surtout
l’ajout de l’animation.
Il utilisait pour la description des styles et la disposition des éléments des pages HTML. [B19]
SpringBoot :
Spring Security :
Spring Security est un Framework de sécurité léger qui fournit une authentification et un
support d’autorisation afin de sécuriser les applications Spring. Il est livré avec des
implémentations d’algorithmes de sécurité populaires. [B21]
24 | P a g e
Angular10 :
Ionic 5 :
Ionic est un framework pour développer des applications mobiles hybride (Cross Platform).
Les applications ionic sont construites sur Apache Cordova par défaut. Ils ont accès à tous les
plug-ins Cordova qui vous permettent d'utiliser des fonctionnalités natives, telles que les
notifications push, les caméras, les accéléromètres, etc. [B23]
Chart.js :
Chart.js est une bibliothèque JavaScript open source gratuite pour la visualisation des
données. [B24]
Dialogflow :
Dialogflow est une plate-forme de compréhension du langage naturel utilisée pour concevoir
et intégrer une interface utilisateur conversationnelle dans des applications mobiles, des
applications Web, des appareils, des robots, des systèmes de réponse vocale interactifs et des
25 | P a g e
utilisations associées. [B25]
Stripe :
Stripe est une solution de paiement tierce, qui permet d'accepter les paiements par carte de
crédit et carte de débit dans votre Boutique en ligne. C'est une solution sûre et rapide. Vous
pouvez traiter les paiements presque immédiatement. [B26]
Tout ce qu'ils ont à faire est de saisir les détails de leur carte de crédit :
4- Les données sont à nouveau envoyées à Stripe, et il partage les détails avec les systèmes
26 | P a g e
de paiement.
Pour gérer la notification dans notre application, nous avons utilisé le service de Google FCM
(Firebase Cloud Messenging).
Une notification push est un message envoyé à l’utilisateur, ce message est lié à une
application installée. L’avantage de la notification push c’est que le message est reçu par
l’utilisateur même si l’application est fermée.
Pour bénéficier d’un service FCM, il faut tout d’abord Enregistrez les appareils pour recevoir
des messages de FCM. Une instance d'une application cliente s'inscrit pour recevoir des
messages, obtenant un jeton d'enregistrement qui identifie de manière unique l'instance
d'application.
• Création : Le message est composé, soit dans le compositeur de notifications, soit dans un
environnement approuvé, et une demande de message est envoyée au serveur.
27 | P a g e
spécifique à la plate-forme.
28 | P a g e
3. Transmission du TOKEN au serveur d’envoi qui va être stocké (ou rafraîchi) dans une base
de données,
4. Pour l’envoi d’une notification push, le serveur d’envoi transmet la notification push à
FCM. Pour cela il indique l’identifiant concerné et le message associé,
6. FCM envoie immédiatement un rapport de réception des notifications pour mettre la base
d’identifiants à jour (selon les désinstallations et la désactivation des notifications),
Dans cette section, nous abordons l’aspect général de la plateforme à travers la présentation
de son architecture logicielle. Pour notre solution, on a adopté l’architecture nTiers illustrée
par la figure 36
29 | P a g e
Figure 36: Architecture logicielle de l’application
L’architecture trois-tiers (ou architecture trois niveaux) est un modèle d’architecture client-
serveur qui vise à séparer trois couches logicielles au niveau de la même application en la
présentant comme une superposition de trois couches dont chacune possède son propre rôle.
La couche présentation :
C’est l’interface web qui permet à l’utilisateur de piloter l’application et de recevoir des
informations via l’explorateur ou des API web (Web services). Dans notre application, cette
couche est basée sur la technologie Angular, elle encapsule toute la logique de la présentation.
On a utilisé le pattern MVC (Modèle Vue Contrôleur) pour l’implémentation de cette couche,
qui permet l’indépendance entre les éléments d’interface et les composants métiers.
- Template : Les templates sont la partie visible d’une application Angular. Ils mélangent
le code HTML et le code Angular.
- Service : Les services représentent une vaste catégorie qui inclut toute valeur, fonction,
ou fonctionnalité dont une application a besoin.
- Liaison par attributs : Ce sont les données de Typescript qui sont accessibles dans les
templates des composants.
30 | P a g e
- Liaison par événement : c’est un déclenchement des événements qu’on peut écouter :
click, keyup, mousemove qui permet l’exécution d’une méthode déclarée.
La couche métier :
La couche de contrôle : c’est la couche supérieure d’une application Web. Elle est
responsable du traitement de l’entrée de l’application et renvoie la réponse correcte à
l’utilisateur.
La couche de service : réside sous la couche de contrôle. Elle agit comme une
frontière de transaction et contiennent le "code de plomberie" qui communique avec
des ressources externes telles que des systèmes de fichiers et des bases de données.
Ces méthodes sont souvent utilisées par plusieurs services d’application.
La couche persistance : c’est la couche la plus basse d’une application Web. Elle est
responsable de la communication avec le stockage de données utilisées.
Conclusion
Dans ce chapitre, on a planifié notre travail, identifié les besoins fonctionnels et non
fonctionnels de notre application, les rôles des utilisateurs, par la suite on a présenté le
Backlog de notre système. Ainsi on a détaillé la phase de planification des sprints. Enfin on a
choisi l’architecture de notre projet ainsi que notre environnement de travail.
31 | P a g e
Chapitre 3
Le Premier Release
32 | P a g e
Introduction
Dans ce chapitre, nous allons détailler le travail réalisé durant le premier release. En effet,
chaque release, qui est l’ensemble d’itérations (sprint), représente une vision distribuée de la
période de la production du livrable. Ce premier Release comprend deux sprints :
S’inscrire.
S’authentifier.
Gérer profil.
33 | P a g e
Le tableau 7 présente les users stories du sprint 1.
Gérer Modifier image En tant que membre je peux uploader modifier une 3
profil de profil image de profil
Changer mot de En tant que membre, je peux changer le mot de passe
passe
Désactiver profil En tant que membre je peux désactiver mon profil
3.1.1 Analyse
3.1.1.1 Diagramme de cas d’utilisation sprint 1
34 | P a g e
Figure 39: Diagramme de cas d’utilisation du sprint 1
35 | P a g e
3.1.1.2 Description de l’item « S’authentifier »
36 | P a g e
Scénario Nominal 1. L’utilisateur saisit son login et son mot de passe
ou il peut connecter via un compte Facebook ou
Google.
2. L’utilisateur confirme la saisie de ses données
d’identification.
3. Le système vérifie les données d’identification.
4. Le système affiche l’interface d’accueil
l’utilisateur.
Scénario D’exception E1. Si le login et/ou le mot de passe sont incorrects
L’enchaînement démarre au point 3. Le système
affiche un message d’erreur informant l’utilisateur
que son login ou mot de passe sont incorrects et le
scénario reprend à l’action1.
37 | P a g e
Raffinement du cas d’utilisation « Gérer profil »
38 | P a g e
5. Le membre clique sur le bouton « Modifier ».
6. Le membre modifie ses informations et clique sur
le bouton « Terminer »
7. Le système vérifie les données saisies.
8. Le système enregistre les modifications effectuées
9. Le système notifié l’utilisateur
Post-condition Profil modifié.
3.1.2 Conception
3.1.2.1 Diagramme de séquence
39 | P a g e
Figure 43: Diagramme de séquence User story 1.1 « S’authentifier »
40 | P a g e
Figure 44: Diagramme de séquence « Modifier Profil »
41 | P a g e
Figure 45: Diagramme de classe du sprint 1
La base de données relationnelle est une base de donnés comprenant des relations dynamiques
entre les différents objets contenus dans les tables :
Membre_Particulier (#id_utilisateur, nom, prenom, email, tél, adresse, pays, ville, photo)
Membre_Professionnel (#id_utilisateur, nom, prenom, email, tél, adresse, pays, ville, photo)
Administrateur (#id_utilisateur)
3.1.2.3 Réalisation
Nous présentons dans ce qui suit quelques interfaces représentant le travail élaboré dans ce
sprint, l’accès à la page principale du site s’effectue sans authentification, c’est la première
interface de notre plateforme qui contient des bandes de publicité animés.
42 | P a g e
Figure 46: Page d'accueil (mobile)
Figure 47: Page d'accueil (web)
44 | P a g e
Figure 48: Interface de connexion et d’inscription (web)
45 | P a g e
3.2 Développement du sprint 2 « gestion des voyages, gestion de
camping, gestion d’hôtel »
Figure 51:
Décomposition sprint 3 en Items
4.1 En tant que membre professionnel et membre particulier, je peux consulter la liste des voyages
4.2 En tant que membre professionnel et membre particulier, je peux chercher un voyage
4.3 En tant que membre professionnel, je peux ajouter un voyage
4.4 En tant que membre professionnel, je peux supprimer un voyage
4.5 En tant que membre professionnel, je peux modifier un voyage
5.1 En tant que membre particulier, je peux ajouter un voyage dans mes favoris
5.2 En tant que membre particulier, je peux supprimer un voyage de mes favoris
5.3 En tant que membre particulier, je peux s’inscrire dans un voyage
5.4 En tant que membre particulier, je peux annuler l’inscription de voyage
46 | P a g e
6.1 En tant que membre professionnel et membre particulier, je peux commenter un voyage
6.2 En tant que membre professionnel et membre particulier, je peux supprimer mon commentaire
d’un voyage
6.3 En tant que membre professionnel et membre particulier, je peux consulter le voyage dans la
carte
6.4 En tant que membre professionnel et membre particulier, je peux partager un voyage sur les
réseaux sociaux
7.1 En tant que membre particulier, je peux demander un voyage de groupe
7.2 En tant que membre particulier, je peux demander un guide
7.3 En tant que membre professionnel et membre particulier je peux consulter la liste des campings
7.4 En tant que membre professionnel et membre particulier je peux chercher un camping.
8.1 En tant que membre professionnel, je peux ajouter un camping
8.2 En tant que membre professionnel, je peux modifier un camping
8.3 En tant que membre professionnel, je peux supprimer un camping
9.1 En tant que membre particulier, je peux s’inscrire dans un camping
9.2 En tant que membre particulier, je peux annuler l’inscription de camping
10.1 En tant que membre professionnel, je peux ajouter un hôtel
10.2 En tant que membre professionnel, je peux modifier un hôtel
10.3 En tant que membre professionnel, je peux supprimer un hôtel
10.4 En tant que membre professionnel et membre particulier je peux consulter un hôtel
48 | P a g e
Modifier un camping En tant que membre professionnel, je peux
8
modifier un camping
Supprimer un camping En tant que membre professionnel, je peux
8
supprimer un camping
S’inscrire dans un En tant que membre particulier, je peux s’inscrire
8
camping dans un voyage
Annuler l’inscription En tant que membre particulier, je peux annuler
8
l’inscription de camping
Ajouter un hôtel En tant que membre professionnel, je peux ajouter
9
un hôtel
Modifier un hôtel En tant que membre professionnel, je peux
Gérer les hôtels
9
modifier un hôtel
Supprimer un hôtel En tant que membre professionnel, je peux
9
supprimer un hôtel
Consulter un hôtel En tant que membre professionnel, je peux
9
consulter un hôtel
3.2.1 Analyse
3.2.1.1 Diagramme de cas d’utilisation général
49 | P a g e
Figure 53: Diagramme de cas d’utilisation « Gérer les voyages »
50 | P a g e
3.2.1.3 Descriptions de l’item « Gérer camping »
51 | P a g e
Scénario Principal 1. Le membre demande la page « Liste des campings »
2. Le système affiche la liste
3. Le membre cherche des campings par destination
4. Le système filtre la liste
Post conditions de succès Liste de camping affichée
3.2.2 Conception
3.2.2.1 Diagramme de séquence
53 | P a g e
Figure 56: Diagramme de séquence « Consulter un voyage »
54 | P a g e
Diagramme de séquence « Supprimer camping »
55 | P a g e
Figure 58: Diagramme de séquence « Supprimer un camping »
56 | P a g e
La figure 59 présente le diagramme de séquence « Ajouter un hôtel ».
57 | P a g e
La figure 60 présente le diagramme de classe de sprint 2
La base de données relationnelle est une base de données comprenant des relations
dynamiques entre les différents objets contenus dans les tables :
Voyage (id_voyage, titre, description, date, prix, nbr, duree, picture, #id_destination,
#id_user)
3.2.2.4 Réalisation
Nous allons consacrer cette partie pour la présentation de quelques interfaces élaborées
dans ce sprint. Les figures 61,62,63,64,65,66 et 67 présentent les interfaces de gestion de
voyage, gestion de camping et gestion des destinations.
59 | P a g e
Figure 63: Interface liste de campings (web)
60 | P a g e
Figure 65: Interface mes voyages (back office)
Conclusion
Dans ce chapitre, on a réussi à produire un incrément de valeur pour le client et utile dans
un environnement de production et on a effectué la conception et la réalisation du module de
sprint 1 et sprint 2.
Le release a été présenté dans le cadre d'une réunion de fin de release et préparation au
prochain. Cette réunion était à la présence de l'équipe du projet et quelques chefs de projets de
la société GPRO Consulting.
Dans le chapitre qui suit, nous allons produire un nouveau release couvrant les
fonctionnalités suivantes : Gestion de dossier, Gestion de groupe.
62 | P a g e
Chapitre 4
Le Deuxième Release
63 | P a g e
Introduction
Dans ce chapitre, nous allons détailler le travail réalisé durant le deuxième release. Tout
d’abord, un release, qui est l’ensemble de sprint (itérations), représente une vision distribuée
de la période de la production du livrable. Ce deuxième Release comprend deux sprints :
Consulter le dossier En tant que membre particulier, je peux consulter mon dossier 10
Gérer les
Envoyer le dossier En tant que membre particulier, je peux envoyer mon dossier 10
Modifier le dossier En tant que membre particulier, je peux modifier mon dossier 10
Supprimer le dossier En tant que membre particulier, je peux supprimer mon 10
65 | P a g e
dossier
dossi
ers Consulter les dossiers En tant que membre professionnel, je peux consulter les 10
dossiers
Valider les dossiers En tant que membre professionnel, je peux valider les dossier 11
Refuser les dossiers En tant que membre professionnel, je peux refuser les dossier 11
Supprimer les dossiers En tant que membre professionnel, je peux supprimer les 11
dossier
Evaluer les dossiers En tant que membre professionnel, je peux évaluer les dossier 11
Paiement En tant que membre particulier, je peux effectuer le paiement 11
Invitation En tant que membre professionnel et membre particulier, je 12
peux inviter un membre
Exclusion En tant que membre professionnel et membre particulier, je 12
peux exclure un membre
Consultation En tant que membre professionnel et membre particulier, je 12
peux consulter un groupe abonnement.
Demander l'adhésion En tant que membre professionnel et membre particulier, je 12
peux demander l'adhésion dans un groupe
Envoyer un message En tant que membre professionnel et membre particulier, je 12
peux envoyer un message
66 | P a g e
Gére
r les
grou
pes
67 | P a g e
4.1.1 Analyse
68 | P a g e
4.1.1.1 Diagramme de cas d’utilisation du sprint 1
Le tableau 20 présente la description détaillée de l’user story 11.5 « Évaluer les dossiers ».
69 | P a g e
3. Le membre professionnel demande le dossier
4. Le système affiche le dossier.
5. Le membre professionnel évalue le dossier.
6. Le système notifie l’utilisateur.
Post conditions de succès Dossier évalué
4.1.2 Conception
4.1.2.1 Diagrammes de séquence
71 | P a g e
Figure 72: Diagramme de séquence « Valider un dossier »
72 | P a g e
Figure 73: Diagramme de séquence « Envoyer un dossier »
Administrateur (#id_utilisateur)
4.1.3 Réalisation
4.1.3.1 Description des interfaces
La figure 75 présente l’interface d’envoi d’un dossier dans la plateforme. L’utilisateur doit
scanner ou choisir une photo du passeport et un document nécessaire pour le voyage sous le
format PDF.
74 | P a g e
Figure 75: Interface « Ajout d’un dossier (mobile) »
75 | P a g e
Figure 76: Interface « Consulter un dossier (mobile) »
La figure 77 présente l’interface de suivi d’un dossier par le membre particulier. Il peut
consulter l’état de son dossier et en cas d’acceptation, il peut passer au payement en ligne.
La figure 78 présente le profil d’un membre quelconque et l’interface qui lui permet d’accéder
au chat avec un membre professionnel.
76 | P a g e
Figure 78: Interface user détails et chat
Statistique.
13
Supprimer En tant que membre particulier, je peux
des photos supprimer mes photos 14
Partager des En tant que membre particulier, je peux partager
photos les photos dans les réseaux sociaux. 14
Consulter les En tant que membre professionnel, je peux
statistiques consulter les statistiques. 15
4.2.1 Analyse
4.2.1.1 Diagramme de cas d’utilisation du sprint 2
78 | P a g e
Figure 80: Diagramme de cas d’utilisation Sprint 2
Descriptions textuelles des cas d’utilisation de l’item « Gérer les albums photos »
Le tableau 24 présente la description détaillée de l’user story 13.4 « Partager une photo ».
79 | P a g e
Post conditions de succès Photo partagé
Figure 82:
Diagramme de cas d’utilisation « Consulter les statistiques »
4.2.2 Conception
4.2.2.1 Diagramme de séquence
80 | P a g e
Figure 83: Diagramme de séquence « Consulter les statistiques »
81 | P a g e
Figure 84: Diagramme de classe de sprint 2
82 | P a g e
Figure 85: Diagramme de classe général
83 | P a g e
4.2.2.5 Réalisation
Architecture physique
Un diagramme de déploiement est une vue statique qui sert à représenter l'utilisation de
l'infrastructure physique par le système et la manière dont les composants du système sont
répartis ainsi que leurs relations entre eux.
La figure 87 présente la page d’accueil qui contient tous les stories des membres inscrits et
les différentes publications faites sur les voyages et les campings. Tout membre peut consulter
ses propres photos et peut les partager sur les réseaux sociaux.
84 | P a g e
Figure 87: Interface explorer et gestion de photos
Les figures 88 et 89 présentent le chatbot qui permet d’aider l’utilisateur pendant son
voyage ou son camping et fournir une réponse immédiate à ses questions sur les guides
urbains gratuits, les promotions sur les circuits, les réservations, la préparation et la gestion
des voyages. L'apprentissage machine de l'IA du chatbot l'aide à apprendre de nouvelles
questions tirées de conversations avec des clients réels.
85 | P a g e
Figure 89: Interface Chatbot (web)
Pour chaque voyage ou camping crée une notification est envoyée à l'administrateur
La figure 91 présente le tableau de bord de l’administrateur qui affiche des statistiques sur
le nombre de voyage approuvé, le nombre de voyage en attende, … ainsi que pour les
campings.
Conclusion
A la fin de ce chapitre, nous avons réussi à produire un incrément répondant aux besoins
du client et étant utilisé dans un environnement de production. Nous clôturons ce rapport par
une conclusion générale.
87 | P a g e
Conclusion générale
Notre projet de fin d’études effectué au sein de la société « GPRO Consulting » consiste à
la conception et au développement d’une application mobile et web pour la gestion des
voyages et des campings.
Cette application permet de faciliter les procédures nécessaires pour voyager et assure la
communication entre les agences de voyage, les guides et les clients. Elle est rapide,
dynamique et simple à utiliser.
Au terme de ce rapport, nous pouvons conclure que ce stage de fin d’études nous a donné
l’occasion opportune afin de confronter l’acquis théorique à l’environnement pratique,
puisqu’il nous a permis d’approfondir nos connaissances théoriques, acquises tout le long de
notre formation, par la pratique des nouvelles technologies.
Ce travail nous a fourni également un grand apport au niveau de plusieurs niveaux. Sur le
plan technique, nous avons appris à manipuler le Framework SpringBoot, Spring Security,
Ionic 5 et Angular 10, Stripe, Dialogflow et les services développés par Amazone web
Service et pleins d’autres outils. Nous avons également eu l’opportunité de maîtriser la
conception en utilisant UML.
88 | P a g e
Liste des abréviations
— RH : Ressources Humaines
— UI : User Interface
— IT : Informatique Technologie