Ce rapport de stage présente le projet 'annuaire pfe', qui consiste à concevoir une interface web pour la gestion des sujets de stages et de projets de fin d'études au sein de l'entreprise High Tech Management Systems. Le document détaille également les étapes de développement, incluant l'analyse des besoins, la modélisation conceptuelle et la réalisation technique de l'application. Enfin, il décrit les outils et langages de programmation utilisés pour sa mise en œuvre.

1. Université de Sfax
***
Institut supérieur d’informatique et
de multimédia de Sfax
Rapport du Stage d’Eté
Présenté à
L’Institut supérieur D’informatique et de Multimédia de Sfax
Effectué à
High Tech Management Systems (HMS)
Elaboré par
Abir Hadj Kacem
Licence Fondamentale
Parcours : Deuxième
Spécialité : Informatique et MultiMedia
AU : 2014/2015

2. Remerciements
Au terme de ce stage, il est de mon devoir de présenter
mes profondes gratitudes à tous ceux qui m’ont aidée,
encouragée et dirigée pour l'élaboration de ce travail.
Je veux aussi exprimer mes profondes gratitudes à Monsieur Krid
Mohamed, directeur High Tech Management Systems (HMS)
qui m’a acceptée et qui m’a aidée avec
ses conseils précieux et son suivi rigoureux.
Un grand Merci à l’Institut Supérieur
d’Informatique et Multimédia de Sfax.

3. Table des matières
I. Introduction Générale............................................................................................................... 1
II. Présentation de la société.......................................................................................................... 1
III. Chapitre 1 : Etude préalable .................................................................................................... 2
1. Introduction :............................................................................................................................. 2
2. Analyse des besoins :................................................................................................................. 2
3. Fonctionnement du site :........................................................................................................... 3
4. Objectifs de notre application :................................................................................................ 3
5. Conclusion :................................................................................................................................ 3
IV. Chapitre 2 : Modélisation Conceptuelle.................................................................................. 4
1. Introduction :..................................................................................................................................... 4
1.1 Choix de la méthodologie de conception et justification :.............................................. 4
2. Diagramme de cas d’utilisation :..................................................................................................... 5
2.1. Schéma : ............................................................................................................................. 5
2.2. Description textuelle des cas d’utilisation :..................................................................... 6
3. Diagramme de classes : ............................................................................................................. 6
4. Conclusion :........................................................................................................................................ 8
V. Chapitre 3 : La réalisation........................................................................................................ 8
1. Environnement de travail :....................................................................................................... 8
2. Choix des langages de développement :............................................................................... 8
2.1. Langages de développement :........................................................................................... 8
2.2. Le Serveur :........................................................................................................................ 9
2.3. Logiciel de Base de données : ................................................................................................. 10
2.4. Les Logiciels de conception : .................................................................................................. 10
2.5. Les Logiciels de développement :........................................................................................... 10
3. Description des interfaces de l’application : ................................................................................. 11
3.1. Interface Authentification : ................................................................................................. 11
3.2. Interface Inscription : ..................................................................................................... 11
3.3. Compte étudiant :............................................................................................................ 12
3.4. Compte administrateur : ................................................................................................ 15

4. 1
I. Introduction Générale
La croissance constante de développement informatique permet d’optimiser l’utilisation
des infrastructures existantes et d’assurer aux usagers une information efficace et fiable.
Dans ce cadre, s'inscrit notre projet de stage d'été, intitulé « annuaire PFE », dont
l'objectif est de concevoir une interface web permettant d’organiser et de structurer tous les
sujets de stage et de fin d’étude dans un seul emplacement, ce qui facilite l’opération de
recherche et assure le bon choix des futurs sujets.
Ce rapport est organisé en cinq chapitres :
 Le premier chapitre est consacré à la mise en relief du cadre de développement de
notre site.
 Le second chapitre se focalise sur la base théorique et les technologies utilisées pour
réaliser le travail requis.
 Dans le troisième chapitre, baptisé « Analyse et spécification des besoins », nous
identifions les besoins fonctionnels et non fonctionnels qui permettent de rependre ou objectifs
de notre site, en les modélisant à travers le diagramme des cas d'utilisation.
 Quant au cinquième chapitre, il porte une démonstration de la conception adoptée pour
répondre aux besoins précédemment cités.
 Enfin, nous finissons par faire une illustration des détails de la réalisation de notre
