Etude, conception etréalisation d’une application
web de gestion des processus métiers des
demandes au sein des organismes
ROYAUME DU MAROC
UNIVERSITE HASSAN I
FACULTE DES SCIENCES ET TECHNIQUES
Département Mathématiques et Informatique
STAGE DE FIN D’ÉTUDE
intitulé
AU: 2016-
• Membres de jury :
• Pr. NASREDDINE Bouchaib FSTS Président
• Pr. MARZOUK Abderrahim FSTS Encadrant
• Pr. Amine Benmakhlouf FSTS Examinateur
• Pr. Abdelkrim Haqiq FSTS Examinateur
• Mr. FARHI Khalid UPSYS Encadrant
Présenté par : MKHARBACH Ayoub
Soutenu le : 27/09/2017
MST-RSI-02/2017
Effectué à :
2.
Plan
Contexte général duprojet
Inception
Analyse et conception
Implémentation
Demonstration
Conclusion et perspectives
Contexte général
Présentation desociété
• SARL,
• Crée en 2015,
• Société de services et d’intégration, spécialisée dans les
technologies de l’information ,
• Stockage, Sauvegarde, L’archivage, Cloud, GED ainsi que le
travail collaboratif en mode SaaS.
4/32
5.
Contexte général
Organigramme d’UPSYS
5/32
Directiongénérale
Direction de service
Service avant-vente
Service integration et
infrastructure
Service intégration
logicielle &
développement
Direction commercial Secrétariat
Direction administrative
et financtière
Service administratif
Service comptabilité
Service des ressources
humaines
6.
Contexte général
C’est quoiun processus ?
6/32
Un processus est un ensemble d’activités liées qui transforme des
éléments d’entrée en éléments de sortie.
Ainsi quasiment toute action, projet, programme… peut être vu
comme un processus.
Exemple : Concours du master RSI.
Encore des places
Contexte général
Objectif
Réalisation d’uneapplication qui permet de :
• Dématérialiser les processus de validation des demandes,
• Faciliter le dépôt de la demande,
• Faciliter le suivi de sa requête,
• Assurer la traçabilité des tâches effectuées durant le processus,
• Trouver facilement l’information immédiatement où qu’elle soit,
8/32
9.
Contexte général
Méthodologie detravail adoptée
Phase
d’inceptio
n
Phase
d’analyse
Phase de
conception
Phase de
Réalisation
UP-XP
Unified Process - eXtreme Programming
9/32
10.
Contexte général
Planning duprojet
Phase Date de début Date de fin Durée
estimée
(jours)
Elaboration du cahier des charges 20/02/2017 11/03/2017 20
Phase d’inception 12/03/2017 26/03/2017 15
Phase d’analyse 27/03/2017 09/04/2017 14
Phase de conception 10/04/2017 01/05/2017 22
Phase de réalisation 02/05/2017 30/06/2017 60
10/32
Gérer les processus
Gérerles demandes
Gérer les utilisateurs
Gérer les comptes
Gérer les entités
Gérer les personnels
Gérer les commissions
Planifier les reunions
Gérer les référentiels des addresses
Effectuer ses tâches
Consulter l’état d’advancement des demandes
Inscrire/ Consulter le guide
Phase d’inception
Bes
oins
Fon
ctio
nnel
s
13/32
Nom de cas
d’utilisation:
Ajouter.
Objectif : Effectuer une gestion des services / personnels / dossiers.
Acteurs
principaux :
Gestionnaire fonctionnel.
Rôle de cas
d’utilisation
Ce scénario permet au gestionnaire d’ajouter ressource.
Pré-condition : Authentification préalable.
Post-condition : Un nouveau ressource est bien ajouté.
Scénario
nominal :
Action des acteurs Action du système
1 - Authentification.
2 - Demander le
formulaire d’ajout.
3 - Afficher le formulaire.
4 - Remplir les champs. 5 - Vérifier les données
saisies.
6 - Enregistrer dans la
base de données.
7 - Afficher un message
de succès.
Phase d’analyse et de conception
Des
cript
ion
text
uell
e
17/32
• Les enchainements alternatifs :
A1 : Données manquants
L’enchainement A1 démarre au point 5 du scénario nominal.
6- le système affiche un message d’erreur.
Le scénario nominal reprend au point 4.
• Les enchainements d’exception :
E1 : Le système ne répond pas
L’enchainement E1 démarre au point 1 du scénario nominal.
2- le système ne répond pas.
Le cas d’utilisation se termine en échec.
Scénario
nominal :
Action des acteurs Action du système
1 -Authentification.
2 - Demander le
formulaire d’ajout.
3 - Afficher le
formulaire.
4 - Remplir les champs. 5 - Vérifier les données
saisies.
6 - Enregistrer dans la
base de données.
7 - Afficher un message
de succès.
Diagramme de classe
Phased’analyse et de conception
• Le plus important de la modélisation orientée objet,
• Permet de fournir une représentation abstraite des objets du
système qui vont interagir ensemble pour réaliser les cas
d’utilisation,
• A partir de lui on crée la base de données,
19/32
20.
Diagramme de classe
Phased’analyse et de conception
• Gestion des processus,
• Gestion des demandes,
• Gestion des dossiers,
20/32
• Gestion des utilisateurs,
• Gestion des intervenants,
• Gestion des référentiels
d’adresses,
• Gestion des commissions,
• Gestion des emails,
• Gestion des traçabilités
21.
Phase d’analyse etde conception
Gest
ion
des
proc
essu
s
Diagramme de classe
21/32
22.
Phase d’analyse etde conception
Gest
ion
des
dem
and
es
Diagramme de classe
22/32
23.
Phase d’analyse etde conception
Gest
ion
des
doss
iers
Diagramme de classe
23/32
PostgreSQL
Base de données
HTML5
CSS3
JavaScript
Frontend
JavaPlatform
Entreprise Edition
Backend
Architecture
Bootstrap
AnugularJS
Spring
boot
JUnit
iText
Java EE : très vaste, il propose de très nombreux outils qui
adressent toutes les problématiques de l'informatique
d'entreprise.
PostgreSQL: très simple à mettre en œuvre et aussi à utilisé,
Il gère les bases de données relationnels et aussi objets, le plus
important que il est plus simple de migrer de version vers une
autre dans postgresSQL.
Framework : Nous permet de gagner du temps et de
développer une application de qualité.
Implémentation du projet
HTTP
RESTFULL JDBC
Hibernate
Spring
Security
25/32
Conclusion et perspectives
Apportpersonnel
• Travail sur un projet client de grand calibre destiné à être
utilisé à l’échelle nationale.
• Assimilation de notions complexes relatives au
développement web.
• Utilisation d’outils mathématiques dans des algorithmes
informatiques.
• Acquisition de notions d’architecture logicielle.
• Contact direct et réunions régulières avec le client.
• Adoption d’une méthode de gestion de projet : UP-XP
30/
32
#1 Bonjour mesdames & messieurs, les membres de jury et toutes les personnes présentes ici
Je m’appelle Ayoub MKHARBACH, étudiant en 2éme année master RSI à la faculté des sciences et techniques de settat
Avant d’entamer ma présentation, permettez moi d’abord d’adresser mes profonds remerciements aux membres de jury d’avoir accepter d’évaluer mon travail, à notre chef de filière Mr. Nasserddine Bouchaib pour sa veille sur le bon déroulement de notre formation, à mon encadrant interne Mr. Marzouk Abderrahim pour leur disponibilité tout au curant de mon stage, à mon parrain de stage Mr. Farhi khalid pour leur conseils précieux et aussi à tous les employées de la société UPSYS
J’ai l’immense plaisir & l’honneur de vous présenter aujourd’hui mon projet de fin d’études effectué au sein de la société UPSYS, ce projet a pour objectif « Etude, Conception et réalisation d’une application web de gestion des processus métiers des demandes au sein des organismes »
#2 Tout au long de cette présentation, nous allons suivre le plan suivant qui se décompose en 6 parties
Nous métrons le sujet dans sont contexte général. Après nous présenterons les besoins du projet dans la phase d’inception, par la suite, nous aborderons la phase d’analyse et de conception. Nous résumerons ensuite les technologies et les outils utilisée dans la phase d’implémentation, et on donnerons une démonstration de l’application.
Nous terminerons la présentation par une brève conclusion tout en évoquant les perspectives possibles à court et à long terme.
#3 Débutant par le context general qui a pour objectif de presenter l’organisme d’accueil et le cahier des charges
#4 UPSYS est une SARL crée en 2015 par des experts ingenieurs dans le domaine informatique,
Est une société de services et d’integration, spécialis”e dans les technologies de l’information
Afin de répondre aux besoins de ses clients, UPSYS propose une palette de services comme du stockage 4, de la sauvegarde 5, de l’archivage 6, de solution CLOUD 7 sur MESURE, de le GED 8, ainsi que la solution de travail collaboratif en mode SaaS 9.
#5 L’organigramme d’UPSYS est compsé d’une direction Générale, et 4 sous direction qui sont la direction de service, direction commercial, secretariat et la Direction administrative et financtière
Ma période de stage était déroulé dans le « Service Intégration Logiciel & Développement »
#6 Avant d’entrer dans le vif du sujet, définissant tout d’abord un processus,
Publication du concours
Inscription dans le concours
Préselection des étudiants
Passage du concous
Affichage de la liste des admis
Inscription dans le master pour les 30 premiers étudiants
S’il y a encore d’autres places les étudiants de la liste d’attente pouvent s’inscrire selon l’ordre de mérité
Finish
#7 Pour bien comprendre la problématique, mettez vous dans la situation suivante :
Vous voulez effectuez une demande d’autorisation par exemple, cette demande elle-même suit un processus métier, ça vous mettre dans une multitude d’intervenants administratifs,
ce qui demande un déplacement régulière pour savoir l’état d’avancement de la demande, mais comme vous le savez le citoyen est trop occupé par son quotidien de ce fait il ne dispose pas de suffisamment de temps pour assurer ça.
D’une autre part et au sein des administrations il n’existe aucune traçabilité pour savoir qui a fait quoi, et en cas de perte de l’un des documents nous sommes amené d’arrêter le processus et de refaire la demande, finalement après la fin de chaque tâche de notre processus un autre intervenant est nécessaire pour déplacer les Documents entre les collaborateurs.
#8 Afin de répondre à cette problématique et rendre facile le suivi de la demande, il m’a été demandé d’analyser, de concevoir et de réaliser une application destinée à :
Dématérialiser les processus de validation des demandes
Faciliter le dépôt de la demande,
Faciliter le suivi de sa requête,
Assurer la traçabilité des demandes,
Trouver facilement l’information où qu’il soit en utilisant le système de guichet unique conformément à l’article 10 du Décret n° 2-13-424 du 13 Rejeb 1434
#9 Pour bien conduire notre projet nous avons opté la démarche UP-XP comme une méthodologie de travail.
Elle permet d’analyser est concevoir un logiciel orienté objet évolutif
C’est une démarche qui se décompose en deux méthodes :
UP : qui est un processus de développement itératif et incrémental, il découpe le projet en quatres phases qui sont …
XP : C’est un processus agile, il permet d’attaquer directement la partie développement toute en decoupant le projet en des cycles de vie rapides de 2 semaines appelées itérations toute en plaçant le client au cœur du processus de développement.
#10 De ce fait nous avons planifier notre projet comme ceci
La phase d’elaboration du cahier des charges avec une durée estimée de 20 jrs
La phase d’inception avec une durée estimée de 15 jrs
…
#11 Et voilà la representation graphique de notre planing
#12 Passant à la phase d’inception qui a pour objectif de décrire les fonctionnalités
#13 Nous commençons tout d’abord par présenter les besoins fonctionnels à assurer par notre application, qui sont :
#14 La sécurité : L’application devra être hautement sécurisée
L’extensibilité : l'application devra être extensible, c'est-à-dire qu'il pourra y avoir une possibilité d'ajouter ou de modifier de nouvelles fonctionnalités.
L’interface : Avoir une application qui respecte les principes des IHM
La performance : c'est-à-dire que le système doit réagir dans un délai précis, quel que soit l’action de l’utilisateur.
La convivialité : L’application doit être simple et facile à manipuler même par des non experts.
#15 Et voilà le diagramme de cas d’utilisation qui permet de répresenter la relation entre les acteurs et les besoins attendus ( autrement dit les cas d’utilisation )
Et la relation entre les cas d’utilisation avec elles meme
#16 Passant à la phase d’analyse et de conception qui vise à identifier et décrire la majorité des besoins utilisateurs et construire l’architecture de base du système
#17 Afin de rendre notre diagramme de cas d’utilisation plus lisible et afin de décrire le comportement du système
La première tâche effectuée dans cette phase c’est de décrire les cas d’utilisation sous forme des tableaux
ce qui nous interesse ici c’est le scenario nominal qui permet de décrire le comportement de la cas d’utilisation dans l’état nominal, ce comportement peut être changer suivant
Un enchainement alternatif ou bien d’exception
#18 Ces tableaux sont représenté graphiquement avec les diagrammes de séquence qui permetent de préciser les interactions entre l’acteur et le système avec des messages présentés dans un ordre chronologique.
#20 Pour faciliter la compréhension de notre diagramme, nous avons le découpé sous forme des modules commes ceci
Dans cette presentation nous alons s’interesser aux modules …
#21 Le premier module est le plus important c’est le module de gestion des processus
Il se decompose de 3 classes principals qui sont Processus, Niveau, Etat
La classe Processus represente les processus métiers de l’organisme
La classe Niveau represente les taches des processus
La classe Etat represente les operations possible
C’est 3 classes sont associées entre eux par une autre classe s’appellee déroulement du precessus
Chaque ligne de cette classe décrit le passage d’un niveau vers un autre au sein d’un processus suivant une etat
#22 Ce module permet de décrire les demandes traitées au sein d’une telle organisme
Prenant l’exemple de la FST, l’un des natures des demandes c’est la l’inscription
Une inscription peut être en 1ére année, peut être en licence ou bien en master etc,
Pour s’inscrire en master par exemple
vous aurez besoin de specifier le type de la licence et la note ( ici en parle des champs à remplir)
Vous aurez besoin des relevées de notes scanner etc (ici en parle des pieces)
Cette demande peut être rejeté car les notes citer dans les champs ne sont pas les mêmes des relevées (ici en parle des motifs de rejet)
Finalement Cette demande est effectué par un seul intervenant qui est l’étudiant
On peut dire que ce module permet le paramétrage des demandes
#23 Le 3éme module c’est le module de gestion des dossiers,
Il permet d’enregistrer les demandes effectuées par les utilisateurs
Dans ce module on trouve une classe qui s’appellee suivi dossier, plus de ce qu’elle est associée à la classe dossier , elle est associé aussi aux classes utilisateur et déroulement procesus, son objectif est d’assurer la traçabilité des taches
#24 Dans cette partie nous allons aborder l’environnement dans lequel nous avons implémenter notre solution.
#25 On peut divisé notre architecture en 3 partie
La partie frontend(Côté client) qui est la partie visible à l’utilisateur, elle est composés de HTML, CSS et de Javascript contrôlés par le navigateur web
La partie backend(Côté serveur) qui est la partie invisible, il existe plusieurs langages à savoir PHP, Java, Ruby, Python …
Nous avons choisie JavaEE car il est très vaste, et propose de très nombreux outils qui adressent toutes les problématiques de l'informatique d'entreprise
Finalement la partie base de données, Nous avons choisie postgresql car il est très simple à mettre en œuvre et aussi à utiliser
Il gére les BD relationnel et les BD objet et le plus important que il est plus simple de migrer dans postgresSQL.
#27 Dans cette partie nous allons montrer une vidéo du fonctionnement de l’application.
#28 Comme vous voyez, il existe 2 menus de navigation
Le menu gauche contient des liens vers les interfaces de gestion
Par contre le menu haute contient un lien pour la déconnexion et une liste déroulante pour accéder aux profile affectés à l’agent
- Débutant par la gestion des processus
Pour passer du niveau planification au niveau commission on doit choisir l’état planifié ..
Pour gestion des types
#30 Pour conclure, il se doit citer les différents points acquis de ce projet et le bénéfice personnel.
Travailler sur un projet client d’une telle importance, n’est pas une opportunité qui s’offre tous les jours en tant qu’étudiant. Et comme j’ai adopté la méthodologie UP-XP, j’avais des réunion régulières avec le client.
D’une autre part, vu la nature du projet, j’ai pu assimiler des notions plutôt complexes dans le développement web
#31 Comme vous pouvez remarquer ce projet ouvre la porte à plusieurs perspectives. Après la fin de mon stage plusieurs modifications ont été effectuées dans la conception pour mieux adopter le projet aux besoins du client et bien sur avoir une application qui est 100% dynamique et peut gérer n’importe quel processus de demande
#32 Mesdames et monsieurs, je vous remercie pour votre attention. Je suis à vous pour répondre à vos questions.