66
Résumé Ce projet de fin d’étude présenté dans ce rapport est proposé dans le cadre de l'obtention du diplôme d'ingénieur en informatique à l'école supérieur privée d'ingénierie et de technologies Esprit et réalisé au sein de la societé Philae-IT.Ce projet consiste à la conception et le développement d'une application de notification et d’alerte intitulé« BusMapper » qui facilite la vie quotidienne du citoyen dans le domaine de transport en commun le cas du « bus » ici, tout en lui offrant plusieurs services de localisation et d’alerte sur la position du bus ou toute urgence concernant le traffic et les tournées de bus. Mots-clés:autobus,trafic,alerte,notification,SMS,JEE 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 « BusMapper » 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 … Keywords: autobus, traffic, alert, notification,SMS,2TUP, JEE..

Conception et développement d’un système d’alerte et notification d’une tournée de bus

Embed Size (px)

Citation preview

Page 1: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 2: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 3: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 4: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 5: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 6: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 7: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 8: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 9: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 10: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 11: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 12: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 13: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 14: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 15: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 16: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 17: Conception et développement  d’un système d’alerte et notification  d’une tournée 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

Page 18: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 19: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 20: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 21: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 22: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 23: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 24: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 25: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 26: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 27: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 28: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 29: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 30: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 31: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 32: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 33: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 34: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 35: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 36: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 37: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 38: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 39: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 40: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 41: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 42: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 43: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 44: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 45: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 46: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 47: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 48: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 49: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 50: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 51: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 52: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 53: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 54: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 55: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 56: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 57: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 58: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 59: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 60: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 61: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 62: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 63: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 64: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 65: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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

Page 66: Conception et développement  d’un système d’alerte et notification  d’une tournée de bus

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