travail.
II. Présentation de la société
HMS est un fournisseur de solutions logicielles et de services informatiques qui accompagne
ses clients tout au long du cycle de vie d’un projet d’automatisation dans de nombreux secteurs.
HMS propose des solutions standards, des solutions sur mesure et des services de conseil à
forte valeur ajoutée pour aider les organisations à développer leurs stratégies e-business et à
capitaliser au maximum des outils technologiques.
Consciente que la spécialisation mène obligatoirement à l’excellence, HMS a opté pour une
organisation en pôle d’activité :
 Pôle de conseil en organisation et informatique de gestion, HMS Business Solutions
 Pôle pour le métier de formation on nouvelles technologies, HMS Academy.
 Pôle pour les solutions web et produits de mobilité, HMS Mobility.

5. 2
III. Chapitre 1 : Etude préalable
1. Introduction :
Dans ce chapitre, nous présentons l'étude préalable qui a précédé la mise en place de
notre site web. Cette partie consiste à dégager les fonctions que le site devrait fournir et ce
en mettant en évidence les besoins à l'origine de son développement.
2. Analyse des besoins :
Notre projet de stage a été réalisé entièrement au sein de l’entreprise HMS, qui a
décidé de nous engager afin de développer un nouveau système de gestion des sujets de PFE
qui n’existe pas dans le marché tunisien.
Afin d'approfondir notre compréhension du sujet et avoir une idée plus claire sur notre
projet et ses fonctions attendues, nous avons mené une étude pour dégager les objectifs à
atteindre.
Nous avons principalement quatre acteurs : admin université, admin du rectorat, étudiant
et entreprise.
 L’admin de l’université :
 Vérifier les informations des sujets déposés (titre, thème, résumé, nom
enseignant …).
 Décider de refuser ou accepter le sujet déposé.
 L’admin du rectorat :
 Consulter le sujet validé par L’admin de l’université pour faire une
deuxième vérification pour déterminer l’état du sujet.
 Décision finale à propos du sujet déposé (le refuser ou l’accepter).
 L’étudiant :
 Consulter la liste des sujets proposés par les enseignants et les entreprises
pour déterminer son choix final.
 L’entreprise :
 Proposer des offres de stages et de PFE.

6. 3
3. Fonctionnement du site :
D’abord, l’étudiant consulte les listes des sujets proposés par des enseignants et des
entreprises pour valider son choix (exemple : consulter liste de sujet, choisir un sujet, déposer
son sujet, consulter l’état de son sujet (validé ou refusé)).
Ces informations sont ensuite traitées et analysées pour les valider par le responsable
d’établissement qui a son tour, les envoie au responsable de rectorat pour les vérifier.
(Exemple : traitement et vérification de l’existence du sujet dans la base de données,
acceptation et refus du sujet, etc..).
4. Objectifs de notre application :
 Améliorer la gestion du site universitaire.
 Faciliter la communication entre l’utilisateur et le site
 La recherche de nouveaux sujets
 La recherche d’une société
 Mise à jour en temps réel des informations
5. Conclusion :
Dans ce chapitre, nous avons défini le champ d’étude de notre étude et la présentation
de projet. Nous avons aussi spécifié nos objectifs à atteindre suivis d’une étude de l’existant et
enfin nous avons identifié les solutions envisageables.
Avant de commencer la réalisation, nous présentons dans le deuxième chapitre la démarche de
développements et de conception de notre application.

7. 4
IV. Chapitre 2 : Modélisation Conceptuelle
1. Introduction :
Cette section, sera présentée comme suit : nous commençons par le choix de la
méthodologie de conception et justification. Ensuite nous identifions les acteurs et les
diagrammes des cas d’utilisation, puis nous présentons le diagramme de classe.
1.1Choix de la méthodologie de conception et justification :
Dans notre projet, nous avons utilisé le langage UML. Ci-dessous, nous présentons ce
langage puis nous justifions notre choix.
Le langage de modélisation unifié, de l’anglais Unified Modeling Language (UML), est un
langage de modélisation graphique à base de diagrammes conçu pour fournir une méthode
normalisée pour visualiser la conception d'un système. Il est couramment utilisé en
développement logiciel et en conception orienté objet.
En plus UML est essentiellement un support de communication, qui facilite la représentation et
la compréhension du sujet.
UML fournit un moyen astucieux permettant de représenter diverses projections d'une même
représentation grâce aux vues.
Une vue est constituée d'un ou plusieurs diagrammes. On a ici la vue :
 La vue statique, permettant de représenter le système physiquement :
 Diagrammes de cas d’utilisation : identifient les utilisateurs du système (acteurs)
et leurs interactions avec le système.
 Diagrammes de classes : représentent des collections d'éléments de modélisation
statiques (classes, paquetages...), qui montrent la structure d'un modèle.

