Projet de Fin d’Etudes

Licence Sciences et Techniques Génie Informatique

Département Informatique

La mise en œuvre d’une application web pour la

gestion des stagiaires

Lieu de stage : Alten

Réalisé par : Encadré par :

 Ismail Khattabi Filali  Pr. Fatiha Mrabti
 Othmane Ouazzani Touhami  Mr. Chergui Zakaria

Soutenu le 04/07/2022 devant le jury composé de :

Pr. Ad. Ben Abbou (Président)
Pr. Y. Oubenaalla (Examinateur)
Pr. F Mrabti (Encadrant)

Année Universitaire 2021-2022

 Remerciements
Après Dieu, nous tenons à remercier toutes les personnes, qui par leurs conseils, leurs
suggestions ou par leur simple présence nous avons pu rendre notre travail aussi instructif
et efficace que plaisant. Nous tenons à remercier tout spécialement notre encadrante Ma-
dame Fatiha Mrabti pour son encadrement tout au long de ce projet, sa patience, sa dispo-
nibilité et ses conseils toujours avisés.

Nous tenons également à adresser nos plus sincères remerciements à nos encadrants au
sein d’ALTEN Mr Zakaria Chergui et Mme Kaoutar Hassouni pour avoir accordé leur temps
précieux, leur attention et leur énergie pour nous aider dans la réalisation de ce travail.

Enfin, nos remerciements vont à tous les enseignants de la Faculté des Sciences et Tech-
nique pour la qualité de la formation qu'ils nous ont fourni et tous les membres du jury
pour avoir accepté de juger ce modeste travail.

1
 Résumé

Puisque Alten a un besoin en stagiaires vu qu’elle a un certain nombre de projets, elle de-
mande le soutien des compétences tels techniciens, ingénieurs. Alten reçoit chaque an-
née des demandes de stage, après avoir passé l’entretien, un stagiaire choisi doit être af-
fecté à un sujet et un encadrant(collaborateur), chose qui nécessite un système automa-
tique, ce système qui va être géré par le service des ressources humaines et va permettre
une interaction entre administrateur, secrétaire, encadrant et stagiaire. Quelques tâches
du système :
 Création de comptes.
 Envoi de demandes.
 Espace de communication entre les quatre entités.
 Traçabilité.
 Génération automatique des documents.
Pour atteindre ces objectifs, l'implémentation a été réalisée avec le langage de program-
mation PHP nous avons utilisé UML comme langage de modélisation, et MySQL comme
système de gestion de base de données.

2
 Table des matières

Remerciements ...........................................................................................1
Résumé .......................................................................................................2
Liste des Acronymes ....................................................................................6
Introduction général....................................................................................7
CHAPITRE I : CONTEXTE GENERAL DU PROJET ..............................................8
I. Contexte du travail ....................................................................................... 9
1. Présentation du lieu de stage .......................................................................9
a. Le groupe Alten ....................................................................................................................... 9
b. Alten Delivery Center Maroc ................................................................................................... 9
2. Problématique ..........................................................................................9
II.Solution proposée ...................................................................................... 10
CHAPITRE II : ANALYSE ET CONCEPTION ....................................................11
I. Analyse des besoins.................................................................................... 12
1. Les besoins fonctionnels ...........................................................................12
a. Rôle de l’administrateur ........................................................................................................ 12
b. Rôle de la secrétaire .............................................................................................................. 12
c. Rôle de l’encadrant ............................................................................................................... 13
d. Rôle du stagiaire .................................................................................................................... 13
2. Besoins techniques ..................................................................................13
3. Conception et Modélisation ......................................................................14
CHAPITRE III : REALISATION .......................................................................31
I. Outils et technologies de développement ................................................... 32
1. Les outils................................................................................................32
2. Présentation de l’application ....................................................................34
Conclusion .................................................................................................49
Webographie ............................................................................................50

3
 Liste des figures
