Vous êtes sur la page 1sur 85

Université Hassan 1er

Faculté des sciences et techniques de SETTAT


Département Mathématiques et Informatique

Mémoire de

Projet de fin d’études


Pour l’obtention du diplôme

Master réseaux et systèmes informatique


Titre

Conception et développement d'une plate-


forme de gestion des formations et de
certifications avec la technologie JEE

Présenté par :
EL HABTI Kaoutar

Encadré par :

Encadrant universitaire Encadrant professionnel


M. MARZOUK ABDERRAHIM M. BOULHOUDA Saad

Année universitaire : 2015/2016


Dédicace
AALLAH,
Le tout puissant, le miséricordieux
Qui a guidé mes pas, depuis l’aube de ma vie, loué soit ALLAH

Ames chers parents,


Pour tous vos sacrifices pour moi,
Nul mot ne sera exprimé mon amour envers vous. Que dieu vous Protège et vous accorde
une longue vie.

Ames frères et mes sœurs,


Je vous remercie pour votre amour inconditionnel,
Que dieu vous garde, je vous aime et je vous souhaite une vie pleine de succès et de réussite.

A tous mes amis


Pour vous encouragements et pour avoir été là pour moi chaque fois que j’en avais besoin

A tous ceux qui m’aiment, a tous ce que j’aime


Que cette modeste dédicace puisse vous témoigner ma profonde gratitude pour votre
Immense amour, votre confiance et vos paroles apaisant qui m’ont toujours gardé le sourire

A tous ce qui ont contribué du prêt ou loin pour la réussite de


projet
Veuillez trouver ici le respect et la reconnaissance que j’éprouve pour vous

2
Remerciement .

Mon premier remerciement à ALLAH le tout puissant.


C’est pour moi un plaisir autant qu’un devoir de remercier toutes les personnes qui ont pu
contribuer de prés et de loin à l’élaboration de ce projet, qui m’ont aidé, m’ont soutenu et ont
fait en sorte que ce travail ait lieu.
Mes sincères remerciements sont adressés à Monsieur BOULHOUDA Saad, Chef de projet
dans la société Skills Group, mon encadrant externe, pour l’intérêt et le professionnalisme
avec lesquels elle a suivi la progression de ce travail, et pour son aide et ses conseils.
Mon remerciement va également à Professeur MARZOUK Abderrahim, mon encadrant à
la FSTS, pour son excellent encadrement ainsi que ses conseils pertinents.
Je souhaite remercier Monsieur le Directeur de pole de formation de la société Skills group,
ainsi que personnel de la société pour leur aide et leur soutien.
Que monsieur les membres de jury trouvent ici l’expression de ma reconnaissance pour
avoir accepté de juger mon travail.
A l’issu de ces deux années agréables passées à la FSTS, j’adresse mes remerciements à
toute l’équipe enseignante de la faculté des sciences et techniques de Settat pour la qualité de
l’enseignement qui m’a été dispensée.

3
Résumé

Le présent document est le fruit de mon travail dans le cadre du projet de fin d’études au
sein de Skills group.
L’objectif de ce projet est la conception et le développement de back office et front office
pour le site web du Skills Campus -le pôle formation et certification du Skills group- pour
gérer dynamiquement les formations, les certifications, les formations e-learning et les
séminaires présentés par Skills Campus, ainsi que les actualités et les offres de recrutement les
plus courants et aussi de pouvoir générer le catalogue de formation d’une manière dynamique,
ce qui facilite la mise à jour du site.
Le projet a été élaboré en trois étapes. Au début, nous avons fait une étude complète sur
l’existant afin de mettre en évidence les principaux dysfonctionnements du système actuel,
autrement dit, de l’ancien site de Skills Campus, puis nous avons spécifié les besoins qui
consistent à la qualification des besoins fonctionnels et non fonctionnels attendus du système
afin de mieux comprendre le projet. Ensuite, nous avons entamé la phase de conception en se
basant sur le langage UML. Enfin, la dernière étape était la réalisation du projet qui a fait
appel à l’utilisation des nouvelles technologies.
En effet, nous avons eu recours à plusieurs Frameworks, traitant plusieurs aspects du
développement dans la plate-forme JEE et après nous avons effectué les tests unitaires et les
tests d’intégration afin de détecter et corriger les bugs.

4
Table des matières
Dédicaces ................................................................................................................................. 2
Remerciements ....................................................................................................................... 3
Résumé ..................................................................................................................................... 4
Table des matières ................................................................................................................. 5
Liste des abréviations ........................................................................................................... 8
Liste des tableaux .................................................................................................................. 9
Liste des figures .................................................................................................................. 10
Introduction générale .......................................................................................................... 12
Chapitre 1 : Contexte général du projet
I. Entreprise d'accueil ........................................................................................................ 14
I.1 Introduction : ................................................................................................................... 14
I .2 Skills audit et conseil : ................................................................................................... 15
I.2.1 Audit et accompagnement : ..................................................................................... 15
I.2.2 Conseil : ................................................................................................................... 17
I.2 Skillscampus : ................................................................................................................. 17
I.2.1. Management des SI ................................................................................................. 17
I.2.2. Gestion des projets MOA........................................................................................ 18
I.2.3. Développement logiciel .......................................................................................... 18
I.2.4. SGBD / aide à la décision ....................................................................................... 18
I.2.5. Internet XML-SOA/ Cloud computing ................................................................... 18
I.2.6. Réseaux et sécurité .................................................................................................. 18
I.2.7. Système d’exploitation............................................................................................ 18
I.2.8. Serveur et applications ............................................................................................ 18
I.3. Skills créatifs :................................................................................................................ 19
I.3.1. Application mobile.................................................................................................. 19
I.3.2. Site e-commerce ...................................................................................................... 19
I.3.3. Application Desktop ............................................................................................... 19
I.3.4. Graphique et design ................................................................................................ 19
I.3.5. Implémentation et intégration ERP ......................................................................... 19
I.4.Organigramme de l’entreprise : ...................................................................................... 20
II. Présentation du projet ................................................................................................... 20

5
II.1 Description de l'existant................................................................................................. 20
II.2 Critique de l'existant ..................................................................................................... 20
II.3. Spécification des besoins ............................................................................................ 21
II.4. Les contraintes ............................................................................................................ 23
II.5. Choix du cycle de développement ................................................................................ 23
II.6. Gestion des risques ....................................................................................................... 26
II.7 Planification du projet ................................................................................................... 27
Conclusion ............................................................................................................................... 28
Chapitre 2 : Conception du projet
I. Introduction .................................................................................................................... 30
II. Conception détaillée ....................................................................................................... 30
II.1 Diagramme de contexte statique.................................................................................... 30
II.1.1 Back office : ............................................................................................................ 30
II.1.2 Front office : ........................................................................................................... 31
II.2 Diagramme de cas d’utilisation général ....................................................................... 31
II.2.1 Back office : ............................................................................................................ 31
II.2.2 Front office : ........................................................................................................... 32
II.3 Fonctionnalités Back office ........................................................................................... 34
II.3.1 Gestion des utilisateurs : ......................................................................................... 34
II.3.2 Gestion des formations ........................................................................................... 37
II.3.3 Gestion des participants .......................................................................................... 42
II.4 Front office .................................................................................................................... 44
II.4.1 Postuler aux offres .................................................................................................. 44
II.4.2 Consulter le catalogue............................................................................................. 45
II.4.3 Préinscription .......................................................................................................... 46
II.5 Diagramme de classe ..................................................................................................... 47
II.6 Diagramme de déploiement ........................................................................................... 48
Conclusion ............................................................................................................................... 50
Chapitre 3 : Etude technique du projet
I. Capture des besoins techniques ......................................................................................... 52
I.1 Architecture physique ..................................................................................................... 52
I.2Architecture technique ..................................................................................................... 53
II. Identification des options .................................................................................................. 55
III.Technologies et Frameworks ........................................................................................... 57
VI. Autres langages utilisés ................................................................................................... 60

6
Chapitre 4 : Mise en œuvre
I. Introduction......................................................................................................................... 62
II. Présentation des exemples des interfaces ........................................................................ 62
II.1 Les interfaces du Back-office : ...................................................................................... 62
II.2 Les interfaces du Front-office : ..................................................................................... 68
II.2.1 Présentation des formations .................................................................................... 70
II .2.2 Génération du catalogue des formations ............................................................... 72
II.2.3 Module d'inscription ............................................................................................... 74
II.2.4 Consulter les sessions par ville ............................................................................... 77
II.2.5 Consulter les séminaires par ville et par thème : .................................................... 77
II.2.6 Recrutement : .......................................................................................................... 78
II.2.7 Page de contact : ..................................................................................................... 80
Conclusion ............................................................................................................................... 80
Conclusion et perspectives .................................................................................. 81
Bibliographie ....................................................................................................... 82
Annexes ............................................................................................................... 83
Annexe I : Structure du projet .............................................................................................. 83
Annexe II : Fichiers de configuration................................................................................... 84

7
Liste des abréviations

- JEE - Java Enterprise Edition


- PHP - HypertextPreprocessor
- ASP - Active Server Page
- IIS - Internet Information Server
- JSP - Java Server Pages
- MVC - Modèle Vue Contrôleur
- 2TUP - 2 tracksunifiedprocess
- SGBD - système de gestion de base de données
- IOC - Inversion of Control
- POM - Project Object Model
- API - Applications Programming Interface
- XML - Extensible MarkupLanguage
- CSS - Cascading Style Sheet
- JSON - JavaScript Object
- DOM - Document Object Model
- IBM - International Business Machines
- SWT - Standard Widget Toolkit
- HTTP - Hypertext Transfer Protocol
- AJAX - acronyme d'AsynchronousJAvascript
and Xml
- DOM - Document Object Model
- DAO - Data Access Object

8
Liste des tableaux

Tableau 1. : Tableau comparatif ............................................................................................... 24