8. 5
2. Diagramme de cas d’utilisation :
Un cas d’utilisation est une manière spécifique d’utiliser un système. C’est l’image
d’une fonctionnalité du système, déclenchée en réponse à la stimulation d’un acteur externe.
Les cas d’utilisation permettent de :
 Décrire le comportement du système sous forme d’action et de rédaction
du point de vue d’un utilisateur.
 Identifier les acteurs du système
 Définir les limites du système, les relations entre le système et
l’environnement.
2.1.Schéma :
Figure 1 : Diagramme de cas d’utilisation

9. 6
2.2.Description textuelle des cas d’utilisation :
Titre : proposer un sujet
But : connaitre si un sujet est disponible
Résumé : Après avoir choisi son sujet, l’étudiant peut consulter une liste des sujets proposés
par des entreprises et des enseignants et valider son choix. Dès qu’il le confirme et l’envoie, il
attend la rèpense des administrateurs qui vont gérer et vérifier l’existence du sujet dans la base
de données. La repense peut être acceptée si le sujet est libre, et refusée s’il a déjà été réservé.
Acteurs : Etudiant
Pré Condition : aucune
Enchaînement :
-l’étudiant s’identifie.
- consulter liste des sujets proposés par les entreprises / les enseignants.
- choisir un sujet et le déposer.
- consulter l’état de son sujet.
Exceptions : aucune
3. Diagramme de classes :
Le diagramme de classes est la représentation de la structure statique en termes de
classes et de relations. Ils représentent les classes constituant le système et les associations
entre elles. C’est le diagramme le plus important de la modélisation orientée objet.
Ce diagramme regroupe les classes du monde réel et les classes nécessaires à
l’implémentation du système et permet de générer la base de données et les classes utilisées
dans la programmation des applications.

10. 7
Figure 2 : Diagramme de classe

11. 8
4. Conclusion :
L’étape de conception est la phase la plus importante dans la résolution d’un problème
donnée. La réalisation de cette phase nous a permis de commencer l’implémentation sur la
base d’une architecture stable et delà passer à la phase de construction.
Durant le chapitre suivant, nous allons décrire l’implémentation de notre application et
nous allons décrire l’environnement logiciel et matériel du travail.
V. Chapitre 3 : La réalisation
1. Environnement de travail :
 Matériels
L’équipement utilisé pour ce projet est un ordinateur de développement ayant
les caractéristiques suivantes :
 Processeur Intel Inside CoreTM
i5
 Mémoire vive 6 Go
 Disque dur 500 Go
 Système exploitation Windows 10
2. Choix des langages de développement :
2.1. Langages de développement :
Les principaux outils qui ont contribué à la qualité du développement du site sont :
 JavaScript :
JavaScript est un langage de programmation de scripts principalement
employé dans les pages web interactives mais aussi pour les serveurs.
C’est un langage orienté objet à prototype.
 PHP5 :
PHP, plus connu sous son sigle PHP, est un via un serveur HTTP,
mais pouvant également fonctionner comme n'importe quel langage
interprété de façon locale. PHP est un langage orienté objet.

12. 9
 HTML 5 :
L’HyperText Markup Language, généralement abrégé HTML, est
le format de données conçu pour représenter les pages web. C’est un
langage permettant d’écrire de l’hypertexte, d’où son nom. HTML permet
également de structurer sémantiquement et de mettre en forme le contenu
des pages, d’inclure des ressources multimédias dont des images, des
formulaires de saisie, et des programmes informatiques. Il permet de créer
des documents interopérables avec des équipements très variés de manière conforme aux
exigences de l’accessibilité du web. Il est souvent utilisé conjointement avec des langages de
programmation (JavaScript) et des formats de présentation (feuilles de style en cascade).
HTML est initialement dérivé du Standard Generalized Markup Language (SGML).
 JQuery :
JQuery est une bibliothèque JavaScript libre qui porte sur
l'interaction entre JavaScript (comprenant Ajax) et HTML, et a pour but
de simplifier des commandes communes de JavaScript. La première
version date de janvier 2000
2.2. Le Serveur :
 MySQL :
mysql (My Structured Query Langage-Langage de requêtes structurées)
est un système de gestion de bases de données relationnelles dédiées Open
source. Il est très rapide, fiable et facile à utiliser et gratuit.il a été développé à
l’origine pour gérer des très grandes bases de données beaucoup plus rapidement
que des solutions déjà établies. Il offre un ensemble de fonctionnalités large et
riche. Sa rapidité et sa sécurisation en font un outil idéal pour les applications
internet.

13. 10
2.3. Logiciel de Base de données :
 Easyphp :