Figure 1 : Diagramme de cas d'utilisation « Administrateur» .......................................................... 15
Figure 2 : Diagramme de cas d'utilisation « Secrétaire» .................................................................. 16
Figure 3 : Diagramme de cas d'utilisation « Encadrant » ................................................................. 17
Figure 4 : Diagramme de cas d'utilisation « Stagiaire » ................................................................... 17
Figure 5 :Diagramme d'activité « S’authentifier » ........................................................................... 19
Figure 6 Diagramme d'activité « Ajouter stagiaire » ........................................................................ 21
Figure 7 : Diagramme d'activité « Retirer stagiaire » ....................................................................... 23
Figure 8 : Diagramme d'activité « Supprimer encadrant » ............................................................. 26
Figure 9 : Diagramme d'activité « Ajouter un utilisateur» ............................................................... 28
Figure 10 : Diagramme de classe...................................................................................................... 29
Figure 11 : Modèle logique de données ........................................................................................... 30
Figure 12 : Login ............................................................................................................................... 34
Figure 13 : Réinitialiser mot de passe .............................................................................................. 35
Figure 14 : Email pour récupérer mot de passe ............................................................................... 35
Figure 15 : Page d'accueil ................................................................................................................. 36
Figure 16 : Saisir stagiaire................................................................................................................. 36
Figure 17 : Consulter stagiaire.......................................................................................................... 37
Figure 18 : Afficher profil.................................................................................................................. 37
Figure 19 : Affectation stagiaire ....................................................................................................... 38
Figure 20 : Affectation en binôme.................................................................................................... 38
Figure 21 : Demande compte ........................................................................................................... 39
Figure 22 : Consulter compte ........................................................................................................... 39
Figure 23 : Ajouter encadrant .......................................................................................................... 40
Figure 24 : Supprimer encadrant ..................................................................................................... 40
Figure 25 : Supprimer encadrant affecté ......................................................................................... 41
Figure 26 :Consulter archive ............................................................................................................ 42
Figure 27 : Menu principal secrétaire .............................................................................................. 42
Figure 28 : Ajouter stage .................................................................................................................. 43
Figure 29 : Page d'accueil encadrant................................................................................................ 43
Figure 30 : Messagerie ..................................................................................................................... 44
Figure 31 : Changer le mot de passe ................................................................................................ 44
Figure 32 : Consulter stage ............................................................................................................... 45
Figure 33 : Consulter stagiaires ........................................................................................................ 45
Figure 34 : Consulter tâches ............................................................................................................ 46
Figure 35 : Remplir fiche d'appréciation .......................................................................................... 46
Figure 36 : Espace d'accueil stagiaire ............................................................................................... 47
Figure 37 : Consulter tâche pour stagiaire ...................................................................................... 47
Figure 38 : Envoyer demande Stagiaire............................................................................................ 48
Figure 39 : Consulter stage Stagiaire ................................................................................................ 48

4
 Liste des tables

Tableau 1 Fiche d’identité Alten Maroc ............................................................................................. 9

Tableau 2 Description textuel du cas d'utilisation « S’authentifier » .............................................. 18
Tableau 3 Description textuel du cas d'utilisation « Ajouter stagiaire ».......................................... 19
Tableau 4 Description textuel du cas d'utilisation « Retirer stagiaire »........................................... 21
Tableau 5 Description textuel du cas d'utilisation « Supprimer encadrant » .................................. 24
Tableau 6 Description textuel du cas d'utilisation « Ajouter un utilisateur»................................... 26

5
 Liste des Acronymes

AJAX Asynchrones JavaScript And XML

CSS Cascading Style Sheets

FST Faculté des Sciences et Techniques

GPL General Public License

HTML Hypertext Markup Language

JS JavaScript

JSON JavaScript Object Notation

MySQL My Structured Query Language

PHP PHP Hypertext Preprocessor

SMTP Simple Mail Transfer Protocol

SQL Structured Query Language

UML Unified Modeling Language

XAMPP X (cross) Apache MariaDB Perl PHP

XML Extensible Markup Language

6
 Introduction générale
Chaque année Alten propose des offres de stage qui émanent de ses départements pour
combler son besoin fréquent en matière de compétences, les demandes des candidats qui
postulent à ces stages sont traitées par le service RH , donc pour un responsable des res-
sources humaines il doit, une fois qu’il reçoit une demande de la part d’un responsable de
département qui exprime le besoin d’un stagiaire, d’en trouver un avec le profil demandé
et de lui affecter le sujet et l’encadrant et par la suite créer un espace d’interaction entre
ces différents intervenants. Notre travail consiste à réaliser cet espace d’interaction sous
forme d’une application où on trouve quatre acteurs ; un administrateur aidé par une se-
crétaire, un stagiaire et un encadrant.

L’administrateur et la secrétaire vont gérer les stagiaires (Ajout/Suppression/Modification),

gérer les stages, affecter le rôle d’encadrant à un employé, affecter un stage à un stagiaire
en précisant le département, le sujet, l’encadrant et la période de stage, créer et gérer les
comptes, traiter les demandes envoyées, enregistrer les absences et consulter l’archive.

Le stagiaire peut envoyer des demandes (de prolongation/d’attestation) à l’administrateur,

consulter les tâches ajoutées par son encadrant et aussi la liste des sujets disponibles du
même département avec l’option d’envoyer une demande d’affectation au sujet désiré, et
communiquer avec les autres entités dans une messagerie Inbox.

L’encadrant peut consulter les stages et stagiaires dont il est responsable, ajouter et sup-
primer des tâches au stagiaire, envoyer une demande de prolongation de la période de
stage d’un certain stagiaire, finaliser un stage après avoir générer la fiche d’appréciation.

Le présent rapport est organisé en trois chapitres :

 Le premier chapitre décrit le contexte du projet. Il présente en premier lieu l’orga-

nisme d’accueil, ensuite la problématique et la solution proposée.
 Le second chapitre présente l’analyse des besoins et la conception du système.
 Le dernier chapitre est consacré à la présentation des outils informatiques utilisés et
de l’application réalisée.
Enfin, nous terminons ce mémoire par une conclusion dans laquelle nous présentons le
travail réalisé..

7
 CHAPITRE I :
CONTEXTE GENERAL DU PROJET

8
I. Contexte du travail
Le stage a été réalisé au sein de Alten à Fès, pour la réalisation du PFE licence.

1. Présentation du lieu de stage