Tableau 2: Tableau de gestion des risques ............................................................................... 27
Tableau 3: Description textuelle haut niveau-Authentification ............................................... 34
Tableau 4: Description textuelle haut niveau-Gestion des utilisateurs .................................... 35
Tableau 5: Description textuelle de haut niveau-Gestion des formations ................................ 38
Tableau 6: scénario nominal-Gestion des formations .............................................................. 39
Tableau 7: description textuelles haut niveau - Gestion participants ....................................... 42
Tableau 8: scénario nominal- Gestion participants .................................................................. 43
Tableau 9: scénario nominal - générer catalogue formation .................................................... 45
Tableau 10: scénario nominal - préinscription ......................................................................... 46
Tableau 11. : Les avantages et les inconvénients de l'ASP ...................................................... 56
Tableau 12.: Les avantages et les inconvénients de JEE.......................................................... 56
Tableau 13. : Les avantages et les inconvénients de PHP ........................................................ 57

9
Liste des figures
Figure 1. : Pole Skills Group .................................................................................................... 14
Figure 2. : Fiche signalétique de Skills Group ......................................................................... 15
Figure 3. : Organigramme de Skills Group .............................................................................. 20
Figure 4: Processus de Développement Y. ............................................................................... 26
Figure 5: Diagramme de gantt .................................................................................................. 27
Figure 6: Diagramme de contexte statique du back office ....................................................... 30
Figure 7: Diagramme de contexte statique du front office ....................................................... 31
Figure 8: Diagramme de cas d’utilisation général (back office) .............................................. 32
Figure 9:Diagramme de cas d’utilisation général (front office) ............................................... 33
Figure 10: Diagramme de cas d’utilisation – Gestion des utilisateurs ..................................... 34
Figure 11: Diagramme de séquence – Gestion des utilisateurs ................................................ 36
Figure 12: diagramme d'activité _ gestion utilisateur .............................................................. 37
Figure 13: Diagramme de cas d’utilisation – Gestion des formations ..................................... 37
Figure 14: Diagramme de séquence – Gestion des formations ................................................ 39
Figure 15: Diagramme d’activité – Gestion des formations .................................................... 40
Figure 16: Diagramme de séquence boite blanche – Gestion des formations ......................... 41
Figure 17: Diagramme de cas d’utilisation – Gestion des participants .................................... 42
Figure 18: Diagramme de séquence – Gestion des participants ............................................... 43
Figure 19: Gestion participants - Diagramme d’activité .......................................................... 44
Figure 20: scénario nominal - Postuler aux offres ................................................................... 44
Figure 21: Diagramme de séquence – Postuler aux offres ....................................................... 45
Figure 22 : Diagramme de séquence – Consulter le catalogue ................................................ 46
Figure 23: Diagramme de séquence – Préinscription............................................................... 47
Figure 24: Diagramme de classe .............................................................................................. 48
Figure 25: Diagramme de déploiement .................................................................................... 49
Figure 26: Architecture physique ............................................................................................. 53
Figure 27: Architecture technique ............................................................................................ 54
Figure 28: Interface d'authentification ..................................................................................... 62
Figure 29: Interface page d'accueil........................................................................................... 63
Figure 30: Interface de gestion des formations ........................................................................ 63
Figure 31: Interface de gestion des sessions ............................................................................ 64
Figure 32: Interface d'ajout d'une session ................................................................................ 64
Figure 33: Interface de gestion du contenu d'une formation .................................................... 65
Figure 34: Interface de gestion des participants des formations .............................................. 65
Figure 35: Interface de gestion des intervenants ...................................................................... 66
Figure 36: Interface de gestion des droits d'utilisateurs ........................................................... 66
Figure 37: Interface gestion des offres ..................................................................................... 67
Figure 38: Interface gestion des candidats ............................................................................... 67
Figure 39: Page d’accueil du site ............................................................................................. 69
Figure 40: L'interface menu des formations ............................................................................. 70
Figure 41: l'interface des formations inclus dans le sous domaine « Gouvernance de la DSI »
.................................................................................................................................................. 71
Figure 42: L'interface de contenu de formation ....................................................................... 72

10
Figure 43: Page de protection du catalogue ............................................................................. 72
Figure 44: Catalogue de formation généré en format PDF ...................................................... 73
Figure 45: L'interface des solutions des formations ................................................................. 74
Figure 46: L'interface du mode d'inscription ........................................................................... 74
Figure 47: L'interface du formulaire d'inscription individuelle ............................................... 75
Figure 48: Interface inscription réussite ................................................................................... 75
Figure 49: Email généré ........................................................................................................... 76
Figure 50: l'interface du formulaire d'inscription entreprise .................................................... 76
Figure 51: L'interface des sessions formations organisées par ville ........................................ 77
Figure 52: L'interface des séminaires organisés par ville ........................................................ 77
Figure 53: L'interface des séminaires organisés par thème ...................................................... 78
Figure 54: Page de recrutement ................................................................................................ 79
Figure 55: Postuler aux offres .................................................................................................. 79
Figure 56: Page de contact ....................................................................................................... 80

11
Introduction générale
Depuis quelques années, les innovations dans le domaine de développement web se
multiplient et évoluent sans cesse c'est pour cette raison que les entreprises ont été amené à
avoir un site web qui les présente et de suivre le changement des dernières technologies pour
en profiter.
Il existe plusieurs types de site (site statique, site dynamique, site animé…), le choix de type
de site se fait par l’entreprise en adoptant la solution la plus adaptée à son besoin et son
budget. L’entreprise optera pour un site web statique si ce dernier ne nécessite que peu de
mises à jour et contenant peu de pages et utilisera un site web dynamique s’elle souhaite créer
une interaction forte avec ses visiteurs, quand il y a des besoins de mise à jour autonome et/ou
récurrents, quand il implique la mise en place d'un très grand nombre de pages. Toutefois,
l'évolution des technologies actuelles nous amène à mettre en place de plus en plus
généralement des sites web dynamiques.
Dans cette optique, la société Skills group m’a confié la mission de la conception et la
réalisation d’une plateforme web pour la gestion des formations et des certifications de son
pôle de formation « Skills campus ». Cette plateforme est composée d’un back office, Il
s'agira d'une plate-forme en ligne sécurisée par un accès réservé via un identifiant et un mot
de passe et qui permet de gérer le contenu du site qui sera visible aux internautes par son front
office.
Ce projet est particulièrement orienté développement avec l'environnement JEE. Plusieurs
outils ont été utilisés pour permettre le développement des différents modules réalisé au cours
de notre stage.
Le résultat du projet est une plateforme web de gestion des formations et certifications
voulant répondre à la gestion quotidienne de la société d'accueil. Il dispose de plusieurs
modules répandant chacun à des besoins particuliers.
Ce rapport est constitué de quatre parties :

Contexte générale du stage : comprenant la présentation de l'entreprise, la description


du sujet et sa problématique.
Analyse et conception du projet: décrivant la collecte d'information, dédié à la
conception des modules constituant le système à réaliser.
Etude technique du projet : présentant l’environnement logiciel utilisé et les
différentes techniques de réalisation.
Mise en œuvre de projet : illustre la réalisation des différents modules.

12
Chapitre 1 : Contexte générale du projet

Chapitre 1:

Contexte générale du projet


Cette partie est une présentation générale du
projet. Elle commence par la présentation de
l’organisme d’accueil, évoque ensuite la
problématique du projet ainsi que la conduite
adoptée pour sa réalisation.

13
Chapitre 1 : Contexte générale du projet

I. Entreprise d'accueil
I.1 Introduction :
Skills group est un Cabinet spécialisé en Technologies de l’Information, le groupe connait
depuis sa création une croissance plus qu’enviable. Désireuse de mettre les (IT) aux services
d’entrepreneurs et de leurs entreprises, Skills Group s’est fixé comme objectif majeur d’offrir
un service de pointe et de qualité, afin de répondre efficacement aux attentes et besoins d’une
clientèle toujours plus nombreuse et diversifiée. Le cabinet est divisé en trois pôles :
Pole Audit et conseil : Skills audit et conseil.

Pole : Formations et Certifications : Skills campus.

Pole : Développement : Skills créatif.

Figure 1. : Pole Skills Group

Skills Group est une société qui a été fondée par Mr Mourad ELBAZ en 2013. Son siège
social se situe à Casablanca. Elle dispose d’un capital de 100000 dirhams.

14
Chapitre 1 : Contexte générale du projet

Figure 2. : Fiche signalétique de Skills Group

I .2 Skills audit et conseil :


Ce pôle permet aux entreprises de faire le point sur l'existant afin d'en dégager les points
faibles ou non conformes (suivant les référentiels d'audit). Il s’agit donc d’effectuer des
opérations d'évaluations, d'investigations, de vérifications ou de contrôles, en raison
d'exigences réglementaires ou normatives. Il a pour but de réaliser en autre les projets
suivants :

I.2.1 Audit et accompagnement :

Audit et sécurité des applications


L'Application Performance Audit (APA) est un service de conseil proposé par Skills
Campus, permettant d'évaluer l'installation informatique de toute organisation ou entreprise.
Il consiste à formuler des recommandations pour les cadres supérieurs et/ou des
recommandations techniques détaillées portant sur tous les aspects des performances d'une
application, dont :
• Une analyse des performances et de l'utilisation des applications critiques (actuel,
tendances).
• Une analyse des performances et de l'utilisation des sites critiques.
• Les SLA des applications (définition, application, contrôle).

15
Chapitre 1 : Contexte générale du projet

• L'optimisation du réseau pour définir la bande passante nécessaire pour respecter les SLA
des applications.
• Une analyse des performances informatiques/du réseau.
Audit et sécurité web et mobile
Basé sur la méthodologie réputée d’évaluation du risque OWSAP pour tester la sécurité des
applications web, les vulnérabilités sont classifiées en catégories (ex : authentification,
autorisation, gestion des sessions, divulgation d’information, etc) ce qui facilite leur
résolution.
La sécurité des applications peut être testée sous plusieurs angles d’accès :
 Blackbox :le testeur ne dispose d’aucune information préalable et cherche à exploiter
les vulnérabilités des applications web utilisées sans le moindre indice.
 Greybox : le testeur dispose de certaines informations préalables avant de commencer
l’audit.
 Whitebox: le test de vulnérabilité se fait depuis l’intérieur de l’entreprise, avec accès
aux applications testées.

Audit de configuration :
Les audits de configuration ont pour objectifs de renforcer le niveau de sécurité de l'élément
audité en analysant sa configuration et en comparant celle-ci avec les standards de l'entreprise
où les bonnes pratiques de références issues des plus grands organismes mondiaux (CIS,
NIST, etc.).
Les audits de configuration peuvent s'effectuer sur tout type d'élément informatique dont
voici les principaux :
 Audit système.
 Audit de base de données.
 Audit de pare feuSocialAdvertising.
 Audit PABX / IPBX.

Audit global de sécurité :


Cet ensemble de prestations permet d'effectuer à la fois une analyse de l'état du système, la
conformité à un référentiel prédéfini ainsi que la recherche active des failles à partir de
l'intérieur. Toute l'utilité de cette prestation se voit décuplée lorsque l'on sait que 80 % des
malveillances informatiques proviennent de l'intérieur.
L'analyse en tant que prestation sécurité propose un audit sécurité global de la structure,
tant sur le point technique que politique.
Grace au rapport qui en découle, il sera possible d'engager les procédures nécessaires à la
mise en place d'un système de sécurité, tant physique qu'informatique fiable.

16
Chapitre 1 : Contexte générale du projet

I.2.2 Conseil :

Sensibilisation sur la sécurité :


Piratage, virus, hameçonnage etc… sont les difficultés auxquelles toute entreprise et
entrepreneur sont confrontés le plus souvent, Skills Audit & Conseil est un très bon conseiller
qui assiste tout au long de l’éventuelle situation désavantageuse.
Accompagnement ISO 27001 :
L’accompagnement de Skills Audit et Conseil se présente comme suit :
 Objectif de la prestation :
Assister dans l'implémentation d'un SMSI conforme à la norme ISO 27001.
 Description détaillée :
Cette prestation se compose des trois phases principales ci-dessous :
• Phase 1 : Phase stratégique
• Phase 2 : Etablissement des bases
• Phase 3 : Mise en place des procédures du SMSI
Mise en place de la politique sécurité :
Une perte, un vol ou une mauvaise utilisation des informations pourrait s’avérer désastreux
pour l’entreprise. Afin de réduire au plus ces risques, Skills Audit & Conseil se fait le devoir
d’accompagner l’entreprise dans la mise en place d’une politique de sécurité efficace et
garantissant la crédibilité auprès de tous les partenaires stratégiques.
Mise en place de la gouvernance SI :
Skills Audit & Conseil s’engage à guider pas à pas avec rigueur et transparence les
entreprises afin d’assurer que le système d'information en action soit bien piloté. Il s'agira en
effet de s'assurer que le SI réponde bien, aujourd'hui et demain, aux attentes des différentes
parties prenantes internes et externes, utilisateurs et clients, financiers et financeurs,
concepteurs et techniciens...
I.2 Skillscampus :
Skills Campus est le pole spécialisé dans les formations et les certifications. Il est géré par
madame AITOUNZAR Nawal.
Le but de Skills campus est d'offrir des formations de qualité pour permettre à tout
entrepreneur de faire face aux besoins et exigences des entreprises, avec le développement des
nouvelles technologies c’est devenu une priorité. Pour cela une offre de formation variée et
Multi-supports est proposée, associant les approches classiques et les avantages e-Learning
pour un apprentissage encore plus efficace.
Les formations et certifications disponibles sont divisées en plusieurs familles:

I.2.1. Management des SI

Gouvernances, directions des projets


Référentiels ITIL ISO COBIT
Technologies états de l’art

17
Chapitre 1 : Contexte générale du projet

I.2.2. Gestion des projets MOA

Gestion des projets informatiques


Maitrise d’ouvrage

I.2.3. Développement logiciel

Méthodes, test et qualités


UML
JAVA/ JEE
Développement .NET
Autres langages
Développement mobiles et tablettes temps réel et embarqué

I.2.4. SGBD / aide à la décision

Oracle SQl Server


My SQL
PostgreSQL et autre BD
Aide à la décision

I.2.5. Internet XML-SOA/ Cloud computing

Technologies Web
XML/ Web services / SOA
Cloud computing

I.2.6. Réseaux et sécurité

Réseaux et états de l’art


Réseaux et mise en œuvre
Sécurité, synthèse et référentiels
Sécurité et mise en œuvre

I.2.7. Système d’exploitation

Windows
Linux
Unix / MAC OS X
Virtualisation

I.2.8. Serveur et applications

Serveurs messageries / annuaires / DNS


Serveurs web / serveurs JEE

18
Chapitre 1 : Contexte générale du projet

I.3. Skills créatifs :


Skills créatif est le pole spécialisé dans la réalisation des solutions informatiques spécifiques
aux demandes des clients. Il est sous les ordres du chef de projets Saad BOULHOUDA.
Skills créatifs se spécialise dans la réalisation :

I.3.1. Application mobile

Spécialisée dans la création et le développement d'applications pour mobiles. La société


intervient sur tous types de projets liés aux téléphones mobiles, qu'il s'agisse de la réalisation
d'une application mobile, de la création d'un site internet mobile ou de la stratégie à mettre en
place pour réussir son implantation dans le secteur du mobile.

I.3.2. Site e-commerce

Un développeur accompagne les entreprises à chaque étape du projet e-commerce pour


aboutir à un site qui convient aux besoins.

I.3.3. Application Desktop

A partir de la conviction que les applications et logiciels qui existent sur le marché ne sont
pas adaptés à toutes les sociétés à cause de leurs complexités et leurs pénuries parfois, des
applications qui conviennent parfaitement aux activités et qui satisfont les besoins des
entreprises sont réalisées.

I.3.4. Graphique et design

Un univers graphique adapté à l’identité des différentes entreprises est créé. Le Sens du
détail et de l'esthétique est au rendez-vous pour une communication originale, 100% sur
mesure.

I.3.5. Implémentation et intégration ERP

L’introduction réussie des solutions est au cœur de tous les projets d’implémentation. Elle
comprend une conception détaillée de la solution ainsi que la configuration de pilotage et le
déploiement des produits.

19
Chapitre 1 : Contexte générale du projet

I.4.Organigramme de l’entreprise :

Figure 3. : Organigramme de Skills Group

II. Présentation du projet


Dans le cadre de cette partie, nous allons faire une étude de l'existant, présenter la
spécification des besoins qui consiste à la qualification des besoins fonctionnels et non
fonctionnels attendus du système afin de mieux comprendre le projet.
II.1 Description de l'existant
A présent, la société Skills Campus dispose d'un site web développé avec un logiciel CMS
(WORDPRESS) pour présenter le centre de formation ainsi que ses services.
Le site inclus principalement les fonctionnalités suivantes :
Présentation de la société et de ses pôles de formations.
Présentation des formations et des certifications.
Présentation d’un agenda de formations les plus récentes.

II.2 Critique de l'existant


La critique de l’existant doit mettre en évidence les activités fondamentales et les
informations associées ainsi que les principaux dysfonctionnements du système actuel,
autrement dit, de l’ancien site de Skills Campus.
Suite aux remarques que nous avons faites au site de Skills Campus, nous avons constaté
qu’il présente les limites suivantes :
Les limites au niveau des informations :

20
Chapitre 1 : Contexte générale du projet

 Le site ne présente pas un module d'inscription en ligne.


 Le site ne présente pas les informations sur les séminaires déroulées dans le centre de
formation.
 Le contenu des pages des formations et certifications n'est pas suffisant, il y a un
manque d'informations.
 L'absence d'un espace des offres de recrutement et la possibilité de postuler à ces
offres.
 Le site ne présente pas les formations et les certifications selon les catégories et
domaines.
 Les actualités ne sont pas organisées par formation, certification et séminaire.
 Les formations ne sont pas regroupées par ville.
 Le catalogue des formations n'est pas généré automatiquement de la base de données,
et n'est pas sécurisé.
 La partie administrative du site est gérée par un CMS.

Les limites au niveau de performance et navigation:


Un site réalisé avec un logiciel CMS présente certaines limitation au niveau :
 Performance : La raison réside dans le fait que toutes les pages sont dynamiques,
beaucoup d’opérations sont requises afin de les construire, le programme doit se
connecter à la base de données pour afficher le contenu, etc. La mise en cache permet
de limiter ces problèmes mais ne les règle pas tous.
 Flexibilité : Les CMS vous permettent de faire beaucoup de choses, mais pas tout. Il
existe toujours une certaine limitation dans les possibilités de personnalisation.

 Maintenance et stabilité : Un CMS est un programme complexe, qui est donc


susceptible de connaître des pannes. L’utilisation intensive de la base de données
augmente cette probabilité. De ce fait, il faut effectuer de nombreuses sauvegardes de
la base de données, pour éviter des pertes.

 Migration : Un site sous CMS est plus compliqué à migrer qu’un simple site
classique.

II.3. Spécification des besoins


Etant donnée la nécessité d’avoir un système informatique de qualité, la plateforme doit
répondre aux besoins des responsables du centre Skills campus.

Après l'étude que nous avons effectuée et selon les besoins du centre de formation, nous
opterons pour un nouveau site avec des nouvelles fonctionnalités.
Le projet est divisé en deux grandes parties. La première partie consiste en la réalisation de
la partie BackOffice qui gère le site, elle fonctionne comme une interface administrative du
site. La deuxième est la partie FrontOffice, c'est à dire la partie présentation du site.

21
Chapitre 1 : Contexte générale du projet

Les besoins fonctionnels :


Notre système intitulé "Site web Skills Campus" doit satisfaire les besoins fonctionnels
suivants pour les deux parties Back-office et Front-Office:

Back-office :

 Gestion des utilisateurs de l'application.


 Gestion des formations et des Certifications.
 Gestion des sessions des formations.
 Gestion des séminaires.
 Gestion des actualités.
 Gestion des offres du recrutement.
 Gestion des participants et les intervenants.
 Gestion des formations E-Learning.

Front-office :
 Implémentation d’un module de pré-inscription aux formations et aux certifications et
aussi aux formations E-Learning et aux séminaires.
 Génération du catalogue de formation dynamiquement.
 La présentation des formations E-Learning, des formations et des certifications selon
les catégories et les domaines.
 La présentation des séminaires par thème et par ville.
 La présentation des solutions des formations.
 La présentation de Skills Campus et de ses missions.
 La présentation des partenaires et la partie qui finance le centre.
 L'affichage des centres de formation dans une Map.
 Recherche des sessions des formations par ville.
 Espace pour les actualités: formations, certifications et séminaires.
 Gestion des galeries d'actualités dynamiquement sous forme des slides.
 La publication des offres de recrutement.
 Un espace pour postuler aux offres et une candidature spontanée.

Les besoins non fonctionnels :


Ce sont les besoins qui permettraient d’améliorer la qualité des services du site comme la
convivialité et l’ergonomie des interfaces et l’amélioration du temps de réponse. Parmi ces
besoins, on cite :

 La sécurité : Besoins d’établissement de la connexion, il faut avoir une interface


d’authentification qui permet à chaque utilisateur de se connecter pour consulter son
profil.

 La convivialité :Le site doit être facile à utiliser. Il doit présenter un enchainement
logique entre les interfaces et un ensemble de liens suffisants pour assurer une
navigation rapide et un texte compréhensible, visible et lisible.

22
Chapitre 1 : Contexte générale du projet

 La disponibilité : Lorsque n’importe quel utilisateur désire consulter le site,il doit être
disponible.

 Temps de réponse: Le temps de réponse doit être le plus court possible.

II.4. Les contraintes


Contraintes de temps :
le livrable devra être réalisé avant le 07/09/2016.
Contraintes techniques :
Les outils de développement doivent être performants et sécurisés.
Le design doit être attirant afin de bien l’aimer et trouver une passion en navigant
sur le site

II.5. Choix du cycle de développement


Pour réaliser effectivement l’application, il nous faut suivre une méthodologie de travail.
Nous n'allons pas nous lancer dans le projet sans avoir auparavant préparé une méthode de
travail, un planning sinon le projet sera voué à l’échec.
En informatique, les méthodes de processus de génie logiciel constituent les guides
méthodologiques de travail. Il existe plusieurs méthodes. Nous avons privilégié les méthodes
de Processus Unifié. En anglais UP (UnifiedProcess), ces méthodes sont itératives et
incrémentales.
Il existe plusieurs cycles de développement. Afin de pouvoir choisir le cycle adéquat, nous
avons tout d’abord dressé un tableau comparatif de quelques cycles potentiels.
Nous proposons ce tableau comme comparatif entre les méthodes de développement :

Méthodes Description Points Forts Points Faibles

- Propose de dérouler les - Distingue clairement - Non itératif


En phases du projet de façon les phases du projet
cascade séquentielle

RUP - Promu par Rational. - Itératif - Coûteux à


Personnaliser
(Rational - Le RUP est à la fois une - Propose des modèles
- Très axé
méthodologie et un de documents, et des
Unified canevas pour des processus, au
outil prêt à l’emploi projets types détriment du
Process) Développement
(documents types partagés

23
Chapitre 1 : Contexte générale du projet

dans un référentiel Web).

XP - Chaque phase en amont - Itératif - Obligation de


(eXtremeProgrammin) de la production du logiciel - Fait une large place définir la totalité
prépare la phase aux aspects des besoins au
correspondante de techniques : départ.
vérification en aval de la prototypes, règles de - Validation
production du logiciel. développement, fonctionnelle
tests… tardive

2TUP - S’articule autour de - Itératif - Ne propose pas


l’architecture - Fait une large place de documents
(Two Track
- Propose un cycle à la technologie et à types
unified de développement en la gestion du risque
Process) Y

Tableau 1. : Tableau comparatif

Dans notre projet, l'itératif est imposé parce qu'il réduit la complexité pour les travaillants
par approches successives et incrémentales. Il est alors possible de présenter rapidement aux
utilisateurs des éléments de validation. De plus, l'itératif permet une gestion efficace des
risques en abordant dès les premières itérations les points difficiles.
Le choix de la technologie et de l’architecture du futur système est l’une des plus
importantes phases de ce projet vu le degré élevé de sa complexité technique.
Le 2TUP propose un cycle de développement en Y, qui dissocie les aspects techniques des
aspects fonctionnels. Il semble le plus adapté pour mener à bien notre projet.
Les trois autres n’y attachent pas grande attention. En effet, RUP propose plutôt un cadre
complet pour la conduite de projet, mais n’attache pas trop d’importance pour le
développement lui-même.
Le cycle en V quant à lui, permet de maîtriser le développement à travers les vérifications à
la fin des phases, mais il n’offre toujours pas de gestion de la complexité technique.
Quant à XP, elle est beaucoup plus adaptée à des projets de petites tailles et de plus des activités
telles que l’estimation, la planification, s’avèrent être très difficiles à réaliser ce qui est non
acceptable pour notre projet.
2TUP propose un cycle de développement en Y qui s’articule autour de trois phases:

24
Chapitre 1 : Contexte générale du projet

Une branche fonctionnelle (branche gauche)


Cette branche comporte :
Une capture des besoins fonctionnels, qui produit le modèle des besoins focalisé sur le
métier des utilisateurs. Elle qualifie, au plus tôt le risque de produire un système
inadapté aux utilisateurs.

Une analyse, qui consiste à étudier précisément la spécification fonctionnelle de


manière à obtenir une idée de ce que va réaliser le système en terme de métier
indépendamment de la technologie utilisée.
Une branche technique (branche droite)
Cette branche se compose de :
La capture des besoins techniques, qui recensent toutes les contraintes sur les choix
des outils, matériels sélectionnés, la conception du système ainsi que la prise en
compte des contraintes d’intégration avec l’existant (pré-requis d’architecture
technique).

La conception générique, qui définit ensuite les composants nécessaires à la


construction de l’architecture technique. Cette conception est complètement
indépendante de l’aspect fonctionnel. Elle a pour objectif d’uniformiser et de réutiliser
les mêmes mécanismes pour tout un système.

L’architecture technique construit le squelette du système, son importance est telle


qu’il est conseillé de réaliser un prototype.

Phase de réalisation (branche commune)


Les deux branches précédentes se réunissent dans la phase de réalisation qui comporte :
La conception préliminaire, qui représente une étape délicate, car elle intègre le
modèle d’analyse fonctionnelle dans l’architecture technique de manière à tracer la
cartographie des composants du système à développer.

La conception détaillée, qui étudie ensuite comment réaliser chaque composant.

L’étape de codage, qui produit ses composants et teste au fur et à mesure les unités de
code réalisés.

L’étape de recette, qui consiste enfin à valider les fonctionnalités du système


développé.

Nous retrouvons la plupart des phases de la méthode dans la figure suivante :

25
Chapitre 1 : Contexte générale du projet

Figure 4: Processus de Développement Y.

1) La capture des besoins fonctionnels produit un modèle des besoins focalisés sur le
métier des utilisateurs. (fonctionnelle).
2) La capture des besoins techniques recense toutes les contraintes et les choix
dimensionnant la conception du système. (technique).
3) L’analyse, qui consiste à étudier précisément la spécification fonctionnelle de manière
à obtenir une idée de ce que va réaliser le système en termes de métier. (fonctionnelle).
4) La conception générique définit ensuite les composants nécessaires à la construction
de l’architecture technique. (technique).
5) La conception préliminaire représente une étape délicate, car elle intègre le modèle
d’analyse dans l’architecture technique de manière à tracer la cartographie des
composants du système à développer. (Réalisation).
6) La conception détaillée, étudie comment réaliser chaque composant. (Réalisation).
7) L’étape de codage produit ces composants et teste au fur et à mesure les unités de code
réalisées. (Réalisation).
8) La conception détaillée, étudie comment réaliser chaque composant. (Réalisation).
9) L’étape de recette, qui consiste enfin à valider les fonctions du système développé.

II.6. Gestion des risques


Cette partie concerne notre démarche relative à la gestion des risques pouvant perturber,
gêner voire entraver le bon déroulement de la mise en place de notre projet.
Dans un premier temps, nous avons dressé un listing non exhaustif des risques pouvant
survenir au cours de la mise en œuvre du projet. Et pour chaque risque nous estimerons
l’impact suivi d’un ensemble d’actions préventives et correctives.

26
Chapitre 1 : Contexte générale du projet

Risque Impact Mesures Préventives Mesures Correctives

Non - Le changement du -Proposer les - Corriger les


acceptation des design des interfaces interfaces au client interfaces - Faire
interfaces devront être fait. pour les valider participer le
-Dépassement du avant de les inclure client dans toutes
délai. dans le projet. les phases du projet

Dépassement -Retard dans la -Etablir une gestion


du délai livraison de du projet des
l'application différentes tâches

Bugs Disfonctionnement Etablir un plan de Assurer les mises à


du système test jour
Tableau 2: Tableau de gestion des risques

II.7 Planification du projet


La planification est une étape très importante qui permet d’assurer le bon déroulement du
projet tout au long des phases constituant le cycle de développement.
D’après les réunions que nous avons eu avec mon encadrant, nous avons pu identifier les
étapes clés suivantes :
 Etude prémilitaire
 Etude fonctionnelle
 Etude technique
 Analyse et conception
 Développement de la partie Back-office
 Développement de la partie front office
 Test et simulation
 Maintenance et modification

La figure ci-dessous présente le planning qui était notre fil conducteur pour réaliser le projet

Figure 5: Diagramme de gantt

27
Chapitre 1 : Contexte générale du projet

Conclusion
Dans ce chapitre, nous avons pu insérer notre projet dans son contexte en présentant la
solution adoptée pour résoudre les problèmes et qui répond à nos besoins. Dans le chapitre
suivant, nous allons présenter la conception qui a été mise en œuvre tout au long de la
réalisation de ce projet.

28
Chapitre 2 : Conception du projet

Chapitre 2:

Conception du projet
Le présent chapitre a pour objectif de
présenter la conception préliminaire et
détaillée des modules lors de l’étude
fonctionnelle.

29
Chapitre 2 : Conception du projet

I. Introduction
Après avoir cité les différentes fonctionnalités de notre projet dans le deuxième chapitre,
nous abordons dans ce chapitre une phase importante et indispensable dans le cycle de vie
d’une application. Cette phase est la conception qui a pour but d’expliquer le déroulement de
notre application ainsi qu’assurer une bonne compréhension des besoins des utilisateurs.

II. Conception détaillée


II.1 Diagramme de contexte statique
D’après le cahier de charges, on différencie les acteurs qui interagissent avec le back office
de ceux qui interagissent avec le front office.

II.1.1 Back office :

Administrateur : gère les utilisateurs leurs privilèges ainsi que leurs états de compte (activé/
désactivé).
Responsables de formation : Ce sont les agents de l’entreprise qui souhaite utiliser le back
office, ils peuvent :

Gérer les formations, leurs sessions et leurs intervenants, leur contenu et également
leurs participants.
Gérer les certifications, leur contenu et leurs participants.
Gérer les formations e-learning, leurs sessions, ainsi que leur contenu et leurs
participants.
Gérer les séminaires, leurs intervenants et leurs participants.
Gérer les actualités, les offres de recrutement et leurs candidats.

Figure 6: Diagramme de contexte statique du back office

30
Chapitre 2 : Conception du projet

II.1.2 Front office :

Internaute : tout utilisateur du réseau internet qui a visité le site et qui peut :

Consulter les formations, les certifications et les actualités.


Générer le catalogue de formations pour savoir les formations proposées actuellement
par Skills Campus.
Postuler aux offres de recrutements publiés par les responsables de formations.
Rechercher les sessions des formations et les séminaires par ville.
Préinscrire dans les formations, les certifications, les formations e-learning ou bien
dans les séminaires en choisissant la solution de formation qui lui convient (individu,
sur mesure, interentreprises).

Figure 7: Diagramme de contexte statique du front office

Le back office est une application web qui admet l’interaction avec plusieurs acteurs.
Administrateur et responsables de formations peuvent y accéder pour effectuer la gestion du
contenu du site (front office).
D’autre part, le front office qui est le site web peut être visité par les internautes qui sont les
acteurs primaires du système, ils peuvent s’informer par les activités et les services offerts par
Skills Campus et également préinscrire dans les services qu’ils veulent.

II.2 Diagramme de cas d’utilisation général

II.2.1 Back office :

31
Chapitre 2 : Conception du projet

Figure 8: Diagramme de cas d’utilisation général (back office)

II.2.2 Front office :

32
Chapitre 2 : Conception du projet

Figure 9:Diagramme de cas d’utilisation général (front office)

Certains cas d’utilisations présentés dans ces diagrammes au-dessus sont déduits à partir du
cahier de charges et maintenus dans leurs états généraux, les détails sont exposés dans le
début de chaque module.

33
Chapitre 2 : Conception du projet

II.3 Fonctionnalités Back office

II.3.1 Gestion des utilisateurs :

Diagramme de cas d’utilisation :

Figure 10: Diagramme de cas d’utilisation – Gestion des utilisateurs

Description textuelle de haut niveau "Authentification" :


Nom : S’authentifier
Objectif : Avoir accès au système, sans passer par cette étape on ne
peut pas utiliser les fonctionnalités fourni par le back office.
Acteurs principaux : Administrateur, Responsable de formations
Acteurs secondaires :
Evénement déclencheur : Ouverture du back office
Date :
Responsable : EL HABTI Kaoutar
Version : 1.3
Terminaison : Accès au back office
Tableau 3: Description textuelle haut niveau-Authentification

34
Chapitre 2 : Conception du projet

Description textuelle de haut niveau "Gestion des utilisateurs" :


Nom : Gestion des utilisateurs
Objectif : Permet de créer des nouveaux utilisateurs et leurs accorder
des privilèges afin de contrôler l’accès au système.
Acteurs principaux : Administrateur
Acteurs secondaires :
Evénement déclencheur :
Date :
Responsable : EL HABTI Kaoutar
Version : 1.3
Terminaison : Gestion des utilisateurs
Tableau 4: Description textuelle haut niveau-Gestion des utilisateurs

Diagramme de séquence :
Le déroulement de scénario nominal
Action des acteurs Action du back office
1) L’utilisateur choisit le menu « Utilisateurs» 2) Le système affiche la liste des utilisateurs
déjà enregistrées avec les options suivantes :
 Ajouter un utilisateur
 Modifier un utilisateur
 Supprimer un utilisateur
3) L’utilisateur clique sur l’option « Ajouter un 4) Le système affiche un formulaire d’ajout des
nouveau utilisateur » utilisateurs.
5) L’utilisateur valide le formulaire d’ajout 6) Le système enregistre l'utilisateur ajouté et
actualise la liste .
7) L’administrateur clique sur l’option « 8) Le système affiche le formulaire de
modifier» modification pré rempli.
9) L’administrateur modifie les informations de 10) Le système enregistre les modifications
l'utilisateur.
11) L’administrateur clique sur l’option 12) Le système affiche un message de
«supprimer» confirmation
13) L’administrateur confirme la suppression 14) Le système supprime l'utilisateur et actualise
la liste .

35
Chapitre 2 : Conception du projet

Figure 11: Diagramme de séquence – Gestion des utilisateurs

Diagramme d'activité :

36
Chapitre 2 : Conception du projet

Figure 12: diagramme d'activité _ gestion utilisateur

II.3.2 Gestion des formations

Diagramme de cas d’utilisation :

Figure 13: Diagramme de cas d’utilisation – Gestion des formations

Description textuelle de haut niveau "gestion des formations":

37
Chapitre 2 : Conception du projet

Nom : Gestion des formations


Objectif : Gérer les formations dans le back office afin de les afficher
dans le front office et mettre à jour le site.
Acteurs principaux : Administrateur, Responsable de formation
Acteurs secondaires :
Evénement déclencheur :
Date :
Responsable : EL HABTI Kaoutar
Version : 1.3
Terminaison : Gestion des formations
Tableau 5: Description textuelle de haut niveau-Gestion des formations

Diagramme de séquence :
Le déroulement de scénario nominal
Action des acteurs Action du back office
1) L’utilisateur choisit le menu « Formations» 2) Le système affiche la liste des formations déjà
enregistrées avec les options suivantes :
 Ajouter une formation
 Modifier une formation
 Supprimer une formation
3) L’utilisateur clique sur l’option « Ajouter une 4) Le système affiche un formulaire d’ajout des
nouvelle formation » formations.
5) L’utilisateur valide le formulaire d’ajout 6) Le système enregistre la formation ajoutée et
d’une formation actualise la liste des formations
7) L’utilisateur clique sur l’option « modifier» 8) Le système affiche le formulaire de
modification pré rempli
9) L’utilisateur modifie les informations de la 10) Le système enregistre les modifications
formation
11) L’utilisateur clique sur l’option «supprimer» 12) Le système affiche un message de
confirmation
13) L’utilisateur confirme la suppression 14) Le système supprime la formation et
actualise la liste des formations

38
Chapitre 2 : Conception du projet

Tableau 6: scénario nominal-Gestion des formations

Figure 14: Diagramme de séquence – Gestion des formations

Diagramme d’activité

39
Chapitre 2 : Conception du projet

Figure 15: Diagramme d’activité – Gestion des formations

La gestion des formations se passent comme ceci :


Le système affiche une liste qui contient toutes les informations des formations avec la
possibilité d’ajouter, modifier ou de supprimer un élément de cette liste.
Pour ajouter une nouvelle formation le système affiche un formulaire de saisie qui doit être
rempli par l’utilisateur. Si la nouvelle formation est correctement ajoutée dans la base de
données la liste sera actualisée, sinon le système affichera un message d’erreur.
Le scénario de la modification est pareil, sauf que le formulaire de saisie s’affiche avec les
informations de la formation à modifier.
Pour supprimer une formation, l’utilisateur clique sur l’option supprimer, le système demande
une confirmation, si l’utilisateur confirme la suppression, la formation va être supprimée de la
base de données et également de la liste.

Diagramme de séquence boite blanche :

Le diagramme de séquence boite blanche montre l’interaction entre les différentes


composantes internes du système (les interfaces graphiques, les contrôleurs et les entités).

40
Chapitre 2 : Conception du projet

Figure 16: Diagramme de séquence boite blanche – Gestion des formations

41
Chapitre 2 : Conception du projet

II.3.3 Gestion des participants

Diagramme de cas d’utilisation :

Figure 17: Diagramme de cas d’utilisation – Gestion des participants

Description textuelle haut niveau "gestion des participants":


Nom : Gestion des participants
Objectif : Gérer les participants aux formations, certifications,
formations e-learning, séminaires.
Acteurs principaux : Administrateur, Responsable de formation
Acteurs secondaires :
Evénement déclencheur :
Date :
Responsable : EL HABTI Kaoutar
Version : 1.3
Terminaison : Gestion des participants
Tableau 7: description textuelles haut niveau - Gestion participants

Diagramme de séquence :
Le déroulement de scénario nominal
Action des acteurs Action du back office
1) L’utilisateur choisit le menu « Participants» 2) Le système affiche la liste des participants
déjà enregistrées avec les options suivantes :
 Modifier un participant
 Supprimer un participant
3) L’utilisateur clique sur l’option « modifier» 4) Le système affiche le formulaire de
modification pré rempli
5) L’utilisateur modifie les informations du 6) Le système enregistre les modifications
participant
7) L’utilisateur clique sur l’option «supprimer» 8) Le système affiche un message de

42
Chapitre 2 : Conception du projet

confirmation
9) L’utilisateur confirme la suppression 10) Le système supprime le participant et
actualise la liste des participants
Tableau 8: scénario nominal- Gestion participants

Figure 18: Diagramme de séquence – Gestion des participants

43
Chapitre 2 : Conception du projet

Diagramme d’activité

Figure 19: Gestion participants - Diagramme d’activité

La gestion des participants se passent comme ceci :


Le système affiche une liste qui contient toutes les informations des participants avec la
possibilité de modifier ou supprimer un élément de cette liste.
Pour modifier un participant le système affiche un formulaire de modification rempli par les
informations du participant à modifier qui doit être rempli par l’utilisateur. Si le participant
est correctement modifié, la liste sera actualisée, sinon le système affichera un message
d’erreur.
Pour supprimer un participant, l’utilisateur clique sur l’option supprimer, le système demande
une confirmation, si l’utilisateur confirme la suppression, le participant va être supprimée de
la base de données et également de la liste.

II.4 Front office

II.4.1 Postuler aux offres

Diagramme de séquence
Le déroulement de scénario nominal
Action des acteurs Action du front office
1) L’utilisateur choisit le menu « Recrutement » 2) Le système affiche les offres le plus récentes.
3) L’utilisateur sélectionne l’offre à postuler 4) Le système affiche le formulaire de
candidature
5) L’utilisateur valide le formulaire de saisie 6) Le système enregistre la candidature
Figure 20: scénario nominal - Postuler aux offres

44
Chapitre 2 : Conception du projet

Figure 21: Diagramme de séquence – Postuler aux offres

II.4.2 Consulter le catalogue

Diagramme de séquence
Le déroulement de scénario nominal
Action des acteurs Action du front office
1) L’utilisateur clique sur le lien « catalogue 2) Le système affiche le formulaire de
formation» protection.
3) L’utilisateur saisie le mot de passe de 4) Le système génère le catalogue de formation.
protection
Tableau 9: scénario nominal - générer catalogue formation

45
Chapitre 2 : Conception du projet

Figure 22 : Diagramme de séquence – Consulter le catalogue

II.4.3 Préinscription

Diagramme de séquence :
Le déroulement de scénario nominal
Action des acteurs Action du front office
1) L’utilisateur demande de préinscrire 2) Le système affiche le menu des services
3) L’utilisateur choisit de préinscrire dans une 4) Le système affiche les solutions des
formation formations
5) L’utilisateur choisit une solution des 6) Le système affiche le formulaire de saisie
formations correspondant à la solution.
7) L’utilisateur rempli le formulaire de 8) Le système enregistre l’internaute comme
préinscription participant
Tableau 10: scénario nominal - préinscription

46
Chapitre 2 : Conception du projet

Figure 23: Diagramme de séquence – Préinscription

II.5 Diagramme de classe


L'analyse approfondie des fonctionnalités du système nous a permis d'identifier l'ensemble
des entités métiers, leurs modélisations et celle des associations qui les relient sont illustrées
par le diagramme de classe ci-dessous :

47
Chapitre 2 : Conception du projet

Figure 24: Diagramme de classe

II.6 Diagramme de déploiement


Le diagramme de déploiement spécifie un ensemble de constructions qui peut être utilisé
pour définir l'architecture d'exécution des systèmes qui représentent l'affectation d'artefacts
logiciels à des nœuds. Les nœuds sont connectés via des chemins de communication pour
créer des systèmes de réseau d'une complexité quelconque. Les nœuds sont en général définis
d'une manière imbriquée et représentent soit des périphériques matériels, soit des
environnements d'exécution de logiciels. Les artefacts représentent des éléments concrets du
monde physique qui sont le résultat d'un processus de développement.

48
Chapitre 2 : Conception du projet

Figure 25: Diagramme de déploiement

Description :
La réalisation d'une application en JEE, consiste à suivre des concepts et respecter certaine
norme, chaque application web doit être séparé en couches :
Couche présentation.
Couche métier.
Couche persistante.
Le diagramme ci-dessus présente la schématisation de composantes utilisées dans la création
de l'application :
- Serveur Web(Apache Tomcat 7) : c'est où le système va être installé, le serveur contient
un interpréteur java (JVM - Java Virtual Machin) qui va exécuter le code java installé on
interrogeant un serveur de base de données.
- Serveur de base de données (MySQL) : Le SGBD MySQL est supporté par un large
éventail d'outils, il est surtout installé pour les applications Web, et celui qui va contenir la
base de données du système.
- PC client : qui contient un navigateur internet qui va se connecter avec le serveur web via
l'internet et par des requêtes HTTP il va scruter le système

49
Chapitre 2 : Conception du projet

Conclusion
Au cours de ce chapitre, nous avons présenté les diagrammes qui décrivent les
fonctionnalités de notre application comme les diagrammes de cas d’utilisation et les
diagrammes de séquence. Dans le chapitre suivant, nous allons formaliser ce qu’on vient de
décrire au cours de ce chapitre.

50
Chapitre 3 : Etude technique du projet

Chapitre 3:

Etude technique
Ce chapitre présente l’étude technique et
l’architecture choisie pour implémenter
à la fois le back office et le front office de
notre plateforme.

51
Chapitre 3 : Etude technique du projet

I. Capture des besoins techniques


La capture des besoins techniques traite les spécifications techniques physiques et
logicielles du système, abstraction faite des détails fonctionnels. De ce fait, elle débouche sur
une conception générique adoptée pour la réalisation du système.
Dans le cadre de notre projet, plusieurs contraintes techniques nous ont été imposées par le
chef de projet afin de s’adapter avec son savoir-faire et son pré-requis technique, à savoir :
La solution doit suivre les standards de la plate-forme JEE.
Le système doit être réparti en couches afin de faciliter sa maintenance et son
évolutivité.
Dans ce qui suit, nous allons analyser les exigences techniques prises en compte dans la
conception du système tout en explicitant les apports de la solution.

I.1 Architecture physique


L’architecture physique du système à réaliser est une architecture client/serveur multi-tiers.
Cette architecture présente plusieurs avantages, entre autres, les applications au niveau de
serveur sont délocalisées, c'est-à-dire que chaque serveur est spécialisé dans une tâche, ce qui
permet une grande souplesse, plus de sécurité étant donné que la sécurité peut être définie
indépendamment pour chaque serveur, mais aussi de meilleures performances à travers le
partage des tâches entre les différents serveurs
Ainsi l’architecture de notre site intégrera :
Un serveur web Apache permet d'interpréter les requêtes HTTP arrivant sur
le port associé au protocole http et de fournir une réponse avec ce même protocole.

Un serveur d’application "TOMCAT 7" se charge de traiter les requêtes émanant du


client et puis de lui retourner la réponse.

Un serveur de base de données "MySQL 5.5" se charge de la gestion du stockage des


données.

52
Chapitre 3 : Etude technique du projet

Figure 26: Architecture physique

I.2Architecture technique
Parmi les différentes façons de structurer une architecture, la mieux adaptée et maîtrisée en
informatique est l'approche par tiers. Chaque couche (tiers) possède des responsabilités
spécifiques.
Dans une structuration par couches, les couches qui précèdent prennent en charge des
responsabilités qui offrent un socle de base pour les couches suivantes, permettant d'abstraire
celles-ci de problématiques qui ne les concernent pas.
Une telle architecture permet également d'obtenir un bon niveau de réutilisabilité, à travers la
ré-application des solutions aux problèmes rencontrés pour chaque couche, dans d’autres
applications utilisant la même architecture.

53
Chapitre 3 : Etude technique du projet



Figure 27: Architecture technique


 Couche présentation

Cette couche correspond à la partie visible interagissant directement avec notre système.
Elle gère la cinématique et la navigation dans l’application et effectue le traitement de
validation du premier niveau. Elle prend aussi la responsabilité de formatage des champs
saisis ou affichés et de gestion de la session utilisateur et du contexte.
Cette couche implémentée par le Framework Semantic UI. Une inversion de contrôle (IOC)
est implémentée pour assurer la communication entre les différentes couches du système.
 Couche service

Son rôle est de fournir des services spécifiques à la couche Présentation. Ces services
correspondent aux règles du métier définies lors de la phase d’analyse. Elle prend en charge
les aspects de contrôle des cas d'utilisation.

54
Chapitre 3 : Etude technique du projet

Chaque service est constitué d’une interface et une classe d’implémentation dont le lien est
spécifié dans le fichier de configuration de Spring. Une inversion de contrôle (IOC) est
implémentée pour assurer la communication entre le service et couche d’accès aux données.
En effet, un service doit contenir les interfaces des objets d’accès aux données (DAO) comme
attributs membres. L’instanciation de ces DAO est assurée par Spring.
 Couche Persistance

La couche Persistance est la couche qui sert de communicateur avec la base de données.
C’est elle la responsable de la création, destruction et chargement des objets métier de
manière totalement transparente. Le rôle de cette couche est de masquer entièrement
l'opération de création et de manipulation des tables (SGBDR) ou autre types de stockages
spécifiques (Fichiers plats, ...).
Chacune des couches précédemment citées a seulement la permission d'appeler la couche
suivante (ainsi, la couche Présentation ne peut utiliser/récupérer/instancier que des objets de
sa propre couche ou de la couche service et à l'autre bout, la couche Persistance ne peut
utiliser que des objets de sa propre couche).

II. Identification des options


Solution 1 : ASP
ASP est une technologie de Microsoft. Il se veut plus ouvert dans la mesure où il
constitue une norme et non un langage, on peut programmer en ASP VBScript, mais aussi en
JavaScript et en Perl. Mais en fait d'ouverture, ASP ne fonctionne réellement qu'avec les
serveurs de Microsoft (IIS), son équivalent pour Apache ne fonctionnant qu'avec le langage
Perl. Donc finalement c'est la plus fermée des trois technologies, donc la plus chère et pas
forcément la meilleure.
ASP ne peut tourner que sous server IIS de Microsoft et donc le server doit être un serveur
Windows. C'est un langage très proche du VisualBasic et du VBScript.
Solution 2 : J2EE
JSP est un élément de la norme J2EE, l'autre étant la partie Servlet écrite en pur Java. Il
sépare fortement le fond de la forme et donne l'accès à toute la richesse du langage Java. Par
contre les serveurs d'application, version Java améliorée des serveurs web, sont une
architecture très lourde à réserver à de grosses applications.
Très grande portabilité, plus grande stabilité du code à travers le temps, le langage est
soutenu par Oracle (anciennement Sun Microsystems).

Solution 3 : PHP

PHP est langage de programmation interprété dynamique, qui permet l’interaction entre
les pages statiques. Il est un langage autonome mais conçu principalement pour des
applications web. Il est plus simple mais plus limité (par exemple au niveau des espaces de
nommage, de la programmation objet, ...) que des langages généralistes et tente actuellement

55
Chapitre 3 : Etude technique du projet

de combler ces manques mais au prix d'un accroissement de sa complexité bien dommageable
au regard de sa vocation initiale.
A priori il sépare peu le fond de la forme même si c'est possible et parfois pratiqué.
Les failles de sécurité se sont révélées très nombreuses au fil des années.
Il n'y pas de structure prédéfinit, il faut donc ajouter des cadres d'applications pour
atteindre des niveaux comme le MVC (CodeIgniter, Symfony,...).
Les fonctions sont biodégradables : environ 500 fonctions sont obsolètes depuis sa version
3, sachant qu'il y a environ 5 000 fonctions, ceci indiquant une volatilité de 10%. Voici ci-
dessous un tableau de comparaison des avantages et inconvénients de chaque solution qui sera
adopté :
Solution 1 : ASP

Avantages Inconvénients

-L’apprentissage est simple - Obligation d’utilisation des


-Le développement est beaucoup plus solutions Microsoft.
simple, rapide, - Obligation d’installer l’application
- Le délai de livraison est plus court sur un système d’exploitation
-Pour chaque produit payant il existe Microsoft (Xp, Server)
une version gratuite (Express) limitée -Cout relativement élevé
en fonctionnalité mais qui peut servir
en attendant une acquisition complète.
- Solution portable
Tableau 11. : Les avantages et les inconvénients de l'ASP

Solution 2 : Technologie J2EE

Avantages Inconvénients

-L’application est -L’apprentissage est très difficile


portable, multiplateforme - Le délai de livraison est trop
- Cout très faible long

Tableau 12.: Les avantages et les inconvénients de JEE

56
Chapitre 3 : Etude technique du projet

Solution 3 : PHP

Avantages Inconvénients

-Documentation facile à -Niveau de sécurité faible


trouver -Langage bas niveau
- Cout faible
Tableau 13. : Les avantages et les inconvénients de PHP

En comparant les trois solutions, nous avons constaté que la technologie J2EE est la
meilleure et fiable solution qui peut bien répondre aux exigences et objectifs voulant
atteindre, au niveau de portabilité, sécurité la force de java ainsi que la stabilité du code.

III.Technologies et Frameworks
 La plateforme JEE
L’élaboration de notre application s’appuie sur la plateforme J2EE (Java 2 Enterprise
Edition) qui est une norme proposée par la société Sun, portée par un consortium de sociétés
internationales, visant à définir un standard de développement d'applications d'entreprises
multi-niveaux, basées sur des composants. On parle généralement de «plate-forme J2EE»
pour désigner l'ensemble constitué des services (API) offerts et de l'infrastructure d'exécution.
J2EE comprend notamment :
Les spécifications du serveur d'application, c'est-à-dire de l'environnement
d'exécution:
J2EE définit finement les rôles et les interfaces pour les applications ainsi que
l'environnement dans lequel elles seront exécutées. Ces recommandations permettent
ainsi à des entreprises tierces de développer des serveurs d'application conformes aux
spécifications ainsi définies, sans avoir à redévelopper les principaux services.
Des services, au travers d'API, c'est-à-dire des extensions Java indépendantes
permettant d'offrir en standard un certain nombre de fonctionnalités. Sun fournit une
implémentation minimale de ces API appelée J2EE SDK (J2EE Software
Development Kit).
Dans la mesure où J2EE s'appuie entièrement sur le langage Java, il bénéficie des
avantages et inconvénients de ce langage, en particulier une bonne portabilité et une
maintenabilité du code.
Ce choix est justifié par plusieurs facteurs à savoir :
La maturité et la richesse de cette technologie ;
La possibilité de la réutilisation des différents composants qui en font partie ;
La séparation forte qu’offre-la plupart des Framework relevant de cette architecture
La maintenabilité des applications.

57
Chapitre 3 : Etude technique du projet

 Le Framework Spring (Spring Ioc)


Spring est un Framework libre pour construire et définir l'infrastructure d'une application
java 2, dont il facilite le développement et les tests, il est considéré comme un conteneur dit
«léger».
Spring s'appuie principalement sur l'intégration de trois concepts clés :
Ioc.
La programmation orientée aspect.
Une couche d'abstraction.
Ce Framework, grâce à sa couche d'abstraction, ne concurrence pas d'autres frameworks dans
une couche spécifique d'un modèle architectural MVC mais s'avère un framework
multicouches pouvant s'insérer au niveau de toutes les couches : modèle, vue et contrôleur.
Ainsi il permet d'intégrer Hibernate pour la couche de persistance.
 Le Framework Spring security
Springsecurity est un framework d'authentification puissante et hautement personnalisable
et d'un cadre de contrôle d'accès. Il est le standard pour la sécurisation des applications web.
Springsecurity est l'un des projets de spring les plus matures et largement utilisé. Fondée en
2003 et activement maintenue par SpringSource, il est aujourd'hui utilisé pour sécuriser de
nombreux environnements les plus exigeants, y compris les agences gouvernementales, les
applications militaires et les banques centrales. Il est distribué sous licence Apache 2.0.
 Le Framework Hibernate
Hibernate est un outil de mapping"objet/relationnel" pour le monde Java. Il s'occupe du
transfert des classes Java dans les tables de la base de données (et des types de données Java
dans les types de données SQL), il permet aussi de requêter les données et propose des
moyens de les récupérer. Il peut donc réduire de manière significative le temps de
développement qui aurait été autrement perdu dans une manipulation manuelle des données
via SQL et JDBC.
Pour le mapping nous avons utilisé les annotations d’Hibernate 4 dont nous avons généré la
base de données pour le SGBD MySQL. Cela en utilisant la ligne suivante dans le fichier
applicationContext :

<prop key="hibernate.hbm2ddl.auto">create</prop>

 Tomcat
De même pour le conteneur de servlets, nous avons choisi TOMCAT, vu sa performance, et
vu qu’il est le conteneur utilisé dans l’environnement du pole Skills créatif, ce choix a été fait
pour que l’application soit homogène avec son environnement, ce qui permet l’extensibilité
de ce projet.
TOMCAT est une implémentation open-source des Servlets Java et des technologies de
pages Java Server, développée dans le cadre du projet Jakarta à l'Apache Software Fondation.
TOMCAT met en œuvre une nouvelle structure servlet (appelée Catalina) qui est basée sur
une toute nouvelle architecture avec les spécifications Servlet et JSP.

58
Chapitre 3 : Etude technique du projet

 Maven
Apache Maven est un outil logiciel libre pour la gestion et l'automatisation de production
des projets logiciels Java en général et Java EE en particulier. L'objectif recherché est
comparable au système Make sous Unix : produire un logiciel à partir de ses sources, en
optimisant les tâches réalisées à cette fin et en garantissant le bon ordre de fabrication. Il
estsemblable à l'outil Ant, mais fournit des moyens de configuration plus simples, eux aussi
basés sur le format XML.
Maven utilise un paradigme connu sous le nom de Project Object Model (POM) afin de
décrire un projet logiciel, ses dépendances avec des modules externes et l'ordre à suivre pour
sa production.
 JasperReports
JasperReports est un outil de génération d'états/ rapports open source, offert sous forme
d'une bibliothèque qui peut être embarquée dans tous types d'applications Java.Il est
entièrement écrit en Java et il est capable d'utiliser les données provenant de tout type de
source de données et produire des documents de pixel-parfait qui peut être consulté, imprimés
ou exportés dans une variété de formats de documents HTML, PDF, Excel, OpenOffice et
Word.
 Semantic UI
Semantic UI est un framework pour le développement Front-End. Celui-ci se démarque par
son nombre de fonctionnalités gargantuesque. Le nombre d’éléments HTML conçus au sein
de Semantic UI est énorme, Le principe de Semantic UI est de donner des noms de classes à
ses éléments qui ont du sens. La logique derrière cela est d’écrire un code HTML facilement
lisible et compréhensible, même par une personne n’ayant jamais utilisé ce framework.
 Eclipse
Eclipse est un environnement de développement intégré libre extensible, universel et
polyvalent, permettant de créer des projets de développement mettant en œuvre n'importe quel
langage de programmation. Eclipse IDE est principalement écrit en Java (à l'aide de la
bibliothèque graphique SWT, d'IBM), et ce langage, grâce à des bibliothèques spécifiques, est
également utilisé pour écrire des extensions. La spécificité d'Eclipse IDE vient du fait de son
architecture totalement développée autour de la notion de plugin (en conformité avec la norme
OS Gi) : toutes les fonctionnalités de cet atelier logiciel sont développées en tant que plug-in.
 SGBD MySQL
MySQL est un système de gestion de base de données (SGDB). Selon le type d'application,
sa licence est libre ou propriétaire. Il fait partie des logiciels de gestion de base de données les
plus utilisés au monde, autant par le grand public (applications web principalement) que par
des professionnels, au même titre que Oracle ou Microsoft SQL Server.
 JUnit
JUnit est un framework de test unitaire pour le langage de programmation Java. Créé
par Kent Beck et Erich Gamma, JUnit est certainement le projet de la série
des xUnit connaissant le plus de succès.
JUnit définit deux types de fichiers de tests. Les TestCase sont des classes contenant un
certain nombre de méthodes de tests. Un TestCase sert généralement à tester le bon

59
Chapitre 3 : Etude technique du projet

fonctionnement d'une classe. Une TestSuite permet d'exécuter un certain nombre


de TestCase déjà définis.

VI. Autres langages utilisés


 JavaScript
JavaScript est un langage interprété par le navigateur. Le JavaScript est un langage « client
», c'est-à-dire exécuté chez l'utilisateur lorsque la page Web est chargée. Il a pour but de
dynamiser les sites Internet.
 jQuery
JQuery est une librairie JavaScript libre qui fait interagir JavaScript et HTML et dont
l'intérêt est de simplifier les commandes les plus utilisées. Sortie en 2006, elle est depuis
utilisée sur de nombreux sites comme Google, Mozilla, Amazon, etc.
 Ajax
L'architecture informatique Ajax (acronyme d'AsynchronousJavaScript and Xml) permet de
construire des applications Web et des sites web dynamiques interactifs sur le poste client en
se servant de différentes technologies ajoutées aux navigateurs web entre 1995 et 2005.
Ajax combine JavaScript, les CSS, JSON, XML, le DOM et le XMLHttpRequest afin
d'améliorer maniabilité et confort d'utilisation des applications internet riches :
DOM et JavaScript permettent de modifier l'information présentée dans le navigateur
en respectant sa structure ;
L'objet XMLHttpRequest sert au dialogue asynchrone avec le serveur Web ;
XML structure les informations transmises entre serveur Web et navigateur.
Outre le XML, les échanges de données entre client et serveur peuvent utiliser d'autres
formats, tels que JSON.

60
Chapitre 4 : Mise en œuvre

Chapitre 4:

Mise en œuvre
Ce chapitre trouve son essentiel dans
les différentes maquettes de
l'application et du site, il présentera les
différentes interfaces du projet.

61
Chapitre 4 : Mise en œuvre

I. Introduction
Après avoir affecté l’étude et la conception de notre application, nous passons à la phase
d'implémentation. Ce chapitre présente le résultat du travail effectué durant ce projet de fin
d'études, en présentant quelques captures d'écran démontrant les fonctionnalités de notre
application.

II. Présentation des exemples des interfaces


L’interface graphique est une partie très importante pour la réalisation d’une application
Web convenable et conviviale offrant un certain plaisir à l’utilisateur lors de sa navigation.
Ainsi ce critère peut faire la différence entre une application et une autre bien qu’elles aient
les mêmes fonctionnalités. Voici maintenant un ensemble de captures d’écrans sur les
principaux points d’entrées de l’application Back-office et Front-office:
II.1 Les interfaces du Back-office :
Page d’authentification :
L'utilisateur ne peut accéder aux différentes fonctionnalités de l’application que s'il
s'identifie avec le nom d'utilisateur et le mot de passe correspondant.
La figure ci-dessous représente l'IHM de l'authentification.

Figure 28: Interface d'authentification

Page d’accueil :
Après l'authentification, l'utilisateur est redirigé vers la page d'accueil, dans laquelle on
trouve les modules qu'on gère dans l'application (gestion des formations, gestion des
certifications, gestions des séminaires, gestion des formations e-learning, gestions des offres
de recrutement, gestions des utilisateurs). Dans ce qui suit, nous allons présenter les interfaces
graphiques des modules de gestion des formations et les différentes parties liées à ce module.

62
Chapitre 4 : Mise en œuvre

Figure 29: Interface page d'accueil

Gestion des formations :


La figure ci-dessous présente une interface pour gérer les formations. On peut ajouter,
modifier et supprimer ou rechercher une formation. Le menu à gauche montre les principaux
modules de l'application et chacun de ces modules contient un ensemble de fonctionnalités
sous forme des sous-menus relatives à ce module.

Figure 30: Interface de gestion des formations

Dans le sous menu de «Formations», on trouve les fonctionnalités liées aux formations
comme les sessions des formations :

63
Chapitre 4 : Mise en œuvre

Figure 31: Interface de gestion des sessions

Concernant la fonctionnalité "ajouter une session", on ajoute le nom de session et on l'affecte


à une formation et à un intervenant parmi une liste de ces deux derniers, puis on ajoute la date
de début et la date de fin de session, comme il est montré dans la figure ci-dessous:

Figure 32: Interface d'ajout d'une session

Par exemple dans le module de gestions des formations, on peut gérer ses sessions, ses
contenus, ses participants et aussi les intervenants.
La figure ci-dessous montre la gestion de contenu:

64
Chapitre 4 : Mise en œuvre

Figure 33: Interface de gestion du contenu d'une formation

Concernant les participants des formations, on distingue trois types, la gestion des participants
particuliers, les entreprises et les participants sur mesures.

Figure 34: Interface de gestion des participants des formations

La figure ci-dessous présente les intervenants des sessions des formations :

65
Chapitre 4 : Mise en œuvre

Figure 35: Interface de gestion des intervenants

Gestion des utilisateurs :


Dans cette application, on peut aussi gérer les utilisateurs et leurs droits, comme la figure ci-
dessous le montre :

Figure 36: Interface de gestion des droits d'utilisateurs

66
Chapitre 4 : Mise en œuvre

Gestion des offres :


On peut gérer les offres de recrutement qui seront afficher dans le site :

Figure 37: Interface gestion des offres

La figure ci dessous présente la liste des candidats qui ont postulés dans le site :

Figure 38: Interface gestion des candidats

67
Chapitre 4 : Mise en œuvre

Comme vous pouvez remarquer dans le sidebar de l’application, il y’a plusieurs modules et
leurs fonctionnalités principales qu’on peut gérer facilement, nous avons montrez juste la
gestion des formations et la gestion des offres de recrutement, les autres modules ont les
mêmes fonctions de gestion.
II.2 Les interfaces du Front-office :
Page d’accueil du site :
La page d’accueil du site regroupe les principales fonctionnalités du site, on peut accéder
facilement aux différents contenus et voir les informations nécessaire pour comprendre la
fonction de l’entreprise Skills campus, les actualités des formations sont présentées dans des
slides, ainsi que les actualités des formations e-learning, les certifications, et des actualités
générales :

68
Chapitre 4 : Mise en œuvre

Figure 39: Page d’accueil du site

69
Chapitre 4 : Mise en œuvre

II.2.1 Présentation des formations

Menu des formations :


Cette figure présente l'organisation des formations sous des catégories, des domaines et sous
domaines

Figure 40: L'interface menu des formations

Classement des formations :


Chaque sous domaine dans la figure précédente contient plusieurs formations qui sont
classées par thème, comme il est montré dans la figure ci-dessous concernant le sous domaine
« Gouvernance de la DSI »:

70
Chapitre 4 : Mise en œuvre

Figure 41: l'interface des formations inclus dans le sous domaine « Gouvernance de la DSI »

Contenu de formation :
Chaque formation dans la page précédente présente aussi une page, qui contient un ensemble
d'informations concernant la formation choisit, comme il est montré dans la figure ci-dessous
:

71
Chapitre 4 : Mise en œuvre

Figure 42: L'interface de contenu de formation

II .2.2 Génération du catalogue des formations

Page de protection de catalogue :


Le catalogue des formations est protégé par un mot de passe :

Figure 43: Page de protection du catalogue

72
Chapitre 4 : Mise en œuvre

Catalogue généré :
Si le mot de passe est valide, la page va être redirigée vers le catalogue généré
automatiquement depuis la base de données :

Figure 44: Catalogue de formation généré en format PDF

73
Chapitre 4 : Mise en œuvre

II.2.3 Module d'inscription

L'inscription est faite pour les formations, les certifications, les séminaires et les formations e-
learning, l'internaute choisit une solution d'inscription :

Figure 45: L'interface des solutions des formations

Si l'internaute a choisi l'inscription à une formation, il doit choisir aussi le mode d'inscription,
individuelle ou inter-entreprise ou une formation sur mesure, chaque mode a son propre
formulaire d'inscription :

Figure 46: L'interface du mode d'inscription

74
Chapitre 4 : Mise en œuvre

Le formulaire d'inscription pour les formations en mode individuelle :

Figure 47: L'interface du formulaire d'inscription individuelle

Apres la validation de l'inscription, l'interface ci-dessous s'affiche :

Figure 48: Interface inscription réussite

75
Chapitre 4 : Mise en œuvre

Avec la génération d'un email contient les informations d'inscription dans la boite de
responsable de formation, comme la figure ci dessous montre :

Figure 49: Email généré

Le formulaire pour l'inscription inter-entreprises :

Figure 50: l'interface du formulaire d'inscription entreprise

76
Chapitre 4 : Mise en œuvre

II.2.4 Consulter les sessions par ville

La figure ci-dessous présente les formations et la date des sessions de la ville Casablanca :

Figure 51: L'interface des sessions formations organisées par ville

II.2.5 Consulter les séminaires par ville et par thème :

Figure 52: L'interface des séminaires organisés par ville

77
Chapitre 4 : Mise en œuvre

Figure 53: L'interface des séminaires organisés par thème

II.2.6 Recrutement :

Le visiteur du site peut postuler aux offres publiées dans la rubrique « Recrutement » dans le
menu principal, ou bien faire une candidature spontanée :

78
Chapitre 4 : Mise en œuvre

Figure 54: Page de recrutement

Formulaire pour postuler aux offres :

Figure 55: Postuler aux offres

79
Chapitre 4 : Mise en œuvre

II.2.7 Page de contact :

Figure 56: Page de contact

Conclusion
Dans ce chapitre, nous avons traité les détails de la réalisation de notre application "Skills
Campus", qui est la phase qui nous a pris le plus de temps. En effet, il nous a fallu plus de
quatre mois pour pouvoir atteindre les objectifs fixés au début du travail. De plus nous avons
aussi montré des différentes interfaces de l’application en "front-office" et en "back-office".

80
Conclusion et perspectives
Tout au long de ce projet, nous avons été amenés à concevoir et implémenter une
plateforme de gestion des formations et des certifications pour le centre de formation Skills
Campus sous la technologie JEE. Conformément à ce que nous avons spécifie, nous sommes
parvenus à mettre en œuvre un site web sous le nom de “Skills Campus”.
La réalisation de ce projet m'a permis d’acquérir une expérience professionnelle et exploiter
nos acquis et connaissances techniques et théoriques.
Il m'a permis aussi de connaitre de près la programmation Web et d’approfondir mes
connaissances notamment en termes de conception et de réalisation dans ce domaine.
La conception de la plateforme a été élaborée en s’appuyant sur le formalisme UML ce qui
a permis de bénéficier de toute la puissance de cette méthode. Et, afin de garantir sa stabilité,
la solution mise en œuvre est basée sur la plateforme J2EE sous l’architecture MVC. En effet,
la technologie J2EE est un incontournable outil de développement dont il faut bien cerner les
diverses facettes.
Je suis pleinement satisfaite de ce projet qui a enrichi mes connaissances et m'a permis de
manipuler des concepts que je connais peu auparavant. J'ai pu acquérir au niveau technique
des connaissances indéniables sur les outils et les notions utilisés.
Enfin, les fonctionnalités offertes par cette plateforme sont immenses, notamment en
matière d’aide à l’administrateur, par exemple le site va être à jour avec la gestion des
actualités ou la gestion de différentes formations, et pour conclure, il existe toujours des
améliorations à envisager pour rendre une application encore plus performante.

D’autre part, une perspective de ce travail sera :

De continuer le développement de la plateforme e-learning.

De développer un quiz pour tester ceux qui veulent s'inscrire aux certifications sous
forme de QCM.

De développer une version mobile du site "Skills Campus"

81
Bibliographie

Webographie :
http://semantic-ui.com

https://www.jaspersoft.com/fr

www.hibernate.org

www.springsource.com

Ouvrages :
UML 2.0 Analyse et conception de Joseph Gabay et David Gabay.

Spring par la pratique de Julien Dubois.

Développez en Ajax de Michel Plasse.

Hibernate 3.0 d’Anthony Patricio.

82
Annexes
Annexe I : Structure du projet

83
Annexe II : Fichiers de configuration
 Maven "POM.xml" :

84
 fichier de configuration du Spring :

 Fichier de configuration spring Security :

85