Il s'agit d'une plateforme de développement Web, permettant de faire
fonctionner localement (sans se connecter à un serveur externe) des
scripts PHP. EasyPHP n'est pas en soi un logiciel, mais un environnement
comprenant deux serveurs (un serveur web Apache et un serveur de bases de
données MySQL), un interpréteur de script (PHP), ainsi qu'une administration
SQL phpMyAdmin. Il dispose d'une interface d'administration permettant de gérer les alias
(dossiers virtuels disponibles sous Apache), et le démarrage/arrêt des serveurs.
2.4. Les Logiciels de conception :
 StarUML :
StarUML est un logiciel de modélisation UML, cédé comme open source par
son éditeur, à la fin de son exploitation commerciale, sous une licence modifiée
de GNU GPL. Puisqu’il ne requiert pas de connaissances particulières et fonctionne, de plus,
sur les systèmes d'exploitation les plus répandus.
2.5. Les Logiciels de développement :
 Dreamweaver :
Logiciel créé par Macromedia (et géré maintenant par Adobe)
permettant la conception de sites web. Dreamweaver fonctionne en
mode WYSIWYG ou en mode code et dispose d'un client FTP
permettant le transfert des pages créées sur le serveur hébergeant le
site web.
Le logiciel code les pages au format HTML (format constitué de balises qui s'insèrent dans le
texte des pages) en respectant les recommandations de l'organisme W3C qui gère les normes
de conception des sites web. Ce logiciel est très puissant d'utilisation et nécessite une bonne
formation pour pouvoir le maîtriser. La partie Editeur de code du logiciel permet la
modification rapide du contenu des pages, de leur mise en forme, de l'insertion d'images, de
liens ou d'autres éléments habillant la page Web. La partie Gestion du site permet d'organiser
tous les fichiers composant le site et de les publier sur le serveur distant pour qu'ils soient
accessibles via Internet.

14. 11
3. Description des interfaces de l’application :
3.1. Interface Authentification :
Description :
 L’utilisateur doit entrer son CIN et son mot de passe pour accéder à son compte.
 Il peut aussi aller à la page d’inscription s’il n’a pas un compte.
3.2. Interface Inscription :
Description :
 Après avoir choisi son compte, l’utilisateur doit remplir ses informations.

15. 12
3.3. Compte étudiant :
a) Page d’accueil :
Description :
 Cette page contienne principalement une recherche rapide et aussi une option pour
la recherche avancée
 Elle contienne aussi les services que l’étudiant peut les consulter :
 Proposer un sujet.
 Offres de stages.
 Offres de PFE.
 Etat des sujets proposés.
Description :
 La recherche avancée permet de trouver des résultats plus approfondies.

16. 13
Description :
 L’étudiant peut proposer un sujet en indiquant son titre, son thème, l’encadreur, etc…
b) Page de proposition d’un sujet :
c) Page d’offre de stages :
Description :
 Cette page contienne la liste des offres de stages proposés par les sociétés avec ses
informations détaillées.

17. 14
d) Page d’offres de PFE :
Description :
 Cette page contienne la liste des offres de PFE proposés par les sociétés avec ses
informations détaillées.

18. 15
Description :
 L’étudiant peut suivre l’état de son sujet déposé dès que l’administrateur le vérifie.
e) Page d’état des sujets proposés :
3.4. Compte administrateur :
 L’administrateur possède presque les mêmes pages.
a) Page de consultation des demandes de dépôt de sujets
Description :
 L’administrateur consulte les demandes de dépôt des sujets afin de les vérifier
et décider de les accepter ou de les refuser.

19. 16
Conclusion Générale
 « Annuaire PFE » vise à faciliter la tâche de choisir les sujets de PFE et de stage aux
étudiants, et aussi aux administrateurs : Ceci en numérisant les opérations visant à
vérifier aussi bien les sujets que la décision finale
 Plusieurs pistes d'améliorations peuvent être apportées à ce projet, notamment donner
la possibilité aux enseignants d'encadrer un sujet qui leur intéresse. En plus,
l’administrateur du site pourrait avoir la possibilité d'affecter des encadrants,
rapporteurs ou chefs de jury aux sujets non assignés, et de choisir également la salle et
l'heure de la présentation. En résultat, nous obtiendrons un agenda clair et partagé par
tous les participants (étudiants, administrateurs et enseignants) ce qui facilitera la
gestion et l'organisation des PFE et accompagnera ainsi le cycle de vie des sujets
 De plus, ce projet peut être implémenté au futur sous des plateformes mobiles pour
améliorer de plus l’interaction entre les étudiants, les enseignants et les entreprises.