conception et développement d’un système d’alerte et notification d’une tournée de bus
Post on 15-Apr-2017
820 Views
Preview:
TRANSCRIPT
Reacutesumeacute
Ce projet de fin drsquoeacutetude preacutesenteacute dans ce rapport est
proposeacute dans le cadre de lobtention du diplocircme
dingeacutenieur en informatique agrave leacutecole supeacuterieur priveacutee
dingeacutenierie et de technologies Esprit et reacutealiseacute au sein
de la societeacute Philae-ITCe projet consiste agrave la conception
et le deacuteveloppement dune application de notification et
drsquoalerte intituleacutelaquo BusMapper raquo qui facilite la vie
quotidienne du citoyen dans le domaine de transport en
commun le cas du laquo bus raquo ici tout en lui offrant
plusieurs services de localisation et drsquoalerte sur la
position du bus ou toute urgence concernant le traffic et
les tourneacutees de bus
Mots-cleacutesautobustraficalertenotificationSMSJEE
Abstract
This graduation project is proposed in the context to
obtain the computer engineering degree at the Private
Higher School of Engineering and Technology ESPRIT
realized within Philae-IT This project consists of the
design and the development of an application entitled
laquo BusMapper raquo which make easier the daily transit life
of citizens by providing a real-time bus positions and
multiple other services like traffic information
upcoming departure times about bus tour and gives the
user the opportunity to get notified even if he has no
connection directly by SMS hellip
Keywords autobus traffic alert
notificationSMS2TUP JEE
PROJET DE FIN DrsquoETUDE
Pour lrsquoobtention du diplocircme national drsquoingeacutenieur en informatique
Conception et deacuteveloppement
drsquoun systegraveme drsquoalerte et notification
drsquoune tourneacutee de bus
laquoBusMapper raquo
Reacutealiseacute par Encadreacute par
Bilel KHALED Mme Rym ALOUANE
M Najeh KHALED
Anneacutee universitaire 2015-2016
Signatures des encadrants
Encadrant PHILAE-IT
Encadrante ESPRIT
Mme Rim ALOUANE (Esprit)
Signature et cachet M Najeh KHALED
Signature Mme Rym ALOUANE
Deacutedicace
A mes tregraves chers parents Habib et Dalila
Auxquels je dois ce que je suis Que Dieu vous protegravege
A mes chegraveres fregraveres Anis et Moetaz
Pour leur amour et leur incontestable appui
A la meacutemoire de mes grands-parents
Puisse Dieu les accueillir dans son infinie Miseacutericorde
A toute ma famille amp A tous mes chers amis
Je deacutedie ce travail agrave toutes les personnes chegraveres agrave mon cœur Qursquoelles trouvent
ici lrsquoexpression de toute ma gratitude et mon amour
Remerciement
CrsquoEST parce que jrsquoai beaucoup veacuteneacutereacute tous ceux qui mrsquoont encadreacute que je tiens vraiment
agrave leur faire part de toute ma reconnaissance et plus speacutecialement je tiens agrave remercier agrave travers
ces lignes
M Najeh KHALED mon encadrant pour son aide preacutecieuse et le temps qursquoil mrsquoa alloueacute
pour me guider et mrsquoaider pour mrsquointeacutegrer dans lrsquoenvironnement ses efficaces conseils et son
deacutevouement qui mrsquoont permis agrave bien mener ce travail
Mme Rym ALOUANE mon encadrante de lrsquouniversiteacute agrave qui jrsquoadresse un hommage
particulier pour sa disponibiliteacute ses suggestions et ses remarques
M Cleacutement TRUNG je porte un remerciement particulier agrave qui nrsquoa cesseacute de suivre chacun de
mes pas tout au long de ce projet pour ses encouragements ses conseils sa rigueur dans le
travail
A tous ceux qui directement ou indirectement ont aideacute agrave la finalisation de ce travail
A Messieurs les membres de lrsquohonorable jury qursquoils trouvent ici lrsquoexpression de ma
gratitude pour avoir accepteacute de juger mon travail
Table des matiegraveres
INTRODUCTION GENERALE 1
Chapitre 1 ETAT DE LrsquoART 3
I Cadre du projet 4
II Preacutesentation de la socieacuteteacute accueillante 4
1 Preacutesentation geacuteneacuterale 4
2 Domaine drsquoactiviteacute 5
III Etude de lrsquoexistant 5
1 Ratp 6
2 Moobee Bus 6
IV Probleacutematique 7
V Solution proposeacutee 8
VI Meacutethodologie de deacuteveloppement 8
1 Un comparatif des meacutethodologies 8
2 Justification du choix de la meacutethodologie 10
3 Application de la meacutethodologie 2TUP sur notre projet 12
4 Gestion de projet Maven 13
Chapitre 2 Analyse et speacutecification des besoins 15
I Speacutecification fonctionnelle 16
1 Besoins fonctionnels 16
2 Besoins non-fonctionnels 17
3 Modeacutelisation des besoins 18
31 Identification des acteurs 18
32 Description des cas drsquoutilisation 19
33 Diagramme de seacutequence systegraveme 22
II Speacutecification technique 27
1 Choix technologique 27
11 Langage de deacuteveloppement 27
12 Framework 27
13 API Utiliseacutees 29
2 Choix Architectural 31
21 Architectures Multi-tiers 31
22 Architecture adopteacutee 32
Chapitre 3 Etude conceptuelle 34
I Conception preacuteliminaire 35
1 Diagramme de deacuteploiement 35
2 Diagramme de classe drsquoanalyse 36
II Conception deacutetailleacute 38
1 Les patrons de conception 38
11 Service Locator 38
12 Business Delegate 38
13 MVC (Model-View-Controller) 38
2 Diagramme de seacutequence objet 39
21 Diagramme de seacutequence objet laquo Authentification raquo 39
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo 40
23 Diagramme de seacutequence objet laquo geacuterer notification raquo 41
Chapitre 4 Codage et tests 43
I Environnement de travail 44
1 Environnement mateacuteriel 44
2 Environnement logiciel 44
II Les nouvelles technologies utiliseacutees 46
III Chronogramme drsquoavancement du projet 46
IV Preacutesentation des interfaces 47
1 Interface accueil utilisateur 47
2 Interface Consultation du reacuteseaux des stations sur Paris 48
3 Interface traccedilage du plus court chemin 49
4 Interface consultation de la position du bus et notifications 50
5 Interface de gestions de notification 51
V Tests et validation 52
1 Test des API 52
2 Test de compatibiliteacute mobile 53
CONCLUSION et PERSPECTIVES 55
Webographie 56
Glossaire 57
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
PROJET DE FIN DrsquoETUDE
Pour lrsquoobtention du diplocircme national drsquoingeacutenieur en informatique
Conception et deacuteveloppement
drsquoun systegraveme drsquoalerte et notification
drsquoune tourneacutee de bus
laquoBusMapper raquo
Reacutealiseacute par Encadreacute par
Bilel KHALED Mme Rym ALOUANE
M Najeh KHALED
Anneacutee universitaire 2015-2016
Signatures des encadrants
Encadrant PHILAE-IT
Encadrante ESPRIT
Mme Rim ALOUANE (Esprit)
Signature et cachet M Najeh KHALED
Signature Mme Rym ALOUANE
Deacutedicace
A mes tregraves chers parents Habib et Dalila
Auxquels je dois ce que je suis Que Dieu vous protegravege
A mes chegraveres fregraveres Anis et Moetaz
Pour leur amour et leur incontestable appui
A la meacutemoire de mes grands-parents
Puisse Dieu les accueillir dans son infinie Miseacutericorde
A toute ma famille amp A tous mes chers amis
Je deacutedie ce travail agrave toutes les personnes chegraveres agrave mon cœur Qursquoelles trouvent
ici lrsquoexpression de toute ma gratitude et mon amour
Remerciement
CrsquoEST parce que jrsquoai beaucoup veacuteneacutereacute tous ceux qui mrsquoont encadreacute que je tiens vraiment
agrave leur faire part de toute ma reconnaissance et plus speacutecialement je tiens agrave remercier agrave travers
ces lignes
M Najeh KHALED mon encadrant pour son aide preacutecieuse et le temps qursquoil mrsquoa alloueacute
pour me guider et mrsquoaider pour mrsquointeacutegrer dans lrsquoenvironnement ses efficaces conseils et son
deacutevouement qui mrsquoont permis agrave bien mener ce travail
Mme Rym ALOUANE mon encadrante de lrsquouniversiteacute agrave qui jrsquoadresse un hommage
particulier pour sa disponibiliteacute ses suggestions et ses remarques
M Cleacutement TRUNG je porte un remerciement particulier agrave qui nrsquoa cesseacute de suivre chacun de
mes pas tout au long de ce projet pour ses encouragements ses conseils sa rigueur dans le
travail
A tous ceux qui directement ou indirectement ont aideacute agrave la finalisation de ce travail
A Messieurs les membres de lrsquohonorable jury qursquoils trouvent ici lrsquoexpression de ma
gratitude pour avoir accepteacute de juger mon travail
Table des matiegraveres
INTRODUCTION GENERALE 1
Chapitre 1 ETAT DE LrsquoART 3
I Cadre du projet 4
II Preacutesentation de la socieacuteteacute accueillante 4
1 Preacutesentation geacuteneacuterale 4
2 Domaine drsquoactiviteacute 5
III Etude de lrsquoexistant 5
1 Ratp 6
2 Moobee Bus 6
IV Probleacutematique 7
V Solution proposeacutee 8
VI Meacutethodologie de deacuteveloppement 8
1 Un comparatif des meacutethodologies 8
2 Justification du choix de la meacutethodologie 10
3 Application de la meacutethodologie 2TUP sur notre projet 12
4 Gestion de projet Maven 13
Chapitre 2 Analyse et speacutecification des besoins 15
I Speacutecification fonctionnelle 16
1 Besoins fonctionnels 16
2 Besoins non-fonctionnels 17
3 Modeacutelisation des besoins 18
31 Identification des acteurs 18
32 Description des cas drsquoutilisation 19
33 Diagramme de seacutequence systegraveme 22
II Speacutecification technique 27
1 Choix technologique 27
11 Langage de deacuteveloppement 27
12 Framework 27
13 API Utiliseacutees 29
2 Choix Architectural 31
21 Architectures Multi-tiers 31
22 Architecture adopteacutee 32
Chapitre 3 Etude conceptuelle 34
I Conception preacuteliminaire 35
1 Diagramme de deacuteploiement 35
2 Diagramme de classe drsquoanalyse 36
II Conception deacutetailleacute 38
1 Les patrons de conception 38
11 Service Locator 38
12 Business Delegate 38
13 MVC (Model-View-Controller) 38
2 Diagramme de seacutequence objet 39
21 Diagramme de seacutequence objet laquo Authentification raquo 39
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo 40
23 Diagramme de seacutequence objet laquo geacuterer notification raquo 41
Chapitre 4 Codage et tests 43
I Environnement de travail 44
1 Environnement mateacuteriel 44
2 Environnement logiciel 44
II Les nouvelles technologies utiliseacutees 46
III Chronogramme drsquoavancement du projet 46
IV Preacutesentation des interfaces 47
1 Interface accueil utilisateur 47
2 Interface Consultation du reacuteseaux des stations sur Paris 48
3 Interface traccedilage du plus court chemin 49
4 Interface consultation de la position du bus et notifications 50
5 Interface de gestions de notification 51
V Tests et validation 52
1 Test des API 52
2 Test de compatibiliteacute mobile 53
CONCLUSION et PERSPECTIVES 55
Webographie 56
Glossaire 57
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Signatures des encadrants
Encadrant PHILAE-IT
Encadrante ESPRIT
Mme Rim ALOUANE (Esprit)
Signature et cachet M Najeh KHALED
Signature Mme Rym ALOUANE
Deacutedicace
A mes tregraves chers parents Habib et Dalila
Auxquels je dois ce que je suis Que Dieu vous protegravege
A mes chegraveres fregraveres Anis et Moetaz
Pour leur amour et leur incontestable appui
A la meacutemoire de mes grands-parents
Puisse Dieu les accueillir dans son infinie Miseacutericorde
A toute ma famille amp A tous mes chers amis
Je deacutedie ce travail agrave toutes les personnes chegraveres agrave mon cœur Qursquoelles trouvent
ici lrsquoexpression de toute ma gratitude et mon amour
Remerciement
CrsquoEST parce que jrsquoai beaucoup veacuteneacutereacute tous ceux qui mrsquoont encadreacute que je tiens vraiment
agrave leur faire part de toute ma reconnaissance et plus speacutecialement je tiens agrave remercier agrave travers
ces lignes
M Najeh KHALED mon encadrant pour son aide preacutecieuse et le temps qursquoil mrsquoa alloueacute
pour me guider et mrsquoaider pour mrsquointeacutegrer dans lrsquoenvironnement ses efficaces conseils et son
deacutevouement qui mrsquoont permis agrave bien mener ce travail
Mme Rym ALOUANE mon encadrante de lrsquouniversiteacute agrave qui jrsquoadresse un hommage
particulier pour sa disponibiliteacute ses suggestions et ses remarques
M Cleacutement TRUNG je porte un remerciement particulier agrave qui nrsquoa cesseacute de suivre chacun de
mes pas tout au long de ce projet pour ses encouragements ses conseils sa rigueur dans le
travail
A tous ceux qui directement ou indirectement ont aideacute agrave la finalisation de ce travail
A Messieurs les membres de lrsquohonorable jury qursquoils trouvent ici lrsquoexpression de ma
gratitude pour avoir accepteacute de juger mon travail
Table des matiegraveres
INTRODUCTION GENERALE 1
Chapitre 1 ETAT DE LrsquoART 3
I Cadre du projet 4
II Preacutesentation de la socieacuteteacute accueillante 4
1 Preacutesentation geacuteneacuterale 4
2 Domaine drsquoactiviteacute 5
III Etude de lrsquoexistant 5
1 Ratp 6
2 Moobee Bus 6
IV Probleacutematique 7
V Solution proposeacutee 8
VI Meacutethodologie de deacuteveloppement 8
1 Un comparatif des meacutethodologies 8
2 Justification du choix de la meacutethodologie 10
3 Application de la meacutethodologie 2TUP sur notre projet 12
4 Gestion de projet Maven 13
Chapitre 2 Analyse et speacutecification des besoins 15
I Speacutecification fonctionnelle 16
1 Besoins fonctionnels 16
2 Besoins non-fonctionnels 17
3 Modeacutelisation des besoins 18
31 Identification des acteurs 18
32 Description des cas drsquoutilisation 19
33 Diagramme de seacutequence systegraveme 22
II Speacutecification technique 27
1 Choix technologique 27
11 Langage de deacuteveloppement 27
12 Framework 27
13 API Utiliseacutees 29
2 Choix Architectural 31
21 Architectures Multi-tiers 31
22 Architecture adopteacutee 32
Chapitre 3 Etude conceptuelle 34
I Conception preacuteliminaire 35
1 Diagramme de deacuteploiement 35
2 Diagramme de classe drsquoanalyse 36
II Conception deacutetailleacute 38
1 Les patrons de conception 38
11 Service Locator 38
12 Business Delegate 38
13 MVC (Model-View-Controller) 38
2 Diagramme de seacutequence objet 39
21 Diagramme de seacutequence objet laquo Authentification raquo 39
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo 40
23 Diagramme de seacutequence objet laquo geacuterer notification raquo 41
Chapitre 4 Codage et tests 43
I Environnement de travail 44
1 Environnement mateacuteriel 44
2 Environnement logiciel 44
II Les nouvelles technologies utiliseacutees 46
III Chronogramme drsquoavancement du projet 46
IV Preacutesentation des interfaces 47
1 Interface accueil utilisateur 47
2 Interface Consultation du reacuteseaux des stations sur Paris 48
3 Interface traccedilage du plus court chemin 49
4 Interface consultation de la position du bus et notifications 50
5 Interface de gestions de notification 51
V Tests et validation 52
1 Test des API 52
2 Test de compatibiliteacute mobile 53
CONCLUSION et PERSPECTIVES 55
Webographie 56
Glossaire 57
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Deacutedicace
A mes tregraves chers parents Habib et Dalila
Auxquels je dois ce que je suis Que Dieu vous protegravege
A mes chegraveres fregraveres Anis et Moetaz
Pour leur amour et leur incontestable appui
A la meacutemoire de mes grands-parents
Puisse Dieu les accueillir dans son infinie Miseacutericorde
A toute ma famille amp A tous mes chers amis
Je deacutedie ce travail agrave toutes les personnes chegraveres agrave mon cœur Qursquoelles trouvent
ici lrsquoexpression de toute ma gratitude et mon amour
Remerciement
CrsquoEST parce que jrsquoai beaucoup veacuteneacutereacute tous ceux qui mrsquoont encadreacute que je tiens vraiment
agrave leur faire part de toute ma reconnaissance et plus speacutecialement je tiens agrave remercier agrave travers
ces lignes
M Najeh KHALED mon encadrant pour son aide preacutecieuse et le temps qursquoil mrsquoa alloueacute
pour me guider et mrsquoaider pour mrsquointeacutegrer dans lrsquoenvironnement ses efficaces conseils et son
deacutevouement qui mrsquoont permis agrave bien mener ce travail
Mme Rym ALOUANE mon encadrante de lrsquouniversiteacute agrave qui jrsquoadresse un hommage
particulier pour sa disponibiliteacute ses suggestions et ses remarques
M Cleacutement TRUNG je porte un remerciement particulier agrave qui nrsquoa cesseacute de suivre chacun de
mes pas tout au long de ce projet pour ses encouragements ses conseils sa rigueur dans le
travail
A tous ceux qui directement ou indirectement ont aideacute agrave la finalisation de ce travail
A Messieurs les membres de lrsquohonorable jury qursquoils trouvent ici lrsquoexpression de ma
gratitude pour avoir accepteacute de juger mon travail
Table des matiegraveres
INTRODUCTION GENERALE 1
Chapitre 1 ETAT DE LrsquoART 3
I Cadre du projet 4
II Preacutesentation de la socieacuteteacute accueillante 4
1 Preacutesentation geacuteneacuterale 4
2 Domaine drsquoactiviteacute 5
III Etude de lrsquoexistant 5
1 Ratp 6
2 Moobee Bus 6
IV Probleacutematique 7
V Solution proposeacutee 8
VI Meacutethodologie de deacuteveloppement 8
1 Un comparatif des meacutethodologies 8
2 Justification du choix de la meacutethodologie 10
3 Application de la meacutethodologie 2TUP sur notre projet 12
4 Gestion de projet Maven 13
Chapitre 2 Analyse et speacutecification des besoins 15
I Speacutecification fonctionnelle 16
1 Besoins fonctionnels 16
2 Besoins non-fonctionnels 17
3 Modeacutelisation des besoins 18
31 Identification des acteurs 18
32 Description des cas drsquoutilisation 19
33 Diagramme de seacutequence systegraveme 22
II Speacutecification technique 27
1 Choix technologique 27
11 Langage de deacuteveloppement 27
12 Framework 27
13 API Utiliseacutees 29
2 Choix Architectural 31
21 Architectures Multi-tiers 31
22 Architecture adopteacutee 32
Chapitre 3 Etude conceptuelle 34
I Conception preacuteliminaire 35
1 Diagramme de deacuteploiement 35
2 Diagramme de classe drsquoanalyse 36
II Conception deacutetailleacute 38
1 Les patrons de conception 38
11 Service Locator 38
12 Business Delegate 38
13 MVC (Model-View-Controller) 38
2 Diagramme de seacutequence objet 39
21 Diagramme de seacutequence objet laquo Authentification raquo 39
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo 40
23 Diagramme de seacutequence objet laquo geacuterer notification raquo 41
Chapitre 4 Codage et tests 43
I Environnement de travail 44
1 Environnement mateacuteriel 44
2 Environnement logiciel 44
II Les nouvelles technologies utiliseacutees 46
III Chronogramme drsquoavancement du projet 46
IV Preacutesentation des interfaces 47
1 Interface accueil utilisateur 47
2 Interface Consultation du reacuteseaux des stations sur Paris 48
3 Interface traccedilage du plus court chemin 49
4 Interface consultation de la position du bus et notifications 50
5 Interface de gestions de notification 51
V Tests et validation 52
1 Test des API 52
2 Test de compatibiliteacute mobile 53
CONCLUSION et PERSPECTIVES 55
Webographie 56
Glossaire 57
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Remerciement
CrsquoEST parce que jrsquoai beaucoup veacuteneacutereacute tous ceux qui mrsquoont encadreacute que je tiens vraiment
agrave leur faire part de toute ma reconnaissance et plus speacutecialement je tiens agrave remercier agrave travers
ces lignes
M Najeh KHALED mon encadrant pour son aide preacutecieuse et le temps qursquoil mrsquoa alloueacute
pour me guider et mrsquoaider pour mrsquointeacutegrer dans lrsquoenvironnement ses efficaces conseils et son
deacutevouement qui mrsquoont permis agrave bien mener ce travail
Mme Rym ALOUANE mon encadrante de lrsquouniversiteacute agrave qui jrsquoadresse un hommage
particulier pour sa disponibiliteacute ses suggestions et ses remarques
M Cleacutement TRUNG je porte un remerciement particulier agrave qui nrsquoa cesseacute de suivre chacun de
mes pas tout au long de ce projet pour ses encouragements ses conseils sa rigueur dans le
travail
A tous ceux qui directement ou indirectement ont aideacute agrave la finalisation de ce travail
A Messieurs les membres de lrsquohonorable jury qursquoils trouvent ici lrsquoexpression de ma
gratitude pour avoir accepteacute de juger mon travail
Table des matiegraveres
INTRODUCTION GENERALE 1
Chapitre 1 ETAT DE LrsquoART 3
I Cadre du projet 4
II Preacutesentation de la socieacuteteacute accueillante 4
1 Preacutesentation geacuteneacuterale 4
2 Domaine drsquoactiviteacute 5
III Etude de lrsquoexistant 5
1 Ratp 6
2 Moobee Bus 6
IV Probleacutematique 7
V Solution proposeacutee 8
VI Meacutethodologie de deacuteveloppement 8
1 Un comparatif des meacutethodologies 8
2 Justification du choix de la meacutethodologie 10
3 Application de la meacutethodologie 2TUP sur notre projet 12
4 Gestion de projet Maven 13
Chapitre 2 Analyse et speacutecification des besoins 15
I Speacutecification fonctionnelle 16
1 Besoins fonctionnels 16
2 Besoins non-fonctionnels 17
3 Modeacutelisation des besoins 18
31 Identification des acteurs 18
32 Description des cas drsquoutilisation 19
33 Diagramme de seacutequence systegraveme 22
II Speacutecification technique 27
1 Choix technologique 27
11 Langage de deacuteveloppement 27
12 Framework 27
13 API Utiliseacutees 29
2 Choix Architectural 31
21 Architectures Multi-tiers 31
22 Architecture adopteacutee 32
Chapitre 3 Etude conceptuelle 34
I Conception preacuteliminaire 35
1 Diagramme de deacuteploiement 35
2 Diagramme de classe drsquoanalyse 36
II Conception deacutetailleacute 38
1 Les patrons de conception 38
11 Service Locator 38
12 Business Delegate 38
13 MVC (Model-View-Controller) 38
2 Diagramme de seacutequence objet 39
21 Diagramme de seacutequence objet laquo Authentification raquo 39
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo 40
23 Diagramme de seacutequence objet laquo geacuterer notification raquo 41
Chapitre 4 Codage et tests 43
I Environnement de travail 44
1 Environnement mateacuteriel 44
2 Environnement logiciel 44
II Les nouvelles technologies utiliseacutees 46
III Chronogramme drsquoavancement du projet 46
IV Preacutesentation des interfaces 47
1 Interface accueil utilisateur 47
2 Interface Consultation du reacuteseaux des stations sur Paris 48
3 Interface traccedilage du plus court chemin 49
4 Interface consultation de la position du bus et notifications 50
5 Interface de gestions de notification 51
V Tests et validation 52
1 Test des API 52
2 Test de compatibiliteacute mobile 53
CONCLUSION et PERSPECTIVES 55
Webographie 56
Glossaire 57
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Table des matiegraveres
INTRODUCTION GENERALE 1
Chapitre 1 ETAT DE LrsquoART 3
I Cadre du projet 4
II Preacutesentation de la socieacuteteacute accueillante 4
1 Preacutesentation geacuteneacuterale 4
2 Domaine drsquoactiviteacute 5
III Etude de lrsquoexistant 5
1 Ratp 6
2 Moobee Bus 6
IV Probleacutematique 7
V Solution proposeacutee 8
VI Meacutethodologie de deacuteveloppement 8
1 Un comparatif des meacutethodologies 8
2 Justification du choix de la meacutethodologie 10
3 Application de la meacutethodologie 2TUP sur notre projet 12
4 Gestion de projet Maven 13
Chapitre 2 Analyse et speacutecification des besoins 15
I Speacutecification fonctionnelle 16
1 Besoins fonctionnels 16
2 Besoins non-fonctionnels 17
3 Modeacutelisation des besoins 18
31 Identification des acteurs 18
32 Description des cas drsquoutilisation 19
33 Diagramme de seacutequence systegraveme 22
II Speacutecification technique 27
1 Choix technologique 27
11 Langage de deacuteveloppement 27
12 Framework 27
13 API Utiliseacutees 29
2 Choix Architectural 31
21 Architectures Multi-tiers 31
22 Architecture adopteacutee 32
Chapitre 3 Etude conceptuelle 34
I Conception preacuteliminaire 35
1 Diagramme de deacuteploiement 35
2 Diagramme de classe drsquoanalyse 36
II Conception deacutetailleacute 38
1 Les patrons de conception 38
11 Service Locator 38
12 Business Delegate 38
13 MVC (Model-View-Controller) 38
2 Diagramme de seacutequence objet 39
21 Diagramme de seacutequence objet laquo Authentification raquo 39
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo 40
23 Diagramme de seacutequence objet laquo geacuterer notification raquo 41
Chapitre 4 Codage et tests 43
I Environnement de travail 44
1 Environnement mateacuteriel 44
2 Environnement logiciel 44
II Les nouvelles technologies utiliseacutees 46
III Chronogramme drsquoavancement du projet 46
IV Preacutesentation des interfaces 47
1 Interface accueil utilisateur 47
2 Interface Consultation du reacuteseaux des stations sur Paris 48
3 Interface traccedilage du plus court chemin 49
4 Interface consultation de la position du bus et notifications 50
5 Interface de gestions de notification 51
V Tests et validation 52
1 Test des API 52
2 Test de compatibiliteacute mobile 53
CONCLUSION et PERSPECTIVES 55
Webographie 56
Glossaire 57
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
22 Architecture adopteacutee 32
Chapitre 3 Etude conceptuelle 34
I Conception preacuteliminaire 35
1 Diagramme de deacuteploiement 35
2 Diagramme de classe drsquoanalyse 36
II Conception deacutetailleacute 38
1 Les patrons de conception 38
11 Service Locator 38
12 Business Delegate 38
13 MVC (Model-View-Controller) 38
2 Diagramme de seacutequence objet 39
21 Diagramme de seacutequence objet laquo Authentification raquo 39
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo 40
23 Diagramme de seacutequence objet laquo geacuterer notification raquo 41
Chapitre 4 Codage et tests 43
I Environnement de travail 44
1 Environnement mateacuteriel 44
2 Environnement logiciel 44
II Les nouvelles technologies utiliseacutees 46
III Chronogramme drsquoavancement du projet 46
IV Preacutesentation des interfaces 47
1 Interface accueil utilisateur 47
2 Interface Consultation du reacuteseaux des stations sur Paris 48
3 Interface traccedilage du plus court chemin 49
4 Interface consultation de la position du bus et notifications 50
5 Interface de gestions de notification 51
V Tests et validation 52
1 Test des API 52
2 Test de compatibiliteacute mobile 53
CONCLUSION et PERSPECTIVES 55
Webographie 56
Glossaire 57
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Liste des figures
Figure 1 Logo de la socieacuteteacute Philae-IT 4
Figure 2 Logo Ratp 6
Figure 3Logo Mobee 7
Figure 4 Le processus de deacuteveloppement en Y 11
Figure 5 Application de la meacutethodologie 2TUP sur notre projet 13
Figure 6 Architecture du module web du projet 14
Figure 7 Diagramme de cas dutilisation geacuteneacuteral 20
Figure 9 Use Case Tracer le plus court chemin 21
Figure 10 Use Case Afficher lrsquoensemble de notifications 22
Figure 11 Diagramme de seacutequence Authentification 23
Figure 12 Diagramme de seacutequence systegraveme tracer le plus court chemin 24
Figure 13 Diagramme de seacutequence systegraveme afficher ensemble de notification 25
Figure 142 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d 26
Figure 15 Logo Java 27
Figure 16 Logo Hibernate 28
Figure 17 logo JSF framework 29
Figure 18 logo Google Maps 29
Figure 19 logo MapsHere 30
Figure 20 logo OpenStreetMap 30
Figure 21 logo de Twilio 31
Figure 22 Scheacutema de larchitecture 3-tierces adopteacutee 32
Figure 23 Diagramme de deacuteploiement 35
Figure 24 Diagramme de classe 37
Figure 25 Diagramme seacutequence objet Authentification 40
Figure 26Diagramme seacutequence objet laquo afficher ensemble de notification raquo 41
Figure 27 Diagramme seacutequence objet laquo geacuterer les notifications raquo 42
Figure 28 Chronogramme du projet 46
Figure 29 Interface daccueil utilisateur 47
Figure 30 Interface consultation du reacuteseau des stations sur Paris 48
Figure 31 Interface traccedilage du plus court chemin 49
Figure 32 Interface consultation de la position du bus 50
Figure 33 Interface gestion de notifications 51
Figure 35 Interface de test avec loutil Postmanp 52
Figure 36Interface de test de compatibiliteacute mobile sur un iphone 5 53
Figure 37Test de compatibiliteacute sur une ipad 54
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Liste des tableaux
Tableau 1 Comparatif des meacutethodologies 10
Tableau 2 Identification des acteurs 18
Tableau 3 Afficher lrsquoensemble de notifications 22
Tableau 4 Environnement de travail mateacuteriel 44
Tableau 5 Environnement de travail logiciel 44
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Introduction geacuteneacuterale
1
INTRODUCTION GENERALE
La reacutevolution numeacuterique ces derniegraveres anneacutees a connu une croissance exponentielle
soutenue avec le deacuteveloppement de lrsquoInternet mobile du big data et lrsquoapparition de lrsquoopen data
Tout cela modifie profondeacutement les maniegraveres traditionnelles de lrsquousage des diffeacuterents services
agrave lrsquoinstar du transport en commun Ces eacutevolutions font eacutemerger de nouvelles solutions au profit
des socieacuteteacutes de transport afin de bien geacuterer la mobiliteacute des voyageurs et creacuteer drsquoautres usages
comme les flux urbains les systegravemes dinformation voyageur la gestion de flottes de transport
collectif lrsquoaide agrave la gestion du trafic et loptimisation de lutilisation des infrastructures de
transport
En effet ces nouveaux systegravemes qui ont vu le jour sont connus sous le nom de systegravemes de
transport intelligents (STI) [1] qui deacutesignent les applications des nouvelles technologies de
linformation et de la communication au domaine des transports On les dit Intelligents parce
que leur deacuteveloppement repose sur des fonctions geacuteneacuteralement associeacutees agrave lintelligence
capaciteacute sensorielles meacutemoire communication traitement de linformation et comportement
adaptatif
On trouve les STI dans plusieurs champs dactiviteacute incorporeacute avec leurs diffeacuterents services
offerts aux gestionnaires et aux usagers (particuliers et professionnels) agrave lrsquoinstar du traitement
de lrsquoinformation en situation normale et perturbeacutee ainsi que la gestion de flotte de transport
collectif pour expeacuterimenter de nouveaux dispositifs (transports multimodaux carrefours
intelligents parkings dynamiques voitures connecteacutees et autonomeshellip) au service drsquoune
mobiliteacute plus harmonieuse pour le citoyen et lrsquoenvironnement
Le preacutesent document se deacutecompose en quatre grands chapitres qui retracent de faccedilon logique et
chronologique les diffeacuterents travaux meneacutes pendant ce projet
Dans le premier chapitre nous commenccedilant par introduire le cadre geacuteneacuteral du travail agrave savoir
la preacutesentation de lrsquoorganisme drsquoaccueil et le contexte du projet et en second lieu une eacutetude de
lart sera deacutecrite qui comprendra une eacutetude de lrsquoexistant les probleacutematiques poseacutees la solution
proposeacutee et enfin la meacutethodologie adopteacutee pour la reacutealisation
Dans le deuxiegraveme chapitre nous exposerons lanalyse des besoins tout en eacutetablissant une eacutetude
preacuteliminaire diviseacutee en deux ses deux grand aspect fonctionnel et technique la speacutecification
fonctionnelle qui contiendra une eacutenumeacuteration des besoins fonctionnels et non fonctionnels de
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
Introduction geacuteneacuterale
2
la solution proposeacutee avec une illustration des diagrammes de calts drsquoutilisation et la
speacutecification technique qui comprendra les choix technologiques et architecturaux
Au cours du troisiegraveme chapitre nous traiterons lrsquoeacutetude conceptuelle qui sera preacutesenteacute sur
deux eacutetapes la conception preacuteliminaire suivie de la conception deacutetailleacutee
Dans le quatriegraveme et le dernier chapitre nous deacutetaillerons la phase du codage Tout dabord
lrsquoaccent sera mise sur lrsquoenvironnement du travail Ensuite une eacutenumeacuteration de la totaliteacute des
fonctionnaliteacutes offertes par lapplication sera deacutetailleacutee agrave travers lrsquoillustration de quelques
interfaces Par la suite une description de lrsquoeacutetape des tests et de validation sera preacutesenteacutee
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
3
Chapitre 1 ETAT DE LrsquoART
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
4
Introduction
Ce preacutesent chapitre sera deacutedieacute agrave la mise en place de notre projet dans son cadre geacuteneacuteral Dans
une premiegravere section nous preacutesenterons le cadre du projet La deuxiegraveme section a pour objectif
de donner un aperccedilu sur la socieacuteteacute accueillante La troisiegraveme section deacutefinit les besoins agrave
remplir par lrsquoapplication ougrave nous exposons une eacutetude de lrsquoexistant ensuite nous aborderons la
probleacutematique et les diffeacuterents objectifs et enfin nous mettrons en exergue la meacutethodologie
retenue
I Cadre du projet
Ce projet rentre dans le cadre de projet de fin drsquoeacutetudes agrave lrsquoeacutecole supeacuterieure priveacutee drsquoingeacutenierie
et de technologies (ESPRIT) en vue de lrsquoobtention du diplocircme drsquoingeacutenieur en informatique Il
consiste en lrsquoeacutetude la conception et lrsquoimpleacutementation drsquoune plateforme preacutesentant un systegraveme
de notification et alerte drsquoune tourneacutee de bus sous forme dune application web
Le projet srsquoest deacuterouleacute au sein de la socieacuteteacute PHILAE-IT durant la peacuteriode du 17 deacutecembre 2015
au 26 Mai 2016
II Preacutesentation de la socieacuteteacute accueillante
1 Preacutesentation geacuteneacuterale
Philae-IT est un cabinet de conseil en systegraveme informatique agrave forte valeur ajouteacutee
regroupe aujourdrsquohui plus de 15 ingeacutenieurs Elle a eacuteteacute fondeacutee en 2014 par une eacutequipe de
professionnels expeacuterimenteacutes et est actuellement installeacutee agrave Paris et agrave Monastir
Figure 1 Logo de la socieacuteteacute Philae-IT
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
5
2 Domaine drsquoactiviteacute
PHILAE-IT met tout son expertise technique et son savoir-faire au service de ses clients
pour leur apporter lassistance technique neacutecessaire pour la reacuteussite de leurs projets SI et son
domaine drsquoactiviteacute se preacutesente sur 3 axes drsquoexpertises principaux
Expertise en architecture IT
Choix et validation darchitectures
Strateacutegie de migration technologique
Expertise en deacuteveloppement et inteacutegration drsquoapplications
Accompagnement au deacutemarrage du projet
Choix et validation de solutions techniques ( DA SFD SFT)
Impleacutementation de la solution technique
Strateacutegie de tests
Recette
Audit et diagnostic Seacutecuriteacute Performance code quality
Expertise organisationnelle
Meacutethodologies Agiles coaching SCRUM XP
Organisation de projet dexternalisation IT nearshore et offshore
III Etude de lrsquoexistant
Apregraves avoir fait une eacutetude approfondie sur les applications mises agrave la disposition de
lrsquoutilisateur nous preacutesentons une eacutetude comparative et critique des applications existantes et
les plus utiliseacutes en France afin dintroduire notre solution proposeacutee
A lrsquoattention de cette partie nous effectuons une description et une analyse de quelques
applications existante pour faciliter les transports au quotidien avec les autobus
Les applications les plus connus et les plus utiliseacutees en France offrant des services optimiseacutes
pour la geacuteolocalisation des bus et les horaires des tourneacutees sont
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
6
1 Ratp
Crsquoest lrsquoapplication web de reacutefeacuterence pour les transports en communs (RER Meacutetro Bus) agrave Paris
et aux banlieues Crsquoest lrsquoapplication officielle de la RATP elle est tregraves complegravete et dispose de
nombreuses fonctionnaliteacutes (Horaires Itineacuteraires Prochains passageshellip)
Figure 2 Logo Ratp
Les avantages
Geacuteolocalisation des stations RER Meacutetro Bus Tramway et plan des meacutetros
Consultation des horaires des prochains passages (bus + meacutetro)
Consultation du bulletin de trafic routier
Localisation des stations de bus et de meacutetro les plus proches
Personnalisation de la page drsquoaccueil pour consulter les horaires favoris
Les Inconveacutenients
Manque de clarteacute et drsquoergonomie de lrsquointerface
Absence de plusieurs fonctionnaliteacutes innovantes comme lrsquoalerte routier communication
des utilisateurs entre eux
Absence de notification de lrsquoarriveacutee du bus ou la possibiliteacute de visualiser sa position en
temps reacuteel
2 Moobee Bus
Crsquoest une application web munie drsquoune carte interactive complegravete qui permet drsquoavoir un visuel
rapide sur la disposition des stations de bus ainsi que les horaires de leurs deacuteparts et arriveacutes
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
7
Figure 3Logo Mobee
Les avantages
Preacutesence de lrsquoinformation sur le trafic ainsi que les eacuteventuelles perturbations routiegraveres
Deacutefinition du trajet cela dit possibiliteacute de deacutefinir des laquo Lignes favorites raquo
Identification des arrecircts de bus et de meacutetro par itineacuteraire
Affichage de la plus proche station depuis la position actuelle de lrsquoutilisateur jusqursquoau
un autre point
Les inconveacutenients
Lrsquoapplication est payante
Absence drsquoune alternative de notification en cas de rupture de connexion
IV Probleacutematique
Dans le contexte concurrentiel daujourdhui entre les agences drsquoautobus pour bien gagner
sa part de clientegravele du marcheacute et dans le but de reacutesoudre les problegraveme deacutetecteacutes dans les solutions
concurrente en offrant une application gratuite complegravete et fonctionnelle en toute
circonstance laquo absence de connexion raquo notre client a trouveacute indispensable de deacutevelopper une
application qui va reacutesoudre les problegravemes un peu lieacutes aux perturbations routiegraveres en notifiant
lrsquoutilisateur sur le trafic aux horaires exactes des tourneacutees de bus ainsi le suivi du bus
La reacutesolution de ces problegravemes et lrsquoajout de nouveaux services assurera la fideacutelisation de ses
utilisateurs ainsi eacutetendra la flotte de sa clientegravele pour faire face agrave la concurrence accru des
autre agences de bus
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
8
V Solution proposeacutee
Lobjectif de notre projet est de deacutevelopper une application qui preacutesente un ensemble de services
pour faciliter la vie aux voyageurs et qui permettra
La consultation des diffeacuterents horaires des tourneacutees de bus
Lrsquoaffichage en temps reacuteel la position du bus sur une ligne particuliegravere
Lrsquoaffichage du temps restant jusqursquoau passage du prochain bus agrave lrsquoarrecirct
Le traccedilage du plus court chemin que lrsquoutilisateur doit prendre depuis sa position
actuelle pour aller agrave une station de bus tout en choisissant le mode de parcours et en
afficher la dureacutee ainsi que la distance agrave parcourir
Simulation drsquoune visite touristique en 3D sur la ligne 58 qui relie Chacirctelet agrave Vanves
Lrsquoaffichage de lrsquoensemble de reacuteseau de station de bus sur toute Paris agrave lrsquoaide drsquoune
carte interactif
Gestion du trafic routiegravere et des urgences
Notification par SMS ou par PUSH lrsquoutilisateur de lrsquoapproche de son bus ou drsquoune
autre information urgente
VI Meacutethodologie de deacuteveloppement
Lors du deacuteveloppement de tout projet il est impeacuterativement conseilleacute afin drsquoassurer son
eacutevolution de suivre un processus et une meacutethode de conception afin de creacuteer des applications
consistantes drsquoestimer le temps de deacuteveloppement et drsquoaugmenter la productiviteacute
1 Un comparatif des meacutethodologies
Au cours de ce paragraphe nous allons essayer drsquoeacutenumeacuterer quelques-unes des meacutethodes de
deacuteveloppement agiles les plus connues afin de deacutegager les diffeacuterences entre elles et ceci en
fournissant un tableau comparatif de ces derniegraveres Le tableau suivant Tableau 1 compare
sommairement les meacutethodes courantes suivantes
ndash Two Track Unified Process (2TUP)
ndash Extreme Programming (XP)
ndash Rational Unified Process (RUP)
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
9
Meacutethode Description Points cleacutes Inconveacutenients
XP
-Ensemble de bonne
pratiques de
deacuteveloppement (travail
en eacutequipe transfert de
compeacutetences)
-Ciblage de projet
moins de 10 personnes
Le deacuteveloppement est piloteacute
par les besoins du client
- Les eacutequipes sont reacuteduites et
centreacutees sur le deacuteveloppement
par binocircme
-Les builds sont journaliers
-Ameacutelioration constante
adaptabiliteacute et portabiliteacute aux
modifications
Focalisation sur lrsquoaspect
individuel du
deacuteveloppement au
deacutetriment drsquoune vue
globale et des pratiques de
management ou de
formalisation
Risque de manquer de
controcircle et de structuration
en laissant les
deacuteveloppeurs trop libres de
deacuteriver par rapport aux
fonctions de lrsquoapplication
RUP
-Elaboreacute par rational
-Le RUP est agrave la fois une
meacutethodologie et un outil
precirct agrave lrsquoemploi
-Cible de projet plus de
10 personnes
ndash Processus complet et assisteacute
agrave la fois par des outils
ndash Les Rocircles sont bien deacutefinis
Lourd largement eacutetendu
il peut ecirctre difficile agrave
mettre en œuvre de faccedilon
speacutecifique
Efficace pour les gros
projets qui geacutenegraverent
beaucoup de
documentation
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
10
2TUP
-Propose un cycle de
deacuteveloppement en Y
-Cible les projets de
toutes tailles
Propose un cycle de
deacuteveloppement qui seacutepare les
aspects fonctionnels des
aspects techniques
-Iteacuteratif
-Consacre une large place agrave la
technique et agrave la gestion du
risque
-Deacutefinit les profils des
intervenants les livrables les
plannings ainsi que les
prototypes
Validation trop tardive et
preacutesente un risque de
devenir tregraves couteuses si
des erreurs sont constateacutees
Tableau 1 Comparatif des meacutethodologies
2 Justification du choix de la meacutethodologie
Notre choix meacutethodologique srsquoest porteacute sur le processus unifieacute 2TUP pour les raisons suivantes
ndashLe projet est de nature assez speacuteciale vu le besoin drsquoune adeacutequation totale entres les exigences
techniques et les besoins en terme de fonctionnaliteacutes chez lrsquoutilisateur
-Le projet preacutesente au niveau technique une certaine complexiteacute vu la neacutecessiteacute de preacutevoir une
phase pour lrsquoeacutetude des exigences technique qursquoil faut prendre en consideacuteration
-A un instant donneacute pour veacuterifier de lrsquoadaptation entre lrsquoarchitecture technique et les besoins
de lrsquoutilisateur on doit faire une liaison entre le modegravele technique et le modegravele fonctionnel
Se basant sur un cycle en Y et vu que le projet ne preacutesente pas une complexiteacute au niveau
fonctionnel la meacutethodologie 2TUP est la plus adapteacutee
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
11
Deacutefinition de 2TUP
2TUP signifie laquo 2 tracks Unified Process raquo Crsquoest un processus qui reacutepond aux caracteacuteristiques
du processus Unifieacute et qui apporte une reacuteponse aux contraintes de changement continuel
imposeacutees aux systegravemes drsquoinformation de lrsquoentreprise En ce sens il renforce le controcircle sur les
capaciteacutes drsquoeacutevolution et de correction de tels systegravemes
On dit que la meacutethode 2TUP est geacuteneacuterique crsquoest-agrave-dire qursquoelle deacutefinit un certain nombre de
critegraveres de deacuteveloppement que chaque socieacuteteacute peut par la suite personnaliser afin de creacuteer son
propre processus plus adapteacute agrave ses besoins
laquo 2 tracks raquo signifient litteacuteralement que le processus suit deux chemins Il srsquoagit des laquo chemins
fonctionnels raquo et laquo drsquoarchitecture technique raquo qui correspondent aux deux axes de changement
imposeacute au systegraveme drsquoinformation
Figure 4 Le processus de deacuteveloppement en Y [2]
Branche fonctionnelle
Cette branche est constitueacutee de
La capture des besoins fonctionnels qui produisent le modegravele des besoins focaliseacutes sur
le meacutetier des utilisateurs Elle qualifie au plus tocirct le risque de produire un systegraveme
inadapteacute aux utilisateurs
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
12
Lrsquoanalyse consiste agrave eacutetudier preacuteciseacutement la speacutecification fonctionnelle et non-
fonctionnel de maniegravere agrave obtenir une ideacutee de ce que va reacutealiser le systegraveme en terme de
meacutetier
Branche technique
Cette branche se constitue de
La capture des besoins techniques qui deacutenombre la totaliteacute des contraintes sur les choix
de la conception du systegraveme
Le mateacuteriel et les outils seacutelectionneacutes ainsi que la prise en compte des contraintes
drsquointeacutegration avec lrsquoexistant srsquoil yrsquoen a
Branche conception
Cette branche est constitueacutee de
La conception preacuteliminaire qui repreacutesente une eacutetape tregraves importante et deacutelicate
puisqursquoau cours du quelle on integravegre notre modegravele drsquoanalyse fonctionnelle dans
lrsquoarchitecture technique de faccedilon agrave tracer la cartographie des composants du systegraveme agrave
deacutevelopper
La conception deacutetailleacutee qui eacutetudie ensuite comment reacutealiser chaque composant
Lrsquoeacutetape de codage qui assure la production de ces composants
3 Application de la meacutethodologie 2TUP sur notre projet
La figure suivante deacutecrit la meacutethodologie 2TUP exploiteacutees cela en deacutecortiquant les traces de
chacune de ces branches
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
13
Figure 5 Application de la meacutethodologie 2TUP sur notre projet
4 Gestion de projet Maven
Pour bien geacuterer et organiser notre projet et ses deacutependances nous avons choisi drsquoutiliser le
gestionnaire laquo Maven raquo Crsquoest un outil populaire utiliseacute largement dans le monde Java pour
le deacuteploiement et la construction des projets Il a eacuteteacute conccedilu de faccedilon agrave supprimer les tacircches
difficiles du processus de construction Maven utilise une approche deacuteclarative ougrave le contenu
et la structure du projet sont deacutecrits plutocirct quune approche par tacircche utiliseacutee par exemple par
laquo Ant raquo ou les fichiers make traditionnels Cela aide agrave mettre en place des standards de
deacuteveloppement au niveau dune socieacuteteacute et reacuteduit le temps neacutecessaire pour lrsquoeacutecriture le maintien
des scripts de construction et de deacuteploiement et le projet
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
14
Figure 6 Architecture du module web du projet
Conclusion
Tout au long de ce chapitre nous avons mis le projet dans son cadre preacutesenteacute lrsquoorganisme
drsquoaccueil Ensuite on a consacreacute une partie pour lrsquoeacutetude et lrsquoanalyse des diffeacuterentes applications
proposeacutees au marcheacute et deacutegageacute les probleacutematiques et la solution proposeacutee
A la fin apregraves lrsquoexploitation de la comparaison des meacutethodologies on a opteacute pour la meacutethode
de deacuteveloppement 2TUP
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
15
Chapitre 2 Analyse et speacutecification
des besoins
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
16
Introduction
Avant drsquoentamer le deacuteveloppement de notre projet il est neacutecessaire de bien identifier
caracteacuteriser et challenger lensemble des besoins des utilisateurs de prendre en compte
lenvironnement du projet et de clarifier les fonctions agrave inteacutegrer dans le projet Comme indiqueacute
dans le cadre meacutethodique dans le chapitre preacuteceacutedent nous allons suivre la meacutethodologie 2TUP
Leacutetude preacuteliminaire est la toute premiegravere eacutetape de ce processus Elle consiste agrave effectuer un
premier repeacuterage des besoins fonctionnels et techniques
I Speacutecification fonctionnelle
Lrsquoanalyse de ce sujet nous a permis lrsquoidentification des diffeacuterents besoins auxquels doit
reacutepondre notre application Ces besoins deacutegageacutes sont classeacutes en deux cateacutegories agrave savoir les
besoins fonctionnels et les besoins non fonctionnels
1 Besoins fonctionnels
Un besoin fonctionnel est un besoin speacutecifiant une action qursquoun systegraveme doit ecirctre capable
drsquoeffectuer sans consideacuterer aucune contrainte physique besoin speacutecifiant un comportement
drsquoentreacuteesortie drsquoun systegraveme Dans cette partie nous allons eacutenumeacuterer les diffeacuterents besoins que
doit assurer le systegraveme Dans notre contexte le systegraveme doit permettre les tacircches suivantes
Gestion de profil Client Le systegraveme doit permettre agrave lutilisateur de geacuterer son
espace personnel ougrave il peut ajouter et modifier des informations lui concernant ainsi que le
changement de la station du bus auquel il va srsquoabonner pour recevoir les notifications
Visualisation du reacuteseau de station de bus de la RATP sur toute la France Le
systegraveme doit permettre agrave lutilisateur de voir un large eacuteventail de station de bus sur une carte
interactive sous forme de bulles contenant le nombre de station relatif agrave chaque reacutegion
deacutepartement et rue ainsi drsquoautres informations entre autre les coordonneacutees geacuteographiques de
chaque station pour un eacuteventuel traccedilage du chemin le plus court vers celle-ci selon sa position
geacuteographique dans la carte
Simulation drsquoune visite touristique reacuteelle en 3d sur une ligne Le systegraveme doit
permettre agrave lutilisateur de visualiser sur deux cartes une simulation drsquoune visite touristique en
3D avec possibiliteacute de navigation sur les rues et changement drsquoangle
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
17
Traccedilage du plus court chemin vers une station Le systegraveme doit permettre agrave
lutilisateur de tracer le plus court chemin depuis sa position vers une station afficher une
estimation de la dureacutee la distance et un tableau de la direction agrave prendre chaque fois selon le
moyen qursquoil a choisi voiture agrave pied ou bicyclette
Consultation des horaires des tourneacutees de chaque journeacutee Le systegraveme doit
permettre agrave lutilisateur de consulter la liste de deacutebutfin de chaque tourneacutee de bus sur chaque
station
Echange de message avec les autres utilisateurs par chat Le systegraveme doit
permettre aux utilisateurs connecteacutes lrsquoeacutechange les messages de chat en temps reacuteel
Notification geacuteneacuterale par mode push Le systegraveme doit notifier lrsquoutilisateur de la
position actuelle du bus ainsi que la suivante station et lrsquoestimation du temps de son arriveacutee
Notification personnaliseacutee par mode push Le systegraveme doit notifier les utilisateurs
abonneacutes agrave une station N+1 de lrsquoapprochement du bus quand elle est agrave la station N
Geacuteneacuteration de statistiques et rapport concernant les utilisateurs Le systegraveme doit
geacuteneacuterer agrave lrsquoadministrateur les statistiques des utilisateurs filtreacutes par tranche drsquoacircge sexe et
fonction ainsi des rapports concernant leurs informations
Envoie des notifications Le systegraveme doit permettre agrave lrsquoadministrateur lrsquoenvoi des
files drsquoinformations urgentes concernant les lignes de bus drsquoenvoyer des notifications
personnaliseacutees par station ou des SMS aux utilisateurs
2 Besoins non-fonctionnels
Une fois les besoins fonctionnels sont bien deacutefinis les besoins non fonctionnels doivent ecirctre
pris en compte tout au long du processus de deacuteveloppement de lrsquoapplication agrave savoir
Rapiditeacute
Lapplication doit optimiser les traitements pour avoir un temps de geacuteneacuteration raisonnable des
cartes aussi que lrsquoaffichage des notifications
Convivialiteacute
Notre application doit fournir une interface ergonomique et conviviale (une interface facile agrave
manipuler des boutons ainsi que des libelleacutes significatifs un design agreacuteable etchellip)
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
18
Efficaciteacute
Lapplication doit ecirctre fonctionnelle indeacutependamment de toutes circonstances pouvant
entourer lutilisateur mecircme en absence drsquointernet
Modulariteacute
Lapplication doit ecirctre bien structureacutee en module pour assurer une meilleure lisibiliteacute une
diminution du risque derreur et une possibiliteacute de tests seacutelectifs
LEvolutiviteacute
Il est inteacuteressant que le logiciel assure un pouvoir drsquoeacutevolution de deacuteveloppement et
drsquoameacutelioration au cours du temps et ce selon les besoins de lrsquoutilisateur
3 Modeacutelisation des besoins
31 Identification des acteurs
Les acteurs sont les utilisateurs directs de lapplication ils interagissent avec agrave travers les
interfaces utilisateurs Dans ce projet nous nous sommes confronteacutes agrave deux acteurs qui
interagissent avec cette solution lrsquoutilisateur et ladministrateur
Acteur Description
Utilisateur
- Crsquoest lrsquoacteur principal de lrsquoapplication il a un ensemble complet de
services agrave consommer comme le traccedilage du plus court chemin entre deux
points Il peut aussi consulter lrsquoeacutetat de trafic reacutegler ses paramegravetres de
notification simuler des visites touristiques virtuelles communiquer
avec les autres utilisateurs connecteacutes consulter les horaires de tourneacutees
de bus
Administrateur
- Il est le geacuterant des services avec des outils incorporeacutes agrave son interface
il assurera le bon fonctionnement des services offerts au client
Tableau 2 Tableau didentification des acteurs
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
19
32 Description des cas drsquoutilisation
Dans le diagramme du cas drsquoutilisation geacuteneacuteral nous regroupons tous les cas drsquoutilisations
basique pour avoir une vue globale du fonctionnement de notre systegraveme et afin de mettre en
eacutevidence les eacuteventuels relations qui peuvent les relier
La figure ci-dessous illustre le cas drsquoutilisation geacuteneacuteral de lrsquoapplication ougrave le diagramme deacutecrit
les grandes fonctionnaliteacutes de lrsquoapplication de point de vue des acteurs mais nrsquoexpose pas de
faccedilon deacutetailleacutee le dialogue entre les acteurs Dans le chapitre qui suit nous deacutetaillerons avec
raffinement iteacuteratif diffeacuterents cas drsquoutilisation
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
20
Cas drsquoutilisation geacuteneacuteral
Figure 7 Diagramme de cas dutilisation geacuteneacuteral
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
21
Cas drsquoutilisation raffineacute laquo Tracer le plus court cheminraquo
Figure 8 Use Case Tracer le plus court chemin
Cas ndeg2 Tracer plus court chemin
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver le plus court chemin vers une station de bus la
distance agrave parcourir ainsi que la dureacutee pour y arriver
Deacuteclencheur Lrsquoutilisateur choisit le type de parcours adresse de deacutebutarriveacute ou tout simplement deacuteplace les deux
marqueurs sur la carte
Flot drsquoinformation Sceacutenario 1
1 LrsquoUtilisateur pointe le marqueur A sur sa position actuelle et deacuteplace le marqueur B sur sa
destination
2 Le systegraveme geacuteolocalise les deux points ensuite calcule la distance et la dureacutee
3 Le systegraveme trace un polyligne preacutesentant les directions agrave suivre et affiche un tableau avec les
eacutetapes agrave suivre chaque fois
Sceacutenario 2
1 Lrsquoutilisateur peut effectuer un filtrage du mode de parcours
2 Lrsquoutilisateur saisit lrsquoadresse de deacutepart et lrsquoadresse drsquoarriveacutee
3 Le systegraveme geacuteolocalise le plus court chemin disponibles selon le mode choisit par lrsquoutilisateur
4 Le systegraveme trace le plus court chemin et affiche la distance et la dureacutee pour y arriver
Extension Si le(s) mot(s) saisi(s) nrsquoest (sont) pas trouveacute(s) le systegraveme affiche un message indiquant qursquoaucun
endroits est disponible
Tableau 4 Tracer le plus court chemin
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
22
Cas drsquoutilisation raffineacute laquo Afficher lrsquoensemble de notificationsraquo
Figure 9 Use Case Afficher lrsquoensemble de notifications
Cas ndeg3 Afficher lrsquoensemble de notifications
Acteur Utilisateur
But Ce cas drsquoutilisation permet agrave un client de trouver liste des horaires des tourneacutees de bus afficher le trafic
routier ainsi que les actualiteacutes concernant sa ligne de bus
Deacuteclencheur Lrsquoutilisateur choisit lrsquoaffichage de lrsquoensemble de notification
Flot drsquoinformation
1 lrsquoutilisateur seacutelectionne la zone de notification
2 le systegraveme affiche une carte interactive avec le trafic et les perturbations routiegravere
3 le systegraveme reacutecupegraverent les notifications geacuteneacuterales et les affiches en dessous de la carte
4 le systegraveme reacutecupegravere les notifications propres agrave lrsquoutilisateur connecteacute et les affiche
Extension Lrsquoeacutetat du trafic nrsquoest pas agrave jour un message drsquoalerte srsquoaffiche pour notifier lrsquoutilisateur
Tableau 3 Afficher lrsquoensemble de notifications
33 Diagramme de seacutequence systegraveme
Le diagramme de seacutequence systegraveme deacutecrit la dynamique du systegraveme en effet il deacutecrit
linteraction entre les acteurs et le systegraveme
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
23
Cas authentification
Le diagramme ci-dessous preacutesente la premiegravere opeacuteration agrave effectuer par lrsquoutilisateur En fait
ce dernier doit saisir son login et son mot de passe pour se connecter agrave lrsquoapplication Srsquoil
nrsquoest pas reconnu par le systegraveme il ne sera pas autoriseacute agrave y acceacuteder et un message drsquoerreur
lui sera afficheacute
Figure 10 Diagramme de seacutequence Authentification
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
24
Cas tracer le plus court chemin
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut rechercher le plus court
chemin pour une station choisie apregraves une authentification sur le systegraveme En fait ce dernier
doit choisir le mode de parcours vers son point drsquoarriveacute il devra donc soit deacuteplacer les deux
marqueurs mises agrave sa disposition le premier sur son point de deacutepart lrsquoautre sur une des stations
de la ligne de bus 58 sachant que tous les reacutesultats fournis sont consommeacutes depuis lrsquoAPI
Google Direction
Figure 11 Diagramme de seacutequence systegraveme tracer le plus court chemin
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
25
Cas afficher ensemble de notification
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut afficher lrsquoensemble de
notification comme le trafic routier et les informations concernant les tourneacutees pour lignes de
bus En fait ce dernier doit seacutelectionner son dashboard sachant que tous les reacutesultats
fournis sont consommeacutes depuis lrsquoAPI(MapsHere) ou par notre base de donneacutees
Figure 12 Diagramme de seacutequence systegraveme afficher ensemble de notification
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
26
Cas simuler une visite touristique en 3D
Ce diagramme preacutesente lrsquoopeacuteration agrave effectuer par lrsquoutilisateur srsquoil veut lancer une simulation
3d drsquoune tourneacutee de bus sur la ligne 58 sur Paris depuis Chacirctelet vers Vanves En fait ce dernier
doit seacutelectionner Start a Touristic Tour pour commencer la visite
Figure 13 Diagramme de seacutequence systegraveme simuler une visite touristique en 3d
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
27
II Speacutecification technique
1 Choix technologique
11 Langage de deacuteveloppement
Java est un langage de deacuteveloppement orienteacute objet repreacutesentant la synthegravese des bons cocircteacutes de
plusieurs langage de programmation notamment C++ qui a reacuteussi agrave obtenir une tregraves grande
notorieacuteteacute en seulement quelques anneacutees gracircce agrave ses qualiteacutes De nos jours Java est largement
utiliseacute notamment en entreprise et pour les applications mobiles
Figure 14 Logo Java
12 Framework
Pour le besoin drsquoimpleacutementation et de mise en place de notre application nous avons eu
recours agrave lrsquoutilisation des frameworks suivants
JEE (Java Entreprise Edition)
Java EE est un ensemble de speacutecifications pour la technologie Java drsquooracle qui sont
impleacutementeacutes par diffeacuterent conteneurs preacutesentant les environnements drsquoexeacutecution pour le code
tout en offrant diffeacuterents services aux composants qursquoils heacutebergent injection de deacutependances
gestion de cycles de vie
La communication entre lrsquoinfrastructure de Java EE et les autres composants se fait tout
en respectant un certain standard (fichiers archives) avant decirctre deacuteployeacutes Java EE
eacutetant une partie sur tout un ensemble de la plate-forme Java SE favorise lrsquoutilisation des API
de cette derniegravere par nimporte quel composant de Java EE
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
28
Hibernate
Hibernate est le framework open-source Java utiliseacute pour geacuterer la persistance des donneacutees des
diffeacuterents systegravemes deacuteveloppeacutes lors de ce projet aussi la notion drsquoORM (Object Relational
Mapping) y est eacutegalement tregraves souvent associeacutes il srsquoagit drsquoune technique permettant de faire
correspondre des tables des objets et leurs relations dans une base de donneacutees relationnelles
Ce framework est tregraves largement utiliseacute tant dans le domaine de lrsquoentreprise que dans les
diffeacuterents projets open-source
Dans notre architecture laquo Hibernate raquo sera associeacute au systegraveme de gestion de base de
donneacutees (SGBD) laquo Mysql raquo Il srsquoagit lagrave encore drsquoun SGBD Open-Source qui a une
excellente reacuteputation aupregraves des programmeurs
Figure 15 Logo Hibernate
Java Server Faces (JSF)
Java Server Faces (JSF) [2] est un Framework java ayant pour objectif le deacuteveloppement des
applications web JSF est un Framework MVC baseacute sur la notion des composants cest-agrave-dire
que lrsquoeacutetat drsquoun composant est enregistreacute lors de rendu de la page pour ecirctre ensuite restaureacute au
retour de la requecircte Il est constitueacute essentiellement de
Un ensemble drsquoAPIs pour la gestion des composants des eacuteveacutenements de la validation des
entreacutees la conversion des sorties et lrsquoaccessibiliteacute ainsi que la navigation entre les vues
De jeux de composants standards HTML et Core
De bibliothegraveques de balises JSP pour la construction de vues JSF
Un modegravele eacuteveacutenementiel coteacute serveur
Les Managed-Beans qui preacutesentent la couche de controcircle de JSF
Langage drsquoexpression Unifieacute (EL) qui sert agrave la liaison entre la vue et les managed-
beans
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
29
Il existe plusieurs composants additionnels qui peuvent ecirctre utiliseacutes avec JSF on peut citer
JBOSS Richfaces et Ajax4JSF qui sont composeacutes drsquoun ensemble de composants riches libres
et supportant Ajax
Figure 16 logo JSF framework
13 API Utiliseacutees
Pour assurer lrsquoexploitation des diffeacuterents services de geacuteocodage en temps reacuteel lrsquoobtention des
diffeacuterentes stations du reacuteseau de la RATP sur toute la France lrsquoaffichage de trafic routier
quotidien on a eu recours agrave plusieurs API
Google Maps API
Google Maps [3] est un service gratuit de cartographie en ligne offrant un ensemble drsquoapi
performants et simple qui ont contribueacute agrave bien cerner et accomplir les fonctionnaliteacutes de notre
projet
Lrsquousage de ces diffeacuterent API se reacutesume comme suit
Google Direction API en effet avec les fonctionnaliteacute de geacuteocodage impleacutementer
par cette api notre application retournera le plus court chemin entre la position de
lrsquoutilisateur et la station cible ainsi que la dureacutee et la distance
Google Street View API qui a permis lrsquoaffichage et la navigation en 3d dans une
fenecirctre au fur et au mesure avec le deacuteplacement du bus pour en simuler une visite
touristique sur la ligne 58
Figure 17 logo Google Maps
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
30
MapsHere API
Maps Here [4] est une carte interactive qui affiche en temps reacuteel les trafics routiers les
constructions en cours et les perturbations tout en affichant leurs dates de deacutebut et de fin
Figure 18 logo MapsHere
OpenStreetMap
Nous avons eu recourt agrave cette carte qui preacutesente un outil tregraves puissant pour afficher lrsquoensemble de
toutes les stations de bus drsquoune maniegravere simple et eacuteleacutegante agrave travers des bulles interactives
Figure 19 logo OpenStreetMap
LrsquoApi nous permet
La recherche des endroits renvoie une liste des lieux baseacutes sur la localisation ou la
recherche de donneacutees saisies par lrsquoutilisateur
Lrsquoaffichage en deacutetail des endroits (restaurent cafeacuteshellip) suite agrave une simple requecircte
concernant un lieu speacutecifique y compris lrsquoaffichage des avis et notes des utilisateurs
Ajouter un endroit il nous permet drsquoajouter les donneacutees dans la base de donneacutees
de Google Places avec ses outils simple de veacuterification
Consulter les cartes interactives des stations de bus sur tout Paris ainsi leurs
coordonneacutees
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
31
Twilio
LAPI Twilio [5] est une API RESTful qui offre des fonctionnaliteacutes vocaux et drsquoSMS aux
applications Crsquoest une plateforme en tant que service PaaS Twilio permet aux deacuteveloppeurs la
programmation de la reacuteception et lrsquoenvoi des appels teacuteleacutephonique ou SMS preacuteprogrammeacutes
utilisant des services web agrave partir de sa bibliothegraveque Les services de Twilio sont accessibles
agrave travers des requecirctes HTTP et factureacutes par utilisation
Figure 20 logo de Twilio
Lrsquoapi nous a permis
Lrsquoenvoi drsquoSMS personnaliseacutes et cibleacutes pour les abonneacutees drsquoune station choisie
Lrsquoenvoi drsquoSMS drsquourgence cibleacutes pour les utilisateurs
Lrsquoenvoi drsquoSMS de notification agrave lrsquoutilisateur de lrsquoapproche de son bus et estimation
du temps de son arriveacute afin qursquoil se preacutepare agrave lrsquoattraper
2 Choix Architectural
21 Architectures Multi-tiers
JEE propose diffeacuterentes structures afin de deacutevelopper une application web sur des bases
saines Typiquement les architectures JEE speacutecifient plusieurs couches compleacutementaires qui
comportent diffeacuterents eacuteleacutements ou composants de lrsquoapplication JEE deacuteployeacutee
Ces architectures se deacutecoupent selon diffeacuterents sceacutenarios
ndash Une architecture agrave deux niveaux comportant un serveur web JEE et un serveur de base de
de donneacutees Ce modegravele est de type modegravele client-serveur
ndash Une architecture agrave trois niveaux plus preacuteciseacutement de trois couches
La couche preacutesentation associeacutee au client qui de fait est dit laquo leacuteger raquo dans la mesure ougrave il
nrsquoassume aucune fonction de traitement
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
32
La couche meacutetier lieacutee au serveur qui dans de nombreux cas est un serveur drsquoapplication
JEE qui va exeacutecuter tous les calculs ou faire des requecirctes vers drsquoautres serveurs additionnels
(exemple vers des SGBD)
La couche de donneacutees lieacutee au serveur de base de donneacutees (SGBD)
ndash Une architecture n-tiers comportant souvent la partie cliente sur laquelle srsquoexeacutecute des
applications clientes un serveur web JEE un serveur meacutetier JEE et un serveur de base de
donneacutees
22 Architecture adopteacutee
Lrsquoarchitecture adopteacute dans notre deacuteveloppement sera agrave trois niveaux afin drsquoavoir un deacutecoupage
entre les diffeacuterentes parties de lrsquoapplication agrave savoir la preacutesentation le meacutetier et les donneacutees On
a choisi Wildfly [7] comme serveur drsquoapplication pour notre couche meacutetier
Cette seacuteparation respectant tout agrave fait le paradigme MVC une eacutevolution des niveaux
indeacutependamment les uns des autres sera possible agrave lrsquoavenir et permettra donc une meilleure
eacutevolutiviteacute de la solution
De plus ce type drsquoarchitecture est relativement extensible en vue par exemple de
lrsquoinsertion de nouveaux tiers La figure ci-dessous provenant du site internet de Sun
Microsystems illustre lrsquoarchitecture adopteacutee par la plupart des applications web J2EE
Figure 21 Scheacutema de larchitecture 3-tierces adopteacutee [6]
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
33
Conclusion
Dans ce chapitre les besoins ont eacuteteacute preacutesenteacutes agrave travers les diagrammes des cas drsquoutilisations
et eacuteclairci avec des descriptions textuelles Ensuite on a exposeacute les grands choix technologiques
et architecturaux Ce chapitre donne alors le feu vert pour lrsquoamorccedilage de lrsquoeacutetude conceptuelle
qui sera deacutecrite dans le chapitre suivant
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
34
Chapitre 3 Etude conceptuelle
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
35
Introduction
La phase de conception se voit parmi les phases les plus importantes dans un cycle de vie
logiciel Par souci de clarteacute nous deacutebuterons la conception preacuteliminaire de lapplication
Ensuite une preacutesentation de la modeacutelisation de la conception deacutetailleacutee sera faite Ces
fonctionnaliteacutes seront donc notre but majeur de ce chapitre
I Conception preacuteliminaire
Cette eacutetape est la plus importante du processus 2TUP vu qursquoelle en repreacutesente le cœur En effet
dans cette eacutetape nous allons abandonner nos deux branches gauche et droite afin de faire la
fusion entre les deux eacutetudes technique et fonctionnelle Cependant nous allons deacutevelopper les
cateacutegories drsquoanalyse en couches logicielles conformeacutement au modegravele retenu de la solution
technique tout en restant le plus indeacutependant possible des outils de deacuteveloppement
1 Diagramme de deacuteploiement
Le diagramme de deacuteploiement est une vue statique qui sert agrave repreacutesenter lutilisation de
linfrastructure physique par le systegraveme et la maniegravere dont les composants du systegraveme sont
reacutepartis ainsi que la relation entre eux Les eacuteleacutements utiliseacutes par un diagramme de deacuteploiement
sont principalement les nœuds les composants les associations Les caracteacuteristiques des
ressources mateacuterielles physiques et des supports de communication peuvent ecirctre preacuteciseacutees par
steacutereacuteotype
Figure 22 Diagramme de deacuteploiement
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
36
2 Diagramme de classe drsquoanalyse
Le diagramme de classe est le point central dans un deacuteveloppement orienteacute objet En analyse
il a pour objectif de deacutecrire la structure des entiteacutes manipuleacutees par les utilisateurs Il deacutecrit la
structure de systegraveme agrave travers les classes les attributs et les relations qui les associent
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
37
Figure 23 Diagramme de classe
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
38
II Conception deacutetailleacute
1 Les patrons de conception
Un patron de conception est un concept qui vise agrave reacutesoudre plusieurs problegravemes selon lrsquoapproche
orienteacute objet son but principale est de minimiser le temps de deacuteveloppement drsquoun logiciel tout en
augmentant la qualiteacute de reacutesultat en appliquant des meilleurs pratiques qui sont deacutejagrave existantes agrave des
problegravemes courants de conception
11 Service Locator
On a utiliseacute ce design pattern afin de localiser et centralise lrsquoaccegraves aux objets dans lrsquoarbre JNDI et pour
que le systegraveme devienne plus flexible en nous facilitant ses reacutecupeacuteration En effet au lieu drsquoajouter le
code technique agrave chaque classe de notre couche meacutetier on le place dans une seule classe On a optimiseacute
aussi son fonctionnement en utilisant un cache
12 Business Delegate
On a utiliseacute le design pattern Business Delegate apregraves lrsquoisolement de notre code JNDI dans un
Service Locator pour deacuteleacuteguer son appel Lrsquoideacutee de ce pattern est de regrouper agrave un seul endroit tous
les appels distants de nos meacutethodes de la couche meacutetier et drsquoavoir une classe Business Delegate par
service qui redeacutefinit chaque meacutethode distante
13 MVC (Model-View-Controller)
Le patron darchitecture modegravele-vue-controcircleur (en abreacutegeacute MVC en anglais model-view-controller) est
tregraves recommandeacute dans lunivers JEE Crsquoest un modegravele destineacute agrave reacutepondre aux besoins des applications
interactives en seacuteparant les probleacutematiques lieacutees aux diffeacuterents composants au sein de
leur architecture respective
La vue cette partie repreacutesente linterface utilisateur avec lequel lutilisateur reacuteagit Elle nexeacutecute aucun
traitement se contente simplement dafficher les reacutesultats provenant des objets model
Le modegravele les modegravele repreacutesente les donneacutees de lapplication et deacutefinit la logique avec laquelle les
donneacutees seront manipuleacutes tout en offrant les meacutethodes pour la reacutecupeacuteration et la mise agrave jour de ces
donneacutees
Le controcircleur le controcircleur est responsable sur la gestion de linteraction avec lutilisateur En effet
il constitue lrsquointermeacutediaire entre les objets vue et les objets modegravele et cest dans cette partie lrsquointeraction
entre ces deux objets se fait Cela dit les objets controcircleurs reccediloivent les requecirctes utilisateurs puis
deacuteterminent quelles parties des objets vues et modegraveles sont requises
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
39
Figure 24 Modegravele MVC 2
2 Diagramme de seacutequence objet
Nous preacutesentons ici quelques diagrammes de seacutequence objet
21 Diagramme de seacutequence objet laquo Authentification raquo
Le diagramme exposeacute ci-dessous explique le sceacutenario drsquoauthentification le client remplit le
formulaire de saisie de donneacutees et confirme lrsquoauthentification Le controcircleur veacuterifie si les
donneacutees sont valideacutees puis redirige lrsquoutilisateur vers la page drsquoaccueil Dans le cas contraire le
formulaire affiche des messages drsquoerreur eacuteventuels
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
40
Figure 24 Diagramme seacutequence objet Authentification
22 Diagramme de seacutequence objet laquo Afficher lrsquoensemble de notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de consulter lrsquoensemble des
notifications (urgences actualiteacutes informations trafic) Lrsquoutilisateur accegravede tout drsquoabord agrave
lrsquoaccueil de lrsquoapplication cela dit son espace personnel et puis il accegravede agrave la section dashboard
Le controcircleur veacuterifie lrsquoid de lrsquoutilisateur connecteacute et exeacutecute lrsquoaction qui permet drsquoafficher
lrsquoensemble de notifications cela dit le controcircleur communique avec les entiteacutes neacutecessaires pour
reacutecupeacuterer les notifications geacuteneacuterales ainsi que les notifications propres agrave lrsquoutilisateur connecteacute
et le trafic
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
41
Figure 25Diagramme seacutequence objet laquo afficher ensemble de notification raquo
23 Diagramme de seacutequence objet laquo geacuterer notification raquo
Le diagramme preacutesenteacute ci-dessous explique le sceacutenario de la gestion des notifications de
lrsquoadministrateur apregraves son authentification il accegravede agrave sa section de gestion nommeacutee dashboard
Lrsquoadministrateur saisit le contenue de lrsquoactualiteacute agrave deacuteposer pour tous les utilisateurs puis appuis
sur la confirmation drsquoenvoi il peut aussi les supprimer Deux autres critegraveres de notifications
sont mis agrave sa disposition laquo notification personnaliseacutee raquo par station en mode (PUSH ou SMS)
Le controcircleur veacuterifie le type de notification et exeacutecute lrsquoaction qui permet de les persister dans
la base de donneacutees ou drsquoinitier la fonctionnaliteacute SMS et consommer ses services
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
42
Figure 26 Diagramme seacutequence objet laquo geacuterer les notifications raquo
Conclusion
Lrsquoeacutetape de la conception est la phase la plus importante dans la reacutesolution drsquoun problegraveme donneacute
La reacutealisation de cette phase nous a permis de deacutecortiquer avec preacutecision lrsquoarchitecture de
lrsquoapplication ainsi que la reacutealisation de sa conception deacutetailleacutee cela nous a permis drsquoentamer
la phase drsquoimpleacutementation sur la base drsquoune architecture stable et delagrave passer agrave la phase de
construction
Durant le chapitre qui va suivre nous allant essayer drsquoaccomplir lrsquoimpleacutementation de notre
application et nous allons deacutecrire lrsquoenvironnement du travail mateacuteriel et logiciel
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
43
Chapitre 4 Codage et tests
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
44
Introduction
Au cours de cette derniegravere partie nous exposons le travail accompli Nous commenccedilons par la
preacutesentation de lrsquoenvironnement de travail logiciel et mateacuteriel ainsi que les diffeacuterents choix
techniques utiliseacutes pendant cette phase Puis nous deacutecrivons le proceacutedeacute suivi pour la reacutealisation
en preacutesentant les diffeacuterents problegravemes rencontreacutes au cours de la reacutealisation que pendant la
validation
I Environnement de travail
1 Environnement mateacuteriel
Pour lrsquoimpleacutementation de notre projet on a choisi
Entiteacute Description
Pc Portable Modegravele Lenovo 8070
Processeur Intel CORE i7-4510U (260 GHZ)
Ram 12 Go
Disque dur 1 Teacutera
Tableau 4 Environnement de travail mateacuteriel
2 Environnement logiciel
Pour la reacutealisation de notre projet on a opteacute agrave utiliser lrsquoenvironnement logiciel deacutecrit dans le
tableau ci-dessous
Langage de deacuteveloppement Java
Framework deacuteveloppement Web JEE
Conception et Conception Visual Paradigm
Outil de deacuteveloppement Eclipse Luna
SGBD Mysql
Serveur drsquoapplication Wildfly 810
Editeur Microsoft office Word 2013
Tableau 5 Environnement de travail logiciel
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
45
I Choix techniques
XHTML
XHTML est un langage de balisage ses racines puisent dans HTML qui sert agrave eacutecrire des pages
web mais avec une reformulation en XML strict Ceci signifie qursquoun document XHTML est
un document XML qui respecte un scheacutema strict
Javascript
Javascript est un langage dynamique orienteacute objet de programmation de script employeacute dans
les pages web interactives et aussi dans les serveurs Sa syntaxe sinspire des langages Java et
C Dans cette application on lrsquoa utiliseacute largement pour coder plusieurs fonctions javascript(le
mouvement des bus pour lrsquoaffichage des stations pour la consommation des API de direction
et pour lrsquoalgorithme du plus court chemin)
Templating laquo Facelets raquo
Facelets est une technologie de preacutesentation pour le deacuteveloppement dapplications web en Java
En plus de son introduction de nouvelles fonctionnaliteacutes au-delagrave de celles preacutesenteacutes par JSF elle
offre la possibiliteacute de creacuteer des composants personnaliseacutes sans taper aucune ligne de code
JAVA et un systegraveme de templating
Le templating offre plusieurs avantages
Uniformiser la structure des pages
Simplifier la mise agrave jour une modification dans le template se propage automatiquement
dans toutes les pages qui lutilisent
Gain en productiviteacute moins de code agrave eacutecrire une page ne contient que ce qui lui est
propre
Un template est une page xhtml ordinaire puisqursquoil est baseacute sur xml qui deacutefinit la structure du
document avec des emplacements speacutecifiques ougrave les pages qui utilisent ces templates (pages
clientes) insegravereront leur contenu On utilise un ensemble de tag pour la deacutefinition de tels
emplacements
GTFS ( General Transit Feed Specification)
GTFS [8] preacutesente une speacutecification geacuteneacuterale drsquoun format libre conccedilu par Google afin drsquointeacutegrer
et optimiser les donneacutees du transport commun cela dit les horaires de voyage ainsi que les
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
46
informations geacuteographique associeacutees comme les traceacutes des lignes de transport les itineacuteraires
des arrecircts de bus ainsi que drsquoautre informations utiles codeacutees sous forme de plusieurs fichiers
textes standards agrave lrsquoinstar de (agency routestripsshapesstoptimeshellip)
II Les nouvelles technologies utiliseacutees
Les nouvelles technologies que nous avons utiliseacute dans le deacuteveloppement sont
JQuery
JQuery est une bibliothegraveque JavaScript libre qui porte sur linteraction entre JavaScript
(comprenant AJAX) et HTML et a pour but de simplifier des commandes communes de
JavaScript
Primefaces
PrimeFaces est un framework open source qui peut ecirctre assimileacute agrave une suite de composants
dinterfaces riches pour JSF et apporte des eacuteleacutements tregraves basiques dUI PrimeFaces va plus loin
et propose plus de 100 composants plus de 35 thegravemes des composants mobiles et bien plus
encore Cest actuellement de loin la suite pour JSF la plus populaire ainsi quun outil graphique
tregraves populaire partout pour le deacuteveloppement de Java Web
III Chronogramme drsquoavancement du projet
La figure ci-dessous preacutesente le chronogramme drsquoavancement du projet ougrave chaque branche de
cette figure repreacutesente la dureacutee drsquoune tacircche
Figure 27 Chronogramme du projet
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
47
IV Preacutesentation des interfaces
1 Interface accueil utilisateur
Figure 28 Interface daccueil utilisateur
Description
- Crsquoest lrsquointerface drsquoaccueil de lrsquoutilisateur agrave gauche on trouve les diffeacuterent services proposeacutees
par lrsquoapplication elle preacutesente un tableau affichant les diffeacuterents messages drsquourgences et au-
dessous une carte regroupant le trafic routier ainsi que les diffeacuterentes perturbations routiegravere sur
tout Paris avec la date de deacutebut et de fin de chaque perturbation
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
48
2 Interface Consultation du reacuteseaux des stations sur Paris
Figure 29 Interface consultation du reacuteseau des stations sur Paris
Description
Cette interface permet agrave lrsquoutilisateur de visualiser le nombre et les itineacuteraires de tous les points
de station de bus sur la reacutegion de lrsquoicircle-de -France et ses deacutepartements
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
49
3 Interface traccedilage du plus court chemin
Figure 30 Interface traccedilage du plus court chemin
Description
Cette interface permet agrave lrsquoutilisateur le traccedilage automatique avec les directions agrave droite du plus
court chemin depuis sa position vers nrsquoimporte quel position en lrsquooccurrence les stations de bus
ici juste en glissant les deux marqueurs rouge et vert afin drsquoobtenir la dureacutee et la distance agrave
parcourir pour y arriver tout en avoir la possibiliteacute de choisir son mode de parcours entre
bicyclette voiture ou agrave pieds
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
50
4 Interface consultation de la position du bus et notifications
Figure 31 Interface consultation de la position du bus
Description
Cette interface permet agrave lrsquoutilisateur ou agrave lrsquoadministrateur de suivre la position en temps reacuteel du
bus sa position sur la carte ainsi que la station suivante du bus et la dureacutee en minutes pour y
arriver
En haut on a aussi une bulle contenant le nombre de notification concernant la station sur
laquelle il est abonneacute
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
51
5 Interface de gestions de notification
Figure 32 Interface gestion de notifications
Description
Cette interface preacutesente lrsquoaccueil de lrsquoadministrateur et lui permet de geacuterer le flux de
notification des utilisateurs entre autre supprimer ou envoyer diffeacuterent type de notifications aux
utilisateurs concernant les perturbations du reacuteseau de transport commun des tourneacutees de bus
des offres drsquoexcursionshellip
La notification est raffineacutee agrave 3 niveaux notification geacuteneacuterale (pour tous les utilisateurs)
notification par station (juste pour les abonneacutees de la station choisi) et notification par SMS
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
52
V Tests et validation
1 Test des API
Afin de tester nos reacutesultats des requecirctes http fournis par les web services deacuteveloppeacutes agrave lrsquoaide
de Google Maps nous avons utiliseacutes le client REST Postman et voici ci-dessous un reacutesultat de
test drsquoune requecircte http permettant lrsquoaffichage de la reacuteponse du serveur Google apregraves une requecircte
demandant la geacuteolocalisation de la direction entre un point de deacutepart et un autre drsquoarriveacute
Figure 33 Interface de test avec loutil Postman
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
53
2 Test de compatibiliteacute mobile
Le test drsquoadeacutequation agrave lrsquoutilisation sur appareil mobile de notre application sur 2 appareils
mobile un iphone 5 et une ipad afin de nous a donneacute des apercus lors de son usage agrave partir
drsquoune appareil mobile et comme resultats on peut dire que
Les fenecirctres sont correctement configureacutees
Le contenu de la page est adapteacute agrave la largeur de lrsquoappareil
Le texte sur la page est lisible
Les liens et les cibles sont suffisamment grands et conviviaux
Figure 34Interface de test de compatibiliteacute mobile sur un iphone 5
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
54
Figure 35Test de compatibiliteacute sur une ipad
Conclusion
Au bout de ce chapitre nous avons parcourus les diffeacuterents outils utiliseacutes afin drsquoassurer
lrsquoimpleacutementation de lrsquoapplication Nous avons deacutecrit aussi les diffeacuterentes interfaces de notre
projet Ainsi que les tests effectueacutes
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
55
CONCLUSION et PERSPECTIVES
Mon projet a consisteacute en la conception le deacuteveloppement et lrsquointeacutegration drsquoune application de
notification et drsquoalerte drsquoune tourneacutee de bus pour le compte drsquoune socieacuteteacute cliente en guise
drsquoapporter une valeur ajouteacutee et un meilleur service plus moderne agrave ses clients
Au cours de ce stage jrsquoavais eu lrsquooccasion de mieux comprendre la meacutethodologie de travail
ainsi que le processus de recherche
La mission la plus deacutelicate eacutetait de srsquointeacutegrer avec les meacutethodologies de recherche analyser les
significations et les buts du cahier de charge ainsi que les points pas encore
exploiteacutes ou deacutepasseacutes afin de les incorporer ou les ameacuteliorer Pour cela une grande partie de
mon travail a consisteacute agrave analyser les modegraveles ensuite agrave proposer un nouveau plus geacuteneacuteral
Le processus du deacuteveloppement srsquoest baseacute essentiellement sur les directives de mon encadrant
sa perseacuteveacuterance ainsi que sa patiente afin de me montrer les bonnes pratiques de se lancer
dans des grands projets et drsquoextraction des besoins Le fait de se baser sur des sceacutenarios reacuteels
de problegravemes rencontreacutes concernant le transport public et de les collecter depuis une gamme
large de personnes de diffeacuterents niveaux et des forums en ligne permet drsquoeacutelargir lrsquoespace des
connaissances et drsquoimagination pour lrsquoajout de nouveaux services innovants et creacuteatifs
Les apports du stage sont alors assez nombreux on eacutevoque donc la proposition drsquoun
nouveau modegravele complet et fonctionnel en permanence agrave toutes les circonstances (rupture de
connexion) et lrsquoimagination de nouveaux systegravemes plus moderne et sophistiqueacute qui
remplaceront ceux qui existent deacutejagrave Les apports personnels du stage concernant les
connaissances et les proceacutedures du deacuteveloppement sur la plateforme de Java sont abondants
puisque on srsquoest impliqueacute dans les basses couches du systegraveme
Certainement comme perspectives nous envisageons incorporer un module de GPS afin de
mieux suivre la position en temps reacuteel du bus ainsi raffiner lrsquoestimation de son arriveacutee et inteacutegrer
les files drsquoattentes RabbitMq pour geacuterer le flux croissant des requecirctes utilisateurs tout en gardant
les performances de nos serveurs
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
56
Webographie
[1]ldquoSTIldquo systegraveme de transport intelligentrdquo httpwwwtransport-intelligentnet derniegravere visite
15052016
[2] ldquoProcessus en Y ldquo httpjlafossedeveloppezcomMethodologie2TUPdiagrame
derniegravere visite 15012016
[2]ldquoJSFrdquo httpsdzonecomrefcardzjavaserver-faces-20 derniegravere visite 15052016
[3]ldquoGoogle Mapsrdquo httpsdevelopersgooglecommapsdocumentation derniegravere visite
15052016
[4]ldquo MapsHere ldquo ldquohttpsdeveloperherecomrest-apis derniegravere visite 15052016
[5]ldquo Twilio ldquo httpswwwtwiliocomdocslibraries derniegravere visite 01062016
[6]ldquoArchitecture 3 tiersldquo httpjlafossedeveloppezcomjavadeveloppement-n-tiersplate-
forme-java-EE derniegravere visite 18042016
[7]ldquoWildfly ldquo httpsdocsjbossorgauthordisplayWFLY8 derniegravere visite 15052016
[8]ldquoGTFSrdquo httpwwwnormes-donnees-tcorgcategorygtfs derniegravere visite 15052016
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
57
Glossaire
GTFS General Transit Feed Specification
RATP Reacutegie autonome des transports parisiens
RER Reacuteseau express reacutegional
JSF Java Server Faces
JPA Java Persistence Architecture
Xhtml eXtensible HyperText Markup Language
CSS Cascading Style Sheet
XML Extensible Markup Language JPQL Java Persistence
JEE Java Enterprise Edition
top related