a. Le groupe Alten
La multinationale française ALTEN est un leader dans le consulting et l’ingénierie technolo-
gique fondée en 1988, et possède des bureaux dans 30 pays en Europe, Amérique, Afrique,
Moyen-Orient et l’Asie. ALTEN compte plus 37800 collaborateurs dont 87 % des ingénieurs
ainsi que 4100 clients, dont 70% liés à l’ingénierie et conseil en technologie, à savoir les RD,
étude et conception, Procès et manif. Engineering et Customer Support MCO (Ingénierie et
support client), en revanche 30% concerne les services IT et network comme les dévelop-
pement logiciel et applications IT et les réseaux infrastructure et Cloud Sécurité.

b. Alten Delivery Center Maroc

ALTEN Delivery center Maroc est une filiale d’ALTEN Groupe fondée en 2008, et compte trois sites
à savoir trois sièges sur casa et rabat et celui de Fès, le lieu de notre stage, installé au parc Fès shore.
ALTEN Maroc intervient auprès des grands acteurs des secteurs Automobile, Réseaux de Télécom-
munications et Software.

Le tableau suivant représente la fiche d’identité ALTEN Maroc :

Tableau 1 Fiche d’identité Alten Maroc

Adresse Fès Shore, B1, Plateaux 404-405 -Fès

Tél 05-35-62-24-30
Fax 05-35-62-24-29
RC 29809 (Tribunal de Fès)
ICE 000020344000023
Forme juridique Société à Responsabilité Limitée à Associé Unique
Capital 8 200 000 DHS

2. Problématique
Chaque année Alten reçoit plusieurs stagiaires au cours de l’année. Les stagiaires qui dési-
rent effectuer un stage dans la société doivent postuler et déposer leurs demandes, soit
par internet soit directement au sein de la société. Ce processus, très délicat avec un certain
nombre de problèmes qui se posent tels : affecter quel sujet à quel stagiaire, suivi du sta-
giaire, gérer l’assiduité, l’archivage …), a poussé le RH de Alten à formuler leurs besoins en

9
 une solution d’un système de gestion des stagiaires :

 Une fois le stagiaire est retenu, il est censé avoir un sujet de stage et un encadrant.
 Pendant sa période de stage, le stagiaire doit être suivi par son encadrant, et chaque
absence doit être enregistrée en précisant la période et la justification.
 Après avoir terminé son stage, le stagiaire doit être archivé, au cas où la société offre
un emploi, l’administrateur peut consulter la liste des stagiaires archivés afin de choisir le
profil demandé.
 Les documents (attestations de stages/fiches d’appréciation) doivent être générées
automatiquement.
 La nécessité d’une sorte d’interaction entre les quatre acteurs pour exprimer leurs
besoins et demandes.

II. Solution proposée

Afin de satisfaire les besoins formulés par la société, nous avons proposé une application
qui compte quatre acteurs ; l’administrateur soutenu par une secrétaire, le stagiaire et l’en-
cadrant, et qui va gérer automatiquement les stages offerts en assumant les fonctionnalités
suivantes :

 Affecter à un stagiaire un stage et un encadrant.

 Créer un espace pour permettre le suivi du stagiaire par son encadrant.
 Garder une traçabilité des stagiaires et des stages effectuées dans le système infor-
matique.

10
 CHAPITRE II :
ANALYSE ET CONCEPTION

11
I. Analyse des besoins
L’application proposée va nous permettre de gérer les stagiaires de la société et présente
les fonctionnalités suivantes :
 Affecter un stage et un encadrant au stagiaire.
 Permettre le suivi du stagiaire durant sa période de stage
 L’archivage et la généralisation automatique de l’attestation du stagiaire lorsqu’il ter-
mine son stage.
 Offrir un espace de communication et interaction entre tous les utilisateurs.
Pour mettre en place cette application, nous avons mené une étude afin de dégager les
besoins fonctionnels et non fonctionnels.

1. Les besoins fonctionnels

L’application va englober 4 acteurs : administrateur, secrétaire, encadrant et stagiaire.
Leurs rôles sont définis comme suit :

a. Rôle de l’administrateur
L'administrateur est le responsable d’acquisition des stages et la répartition des sujets au-
près des stagiaires, et il a les fonctionnalités suivantes :

 Gérer les comptes d’utilisateurs.

 Ajouter les stagiaires en remplissant un formulaire contenant leurs informations per-
sonnelles.
 Affecter à un stagiaire un stage et un encadrant en consultant la liste des stagiaires.
 Marquer les absences des stagiaires en précisant la durée d'absence et la justifica-
tion.
 Ajouter un stage en remplissant un formulaire qui contient les informations néces-
saires.
 Gérer les demandes reçues.
 Retirer un stagiaire.
 Ajouter/Supprimer un stage.
 Affecter le rôle d’encadrant à un employé.
 Envoyer un email d’avertissement aux stagiaires.
 Offrir un emploi à un stagiaire qui a fini son stage en consultant l’archive.
b. Rôle de la secrétaire
La secrétaire est l’assistante d’administrateur, elle hérite certaines fonctionnalités de l’ad-
ministrateur qui sont :

12
  Ajouter les stagiaires en remplissant un formulaire contenant leurs informations per-
sonnelles.
 Affecter à un stagiaire un stage et un encadrant en consultant la liste des stagiaires.
 Marquer les absences des stagiaires en précisant la durée d'absence et la justifica-
tion.
 Ajouter un stage en remplissant un formulaire qui contient les informations néces-
saires.
c. Rôle de l’encadrant
L’encadrant est le responsable du suivi du stagiaire et a les fonctionnalités suivantes :

 Marquer les stagiaires qui ont fini leurs stages.

 Consulter les stages et les stagiaires dont il est responsable.
 Donner des tâches aux stagiaires.
 Changer le mot de passe de son compte.
d. Rôle du stagiaire
Le stagiaire a les fonctionnalités suivantes :

 Envoyer des demandes à l’administrateur (prolongement du stage, attestation de

stage).
 Visualiser les tâches données par l’encadrant et les valider.
Remarque : Tous les acteurs qui utilisent l’application peuvent échanger des messages.

2. Besoins techniques
Tous les systèmes d'information à un certain point dans leur cycle de vie doivent considé-
rer des besoins non-fonctionnels et leurs tests, pour que notre application soit satisfai-
sante et fonctionne de façon cohérente sans erreur, nous avons pu déduire les besoins
fonctionnels suivantes :

 Hachage des mots de passes.

 Ouverture/Fermeture de sessions.
 Authentification.
 Vérification des champs/Contrôle de saisie.
 Réinitialisation de mot de passe.
 Token de réinitialisation du mot de passe expiré.
 Sécurité contre les injections SQL.
 Design responsive.
 Notifications (messages d’erreurs/confirmation).
 Envoi automatique des documents (Attestation de stages/fiche d’appréciation) à la
boite Gmail du stagiaire.

13
3. Conception et Modélisation
a. Diagramme de cas d’utilisation
Afin de donner une vision globale du comportement fonctionnel de notre application, nous
représentons ci-dessous les diagrammes des cas d’utilisations des quatre acteurs identifiés
auparavant. Nous allons détailler par la suite, les cas d’utilisations jugés les plus importants.

 Acteur 1 : Administrateur
L'administrateur est le responsable d’acquisition des stages et la répartition des sujets au-
près des stagiaires, il peut saisir le stagiaire et lui affecter un stage et un encadrant. Il peut
aussi ajouter un encadrant de la liste des employés de la société, et gérer les demandes en-
voyées par les autres acteurs (Figure 2).

 Acteur 2 : Secrétaire
La secrétaire est l’assistante de l’administrateur, elle hérite certaines fonctionnalités de l’ad-
ministrateur. Elle peut saisir les informations du stagiaire, consulter la liste des stagiaires et
la gestion des stages (ajout, consultation) (Figure 3).

Remarque : L’ajout du stagiaire et du stage par la secrétaire entraine l’envoi d’une demande
à l’administrateur concernant cette action, cette demande peut être acceptée ou refusée.

 Acteur 3 : Encadrant
L’encadrant est le responsable du suivi du stagiaire, il peut lui donner des tâches à faire, et
quand le stagiaire finit son stage il peut le maquer et remplir la fiche d’appréciation. Il peut
aussi consulter ses stages (Figure 4).

 Acteur 4: Stagiaire
Le stagiaire peut envoyer des demandes à l’administrateur (prolongement de stage, affecta-
tion à un certain stage, attestation), il peut aussi consulter les tâches données par l’enca-
drant et les marquer comme achevées (Figure 5).

14

Figure 1 : Diagramme de cas d'utilisation « Administrateur»

15
Figure 2 : Diagramme de cas d'utilisation « Secrétaire»

16
Figure 3 : Diagramme de cas d'utilisation « Encadrant »

Figure 4 : Diagramme de cas d'utilisation « Stagiaire »

17
b. La description textuelle et graphique des cas d’utilisation
 Cas d’utilisation « S’authentifier »
Tableau 2 Description textuel du cas d'utilisation « S’authentifier »

Nom du cas d’utilisation S’authentifier

En saisissant le login et le mot de passe l’utilisateur

Description
peut accéder à l’interface principale de l’application

Acteurs Administrateur, Secrétaire, Stagiaire, Encadrant.

Post condition Accéder aux services de l’application.

 L’acteur saisit le login et le mot de passe et valide.

Scénario normal  Le système vérifie le couple login/mot de passe.
 Le système affiche l’interface principale de l’application

 L’acteur saisit le login et le mot de passe et valide.

 Le système vérifie le couple login/mot de passe.
Scénario alternatif  Le système indique que le login et le mot de passe sont
invalides.
 Le système affiche un message d’erreur.

Le scénario est décrit par le diagramme d’activité suivant :

18
 Figure 5 :Diagramme d'activité « S’authentifier »

 Cas d’utilisation « Ajouter stagiaire »

Tableau 3 Description textuel du cas d'utilisation « Ajouter stagiaire »

Nom du cas d’utilisation Ajouter stagiaire

Ajouter un nouveau stagiaire dans la liste des sta-

Description
giaires de la société.

Acteurs Administrateur, Secrétaire.

Pré condition S’authentifier.

 L’acteur saisit les informations du stagiaire et

valide.
Scénario normal
 Le système vérifie que les champs sont bien
remplis.
 Une demande d’ajout du stagiaire est envoyée

19
 à l’administrateur.
 L’administrateur accepte la demande.
 Le stagiaire est enregistré dans la liste des sta-
giaires de la société, et l’administrateur reçoit une
demande de création de compte pour le nouveau
stagiaire.
 L’acteur saisi les informations du stagiaire et
valide.
Scénario alternatif 1  Le système trouve qu’il y a des champs qui ne
sont pas bien remplis
 Le système affiche un message d’erreur en in-
diquant les champs mal saisis.
 L’acteur saisit les informations du stagiaire et
valide.
 Le système vérifie que les champs sont bien
Scénario alternatif 2 remplis.
 Une demande d’ajout du stagiaire est envoyée
à l’administrateur.
 L’administrateur n’accepte pas la demande.

Le scénario est décrit par le diagramme d’activité suivant :

20
 Figure 6 Diagramme d'activité « Ajouter stagiaire »

 Cas d’utilisation « Retirer stagiaire »

Tableau 4 Description textuel du cas d'utilisation « Retirer stagiaire »

Nom du cas d’utilisation Retirer stagiaire

Retirer un stagiaire de la liste des stagiaires de la so-

Description
ciété.

Acteurs Administrateur.

Pré condition S’authentifier.

Post condition Consulter liste stagiaire/Consulter absence.

21
  L’administrateur choisit le stagiaire à retirer.
 Le système vérifie que le stagiaire n’est pas af-
fecté à un stage.
 L’administrateur saisit un commentaire et con-
Scénario normal firme la suppression.
 Le système supprime les données du stagiaire
et l’enregistre dans l’archive.
 Le système affiche que le stagiaire a été bien re-
tiré.
 L’administrateur choisit le stagiaire à retirer.
 Le système vérifie que le stagiaire est déjà af-
fecté à un stage, et demande de le remplacer.
 Le système affiche les informations du stage et
les noms des stagiaires du même département non
affecté pour le remplacer.
Scénario alternatif 1
 L’administrateur choisit un stagiaire et confirme
la suppression.
 Le système affecte le stage au stagiaire, sup-
prime l’ancien de la liste des stagiaires, et l’enre-
gistre dans l’archive.
 Le système affiche que le stagiaire a été bien re-
tiré.
 L’administrateur choisit le stagiaire à retirer.
 Le système vérifie que le stagiaire est déjà af-
fecté à un stage, et demande de le remplacer.
Scénario alternatif 2
 Le système trouve qu’il n’existe pas un stagiaire
du même département non affecté pour le rempla-
cer.
 Le système affiche un message d’erreur.

Le scénario est décrit par le diagramme d’activité suivant :

22
Figure 7 : Diagramme d'activité « Retirer stagiaire »

23
 Cas d’utilisation « Supprimer encadrant »
Tableau 5 Description textuel du cas d'utilisation « Supprimer encadrant »

Nom du cas d’utilisation Supprimer encadrant

Supprimer un encadrant de la liste des

Description
encadrants de la société.

Acteurs Administrateur.

Pré condition S’authentifier.

Post condition Consulter liste encadrant.

 L’administrateur choisit l’encadrant

à supprimer.
 Le système vérifie que l’encadrant
n’est pas affecté à un stage.
Scénario normal  L’administrateur confirme la sup-
pression.
 Le système supprime l’encadrant.
 Le système affiche que l’encadrant a
été bien supprimé.
 L’administrateur choisit l’encadrant
à supprimer.
 Le système vérifie que l’encadrant
est affecté à des stages et demande qu'il
soit remplacé par un autre encadrant
pour qu’il soit supprimé.
 Le système affiche les stages et les
encadrants du même département à
Scénario alternatif 1 choisir.
 L’administrateur choisit pour
chaque stage un encadrant et valide la
suppression.
 Le système vérifie que tous les
stages ont été affectés à un autre enca-
drant.
 Le système supprime l’encadrant et
affiche un message.

24
  L’administrateur choisit l’encadrant
à supprimer.
 Le système vérifie que l’encadrant
est affecté à des stages et demande qu'il
soit remplacé par un autre encadrant
pour qu’il soit supprimé.
 Le système affiche les stages et les
Scénario alternatif 2 encadrants du même département à
choisir.
 L’administrateur choisit pour
chaque stages un encadrant et valide la
suppression.
 Le système trouve qu’il y’a des
stages qui ne sont pas affectés.
 Le système affiche un message d’er-
reur.

25
 Figure 8 : Diagramme d'activité « Supprimer encadrant »

 Cas d’utilisation « Ajouter un utilisateur »

Tableau 6 Description textuel du cas d'utilisation « Ajouter un utilisateur»

Nom du cas d’utilisation Ajouter un utilisateur

Ajouter un utilisateur pour qu’il puisse accéder

Description
aux services de l’application.

26
 Acteurs Administrateur.

Pré condition S’authentifier.

Post condition Consulter la page de gestion des comptes.

 L’administrateur choisit le rôle de l’utili-

sateur.
 En fonction du rôle choisit le système
affiche les noms des personnes.
 L’administrateur choisit l’utilisateur et
Scénario normal lui donne un mot de passe.
 Le système vérifie que le mot de passe
est bien rempli.
 Le système ajoute l’utilisateur dans la
base de donnée et lui envoie un email con-
tenant son mot de passe.
 L’administrateur choisit le rôle de l’utili-
sateur.
 En fonction du rôle choisit le système
affiche les noms des personnes.
Scénario alternatif 1  L’administrateur choisit l’utilisateur et
lui donne un mot de passe.
 Le système trouve que le mot de passe
est mal saisi.
 Le système affiche un message d’er-
reur.

Le scénario est décrit par le diagramme d’activité suivant :

27
Figure 9 : Diagramme d'activité « Ajouter un utilisateur»

28
c. Le diagramme de classes
Le diagramme de classes exprime la structure statique du système en termes de classes et
des relations entre ces classes.

Figure 10 : Diagramme de classe

29
d. Le modèle logique de données

Figure 11 : Modèle logique de données

30
CHAPITRE III :
REALISATION

31
I. Outils et technologies de développement
1. Les outils
L'HyperText Markup Language, HTML, désigne un type de langage informatique descrip-
tif. Il s'agit plus précisément d'un format de données utilisé dans l'univers d'Internet pour
la mise en forme des pages Web. Il permet, entre autres, d'écrire de l'hypertexte, mais
aussi d'introduire des ressources multimédias dans un contenu. L'HTML est ce qui permet
à un créateur de sites Web de gérer la manière dont le contenu de ses pages Web va s'af-
ficher sur un écran, via le navigateur. Il repose sur un système de balises permettant de
titrer, sous-titrer, mettre en gras, etc., du texte et d'introduire des éléments interactifs
comme des images, des liens, des vidéos.[1]

JavaScript : créé à l'origine par Netscape, ce langage de programmation est conçu pour
traiter localement des événements provoqués par le lecteur (par exemple, lorsque le lec-
teur fait glisser la souris sur une zone de texte, ce dernier change de couleur). C'est un
langage interprété, c'est-à-dire que le texte contenant le programme est analysé au fur et
à mesure par l'interprète, partie intégrante du browser, qui va exécuter les instructions.
Ce langage a fait l'objet d'une normalisation. [2]

Css « Cascading Style Sheets » : ce qui se traduit en français par feuilles de styles en cas-
cade. La feuille de styles fournit la mise en forme des éléments de la page, qui auront été
écrits en HTML. Elle s’applique à une ou plusieurs pages du site. À la version courante CSS
2 vient s’ajouter la dernière norme CSS 3, qui reprend l’existant et ajoute de nouvelles
propriétés très intéressantes. Le terme << en cascade » indique que la mise en forme
d’une page peut faire appel à plusieurs feuilles de styles. Les différentes propriétés affec-
tées à un même élément s’ajoutent alors pour lui donner sa mise en forme finale. Il arrive
parfois qu’une propriété contredise une autre qui aura été définie auparavant : dans ce
cas, des règles de priorité s’appliquent et c’est généralement le dernier style défini qui est
pris en compte. [3]

PHP (officiellement, ce sigle est un acronyme récursif pour PHP Hypertext Preprocessor)
est un langage de scripts généraliste et Open Source, spécialement conçu pour le déve-
loppement d'applications web. Il peut être intégré facilement au HTML. [4]

Ajax est une méthode utilisant différentes technologies ajoutées aux navigateurs web
entre 1995 et 2005, et dont la particularité est de permettre d'effectuer des requêtes au
serveur web et, en conséquence, de modifier partiellement la page web affichée sur le

32
poste client sans avoir à afficher une nouvelle page complète. Cette architecture informa-
tique permet de construire des applications Web et des sites web dynamiques interactifs.
Ajax est l'acronyme JavaScript et XML asynchrones. [5]

SQL: langage de requête structurée, SQL est un langage informatique normalisé servant à
exploiter des bases de données relationnelles. La partie langage de manipulation des don-
nées de SQL permet de rechercher, d'ajouter, de modifier ou de supprimer des données
dans les bases de données relationnelles. [6]

UML: un langage de modélisation graphique et textuel, destiné à comprendre et décrire

des besoins, spécifier et documenter des systèmes, esquisser des architectures logicielles,
concevoir des solutions et communiquer des points de vue.
UML unifie à la fois les notations et les concepts orientés objet. Il ne s’agit pas d’une
simple notation, mais les concepts transmis par un diagramme ont une sémantique pré-
cise et sont porteurs de sens au même titre que les mots d’un langage. UML a une dimen-
sion symbolique et ouvre une nouvelle voie d’échange de visions systémiques précises. Ce
langage est certes issu du développement logiciel mais pourrait être appliqué à toute
science fondée sur la description d’un système. Dans l’immédiat, UML intéresse forte-
ment les spécialistes de l’ingénierie système. [7]

XAMPP est un ensemble de logiciels servant à mettre en place aisément un serveur Web,
un serveur FTP et un serveur de messagerie électronique. C'est une distribution de logi-
ciels libres (X Apache MySQL Perl PHP) offrant une bonne souplesse d'utilisation, recon-
nue pour son installation simple et rapide. Ainsi, il est à la portée de la plupart de per-
sonnes dans la mesure où il ne requiert pas de connaissances spécifiques et fonctionne,
qui plus est, sur les dispositifs d'exploitation les plus communs. [8]

PhpMyAdmin est un logiciel libre écrit en PHP qui a pour mission de s’occuper de l’admi-
nistration d’un serveur de base de données MySQL ou MariaDB. Il peut être utilisé pour
réaliser la plupart des tâches d’administration, ceci incluant la création de base de don-
nées, l’exécution de demandes, et l’ajout de comptes utilisateur. [9]

Enterprise Architect est un logiciel de modélisation et de conception UML, édité par la so-
ciété australienne Sparx System. Couvrant, par ses fonctionnalités, l'ensemble des étapes
du cycle de conception d'application, il est l'un des logiciels de conception et de modélisa-
tion les plus reconnus. [10]

MySQL, pour My Structured Query Language, désigne un serveur de base de données dis-
tribué sous licence libre GNU (General Public License). Il est, la plupart du temps, intégré

33
 dans la suite de logiciels LAMP qui comprend un système d'exploitation (Linux), un ser-
veur web (Apache) et un langage de script (PHP). Il supporte les langages informatiques
SQL et SQL/PSM. Le serveur MySQL peut se résumer à un lieu de stockage et d'enregistre-
ment des données, que celles-ci soient ou non cryptées. Il est alors ensuite possible, via
une requête SQL, d'aller récupérer des informations sur ce serveur très rapidement. [11]

2. Présentation de l’application
a. Authentification :
La page d’authentification s’affiche lorsque l’utilisateur démarre l’application. Celle-ci per-
met d’assurer la sécurité d’accès aux données et de distinguer les profils. A ce moment-là
l’utilisateur est censé d’entrer son login et son mot de passe afin de pouvoir utiliser les
fonctionnalités de l’application.
Si les informations sont invalides ou manquantes, le système affiche un message d’erreur
en rouge, sinon le système affiche la page d’accueil.
S’il y a une tentative d’accès à une page, directement via l’URL de cette page et sans au-
cune identification, le système fait la redirection automatique vers la page d’authentifica-
tion

Figure 12 : Login

Les utilisateurs de l’application peuvent réinitialiser leur mot de passe en cliquant sur mot
de passe oublié.

34
 Figure 13 : Réinitialiser mot de passe
L’utilisateur doit consulter sa boite email et poursuivre les consignes pour récupérer le mot de
passe.

Figure 14 : Email pour récupérer mot de passe

b. Espace de l’administrateur
 Page d’accueil
La page d’accueil est constituée des éléments suivants :

 Barre des raccourcis.

 Header.
 Le Menu principal,
 La barre des raccourcis est fixée pour toutes les pages, seule la zone de travail qui
change.

35
 Figure 15 : Page d'accueil

 Ajouter un stagiaire
Pour ajouter un stagiaire il faut saisir les informations personnelles de ce dernier. Et spéci-
fier la date de début et fin d’assurance. Si une information est manquante ou invalide
(format CIN ou numéro de téléphone ou email), le système affiche un petit message d’er-
reur en dessus des champs concernés.

Figure 16 : Saisir stagiaire

36
  Liste (table) des stagiaires
A partir de la colonne options dans la liste des stagiaires en cours on peut effectuer plu-
sieurs opérations comme la modification des informations, affecter un stage et un enca-
drant, enregistrer une absence ou retirer le stagiaire.

Figure 17 : Consulter stagiaire

 Afficher profil
En consultant le profil du stagiaire, l’administrateur peut consulter son CV, diplôme et l’assu-
rance.

Figure 18 : Afficher profil

37
  Affecter un stage et un encadrant au stagiaire

Figure 19 : Affectation stagiaire

Figure 20 : Affectation en binôme

 Gestion des comptes

Après avoir ajouté le stagiaire une demande d’ajout du compte est envoyée à l’adminis-
trateur.

Si l’administrateur crée un compte pour le stagiaire un email sera envoyé au stagiaire

contenant son login et le mot de passe.

38
 Figure 21 : Demande compte

L’administrateur peut visualiser tous les comptes, et il peut le supprimer, ou modifier les
informations (email, rôle, mot de passe).

Figure 22 : Consulter compte

 Gestion encadrant
 Ajouter encadrant

Pour ajouter un employé à la liste des encadrants de la société il suffit de choisir le dépar-
tement et le système affiche la liste des employés à choisir.

Après avoir choisi l’employé, ses informations personnelles seront affichées.

39
 Figure 23 : Ajouter encadrant

 Supprimer encadrant

En consultant la liste des encadrant l’administrateur peut supprimer un encadrant.

Figure 24 : Supprimer encadrant

40
Si l’encadrant est affecté, le système demande de réaffecter ses stages à un autre enca-
drant.

Figure 25 : Supprimer encadrant affecté

 Gestion archive
L’admin peut consulter les stagiaires qui ont terminés leur stage, leur envoyer une
demande d’embauche via un email et visualiser les informations de leurs stages pré-
cédents et leur profil.

41
 Figure 26 :Consulter archive

c. Espace de la secrétaire :
La secrétaire est l’assistance de l’administrateur, elle hérite certaines fonctionnalités
comme gestion stagiaire, stages et absence.

 Menu principal de la secrétaire

Figure 27 : Menu principal secrétaire

 Saisir un stage
Pour ajouter un stage la secrétaire saisit les informations nécessaires.

42
 Figure 28 : Ajouter stage

Remarque : L'ajout et la suppression des stagiaires ne peuvent pas être mis en œuvre sans
l'autorisation de l'administrateur, quand la secrétaire les ajoute/supprime, une demande
sera envoyée à l’administrateur.

d. Espace de l’encadrant:
La page d’accueil est constituée par les éléments suivants :

 Consulter stage.
 Changer mot de passe.
 Messagerie.
 Barre des raccourcis.

Figure 29 : Page d'accueil encadrant

43
  Messagerie
L’encadrant peut consulter, supprimer, envoyer et répondre à des messages aux autres
acteurs. (Admin, Secrétaire, Stagiaires, Encadrants).

Figure 30 : Messagerie

 Menu pour le changement de mot de passe:

L’encadrant a la possibilité de changer son mot de passe.

Figure 31 : Changer le mot de passe

 Menu des stages :

L’administrateur peut consulter les stages auxquels il est affecté.

44
 Figure 32 : Consulter stage

 Menu des stagiaires :

Une fois l’encadrant clique sur l’un de ses stages, il peut visualiser les stagiaires affectés à
ce stage avec leurs informations et 3 options, celle d’ajouter des tâches, finaliser le stage
et envoyer une demande de prolongation de stage pour qu’elle soit traitée par l’adminis-
trateur.

Figure 33 : Consulter stagiaires

 Tâches:
Quand l’encadrant clique sur le bouton tâches, une autre page s’ouvre qui contient les
anciennes tâches ajoutées, et la possibilité d’ajouter de nouvelles tâches ou les supprimer

45
 Figure 34 : Consulter tâches

Si l’encadrant choisit l’option finaliser stage, il doit remplir un formulaire pour générer la
fiche d’appréciation automatiquement, la fiche sera envoyée par email au stagiaire ulté-
rieurement.

Figure 35 : Remplir fiche d'appréciation

e. Espace du stagiaire :
La page d’accueil est constituée par les éléments suivants :

 Consulter les tâches.

46
  Messagerie.
 Sujet de stage
 Changer le mot de passe.
 Barre des raccourcis.

Figure 36 : Espace d'accueil stagiaire

 Menu tâches :
Le stagiaire peut consulter les tâches ajoutées par son encadrant et a la possibilité de les
cocher une fois terminée.

Figure 37 : Consulter tâche pour stagiaire

 Menu des demandes :

Dans ce menu le stagiaire peut créer des demandes et les envoyer à l’administrateur pour
qu’elles soient traitées, et il peut aussi consulter ses demandes en cours.

47
 Figure 38 : Envoyer demande Stagiaire

 Menu pour consulter les sujets de stages

Dans ce menu, le stagiaire peut envoyer des demandes à l’administrateur pour travailler
sur un de ces sujets de stages affichés.

Figure 39 : Consulter stage Stagiaire

48
 Conclusion

Notre projet a été réalisé dans le cadre du projet de fin d’études, avec pour objectif, d’implé-
menter une solution informatisée pour la gestion des Stagiaires. Ce travail a été réalisé auprès
de Alten.

Les RH, auprès d’Alten reçoivent des demandes de la part des départements formulant le be-
soin en stagiaires. Et comme il y a une liste de profils déjà entretenus, l’administrateur (des
RH) doit faire l’affectation du sujet de stage au stagiaire et de désigner un encadrant. De plus
il doit suivre le stagiaire le long de la période de stage, maintenir la communication entre le
stagiaire, l’encadrant et l’administration. Ce qui rend la tâche délicate.

Pour cela, et pour faciliter le travail de l’administrateur, nous avons réalisé une application qui
répond à ses besoins. Elle permet de :

 Fournir une interface d’interaction entre, l’administration, l’encadrant et le stagiaire.

 Générer automatiquement des attestations de stages,
 Tracer le parcours du stagiaire et son archivage
 Faciliter la gestion des encadrants de la société.
Pour la réalisation, de cette application, nous avons utilisé PHP/HTML comme langage de pro-
grammation/script et MySQL comme système de gestion de base de données. Pour la concep-
tion, nous avons eu recours à la modélisation UML.

Comme perspectives, on peut envisager d’améliorer davantage notre application par l’ajout
de nouvelles fonctionnalités comme :

 Permettre au stagiaire d’enregistrer sa présence

 Développer la messagerie en une autre instantanée
 Mettre en place un menu complémentaire pour gérer les demandes de stages reçues

49
 Webographie
[1] https://developer.mozilla.org/fr/ Date de dernière consultation : 17/06/2022

[2] https://developer.mozilla.org/fr/ Date de dernière consultation : 17/06/2022

[3] https://www.wikipedia.org/ Date de dernière consultation : 17/06/2022
[4] https://www.php.net/ Date de dernière consultation : 17/06/2022
[5] https://www.wikipedia.org/ Date de dernière consultation : 17/06/2022
[6] https://www.journaldunet.fr/ Date de dernière consultation : 17/06/2022
[7]: https://www.memoireonline.com/ Date de dernière consultation : 17/06/2022
[8] http://www.standard-du-web.com/ Date de dernière consultation : 17/06/2022
[9] https://docs.phpmyadmin.net/ Date de dernière consultation : 17/06/2022
[10] https://www.wikipedia.org/ Date de dernière consultation : 17/06/2022
[11] https://www.journaldunet.fr/ Date de dernière consultation : 17/06/2022
URL: https://www.w3schools.com/ Date de dernière consultation : 23/06/2022

URL: https://api.jquery.com/jquery.ajax/ Date de dernière consultation : 25/06/2022

URL: https://www.geeksforgeeks.org/ Date de dernière consultation : 25/06/2022

50