Mémoire de
Présenté par :
EL HABTI Kaoutar
Encadré par :
2
Remerciement .
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
8
Liste des tableaux
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 :
12
Chapitre 1 : Contexte générale du projet
Chapitre 1:
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.
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
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.
16
Chapitre 1 : Contexte générale du projet
I.2.2 Conseil :
17
Chapitre 1 : Contexte générale du projet
Technologies Web
XML/ Web services / SOA
Cloud computing
Windows
Linux
Unix / MAC OS X
Virtualisation
18
Chapitre 1 : Contexte générale du projet
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.
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.
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 :
20
Chapitre 1 : Contexte générale du projet
Migration : Un site sous CMS est plus compliqué à migrer qu’un simple site
classique.
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
Back-office :
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.
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.
23
Chapitre 1 : Contexte générale du projet
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
L’étape de codage, qui produit ses composants et teste au fur et à mesure les unités de
code réalisés.
25
Chapitre 1 : Contexte générale du projet
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é.
26
Chapitre 1 : Contexte générale du projet
La figure ci-dessous présente le planning qui était notre fil conducteur pour réaliser le projet
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.
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.
30
Chapitre 2 : Conception du projet
Internaute : tout utilisateur du réseau internet qui a visité le site et qui peut :
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.
31
Chapitre 2 : Conception du projet
32
Chapitre 2 : Conception du projet
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
34
Chapitre 2 : Conception du projet
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
Diagramme d'activité :
36
Chapitre 2 : Conception du projet
37
Chapitre 2 : Conception du projet
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
Diagramme d’activité
39
Chapitre 2 : Conception du projet
40
Chapitre 2 : Conception du projet
41
Chapitre 2 : Conception du projet
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
43
Chapitre 2 : Conception du projet
Diagramme d’activité
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
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
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
47
Chapitre 2 : Conception du projet
48
Chapitre 2 : Conception du projet
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
52
Chapitre 3 : Etude technique du projet
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
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).
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
Avantages Inconvénients
56
Chapitre 3 : Etude technique du projet
Solution 3 : PHP
Avantages Inconvénients
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
<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
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.
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
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
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
Concernant les participants des formations, on distingue trois types, la gestion des participants
particuliers, les entreprises et les participants sur mesures.
65
Chapitre 4 : Mise en œuvre
66
Chapitre 4 : Mise en œuvre
La figure ci dessous présente la liste des candidats qui ont postulés dans le site :
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
69
Chapitre 4 : Mise en œuvre
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
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 :
73
Chapitre 4 : Mise en œuvre
L'inscription est faite pour les formations, les certifications, les séminaires et les formations e-
learning, l'internaute choisit une solution d'inscription :
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 :
74
Chapitre 4 : Mise en œuvre
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 :
76
Chapitre 4 : Mise en œuvre
La figure ci-dessous présente les formations et la date des sessions de la ville Casablanca :
77
Chapitre 4 : Mise en œuvre
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
79
Chapitre 4 : Mise en œuvre
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.
De développer un quiz pour tester ceux qui veulent s'inscrire aux certifications sous
forme de QCM.
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.
82
Annexes
Annexe I : Structure du projet
83
Annexe II : Fichiers de configuration
Maven "POM.xml" :
84
fichier de configuration du Spring :
85