Majda Athmani - Ali Goumanneh Darar Soutenu Le 17 Juin 2016 Devant Le Jury: MR - Ahiod Belaïd Professeur À La FSR Encadrant
Majda Athmani - Ali Goumanneh Darar Soutenu Le 17 Juin 2016 Devant Le Jury: MR - Ahiod Belaïd Professeur À La FSR Encadrant
Majda Athmani - Ali Goumanneh Darar Soutenu Le 17 Juin 2016 Devant Le Jury: MR - Ahiod Belaïd Professeur À La FSR Encadrant
DÉPARTEMENT INFORMATIQUE
Filière Licence fondamentale
en Sciences Mathématiques et Informatique
i
RESUME
Ce travail s’inscrit dans le cadre de l’accomplissement de notre projet de fin
d’études à la faculté des sciences de rabat.
Le sujet de notre projet est une application web pour la gestion des compétitions
d’algorithmes d’optimisation combinatoire.
Pour réaliser ce travail, nous allons utiliser le langage PHP avec le Framework
Symfony2. Notre application permet à un utilisateur de participer à des com-
pétitions de son choix.
L’objectif de ce travail est de faire la gestion des participants, des responsables
et des compétitions. Tout cela se fait par l’Administrateur de notre application.
ii
ABSTRACT
This work is part of the fulfillment of our final project studies in the Faculty
of Science flap.
The subject of our project is a web application for managing competitions com-
binatorial optimization algorithms.
To make this work, we will use PHP with Symfony2 Framework. Our applica-
tion allows a user to participate in competitions of their choice.
The objective of this work is to make the management of participants, officials
and competitions. All this is done by the Administrator of our application
iii
Table des matières
Remerciement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . i
Resumé . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ii
Abstract . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . iii
Liste des figures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vi
Liste des tableaux . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vii
Introduction Générale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1
iv
3.4.2-Modèle logique de données (MRD) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
3.4.3-Règle de gestion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
Chapitre 4 : Réalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
4.1-introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
4.2-Environnement matériel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
4.3-Environnement logiciel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
4.4-Langages utilisés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
4.5-Principales interfaces graphiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .38
4.5.1-Authentification et Inscription . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
4.5.2-Espace <Utilisateur> . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
4.5.3-Espace <Responsable> . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
4.5.4-Espase <Administrateur> . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
4.6-Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
Conclusion Générale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
Webographie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
v
Liste des figures
1.1-Cycle resumant la structure du travail . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
3.1 Diagramme de cas d’utilisation générale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
3.2 Diagramme de cas d’utilisation d’un utilisateur . . . . . . . . . . . . . . . . . . . . . . . . . 12
3.3 Diagramme de cas d’utilisation du responsable . . . . . . . . . . . . . . . . . . . . . . . . . 14
3.4 Diagramme de cas d’utilisation de l’administrateur . . . . . . . . . . . . . . . . . . . . .16
3.5 Diagramme de classe générale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .19
3.6 Diagramme de séquence relatif à une compétition . . . . . . . . . . . . . . . . . . . . . . 22
3.7 Table Utilisateur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
3.8 Table Competition . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .24
3.9 Table Inscription . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
3.10 Table Algorithme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
3.11 Table Executable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
4.1 logo de Symfony2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
4.2 le model de fonctionnement du MVC . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
4.3 logo de doctrine . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
4.4 logo de TWIG . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
4.5 logo de WampServer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
4.6 logo de Modelio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
4.7 logo de Latex . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
4.5.1 Interface d’Authentification et Inscription . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
4.5.2 Interface Utilisateur 1 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
4.5.3 Interface Utilisateur 2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
4.5.4 Interface Responsable 1 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
4.5.5 Interface Responsable 2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
4.5.6 Interface Administrateur 1 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
4.5.7 Interface Administrateur 2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
vi
Liste des tableaux
2.1 Acteurs du système . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
vii
Introduction générale
Depuis quelques années, les innovations dans le domaine de développe-
ment web se multiplient et évoluent sans cesse. De ce fait les entreprises sont
amenées à avoir un site, qui les présente auprès de leurs clients ainsi qu’auprès
des autres personnes, montrant leurs fonctionnalité et éventuellement leurs nou-
velles offres.
Notre projet consiste à concevoir une application web pour la gestion des
compétitions d’algorithmes d’optimisation combinatoire. En premier temps un
utilisateur accède à l’interface de l’application via une authentification ou une
inscription, choisit une compétition parmi celles qui sont disponibles ou bien
reçoit un code de participation de la part du responsable de la compétition s’il
est déjà inscrit.
1
Chapitre 1 : Contexte du projet et cahier de charge
1.1 Introduction :
Afin de valider nos études acquises au fil de trois ans au sein de la faculté
des sciences de rabat et en vue de l’obtention de la licence fondamentale en Ma-
thématiques et Informatique nous sommes appelés à effectuer une Application
Web pour gérer les compétitions d’algorithme d’optimisation combinatoire.
Tout d’abord, nous commencerons par faire une présentation succincte du sujet
en détaillant son cadre et ses fonctionnalités. Ensuite, nous détaillerons le cahier
des charges proposé et le chronogramme suivi tout au long de la réalisation de
ce projet.
1.2 Contexte
2
1.3 Présentation du Sujet
Notre projet est une Application Web pour la gestion des compétitions
d’algorithmes qui permettent de résoudre des problèmes d’optimisation combi-
natoire pour la gestion en ligne.
Un problème d’optimisation consiste à trouver des ensembles discret une solu-
tion parmi un ensemble des solutions réalisables (Vérifiant les contraintes liées
au problème). Une solution peut être optimale (exacte) ou approchée (proche
de l’optimale). Les solutions se distinguent par leur coût (valeur objective).
Plusieurs équipes peuvent participer et plusieurs compétitions peuvent être or-
ganisées. Le système doit être capable d’enregistrer et récupérer les résultats de
la base de données et afficher des tableaux et des graphes de comparaison de
résultats obtenues.
1.4-Objectifs de l’application
1.4-Approches du travail
-Phase de Conception : Dans cette étape nous allons élaborer les di-
grammes de classe, de cas d’utilisation et de séquence pour affiner l’étude préa-
lable et le recueil des besoins pour résoudre nos problématiques et répondre à
nos besoins afin de réussir notre projet.
3
-Phase de Développement : Nous avons réservé cette partie pour
concevoir l’application dans tout son ensemble y compris les différentes tâches
à accomplir dans la partie développement ainsi que la programmation.
La figure 1.1 présente les étapes à suivre dans notre travail sous forme d’un cycle
4
1.1-Cycle résumant la structure du travail
1.7 Conclusion
5
Chapitre 2 : Spécification des besoins
2.1 Introduction
Tout d’abord, les acteurs sont des entités externes par rapport à un sys-
tème modélisé et qui interagissent avec ce système (operateur, centre distant,
autre système. . . etc). Identifier les acteurs intervenants et surtout ceux sur les
cas d’utilisation, peut en fait représenter une véritable problématique. Pour nous
aider à mieux les identifier voici quelques questions qui nous permettrons plus
facilement d’identifier les acteurs de notre système :
- Quels sont les utilisateurs qui ont besoin d’un système pour réaliser le
travail ?
- Quels sont les utilisateurs qui vont effectuer les fonctions principales du
système ?
- Quels sont les utilisateurs qui vont exécuter les fonctions principales du
système (maintenance et administration) ?
- Est-ce que le système interagit avec du matériel ou d’autres logiciels ?
6
Tableau 2.1 : Acteurs du système
Un utilisateur est une personne qui utilise un système informatique mais qui
n’est pas nécessairement informaticien (par opposition au programmeur).
Il existe au sein de ce même acteur des différentes sortes d’utilisateurs :
7
analyse du fonctionnement d’un système (rapport de bugs, évaluation
d’interface, etc.).
8
2. Envoie le code de validation pour les compétitions privées à des partici-
pants.
Conclusion
9
Chapitre 3 : Conception de l’application
3.1 Introduction
10
Figure 3.1 -Diagramme de cas d’utilisation générale
11
3.2.2-Diagramme de cas d’utilisation relatif à un utilisateur
12
La figure 3.2 représente le diagramme de cas d’utilisation d’un utilisateur com-
posé de trois cas d’utilisation qui sont : participer à une compétition, visiter le
site et s’authentifier .Ces cas seront détailler dans ce qui suit.
13
3.2.3-Diagramme de cas d’utilisation relatif à un Responsable
14
Cette dernière figure représente le diagramme de cas d’utilisation du respon-
sable composé de trois cas d’utilisation qui sont : envoyer le code de participa-
tion, accepter ou refuser la participation et supprimer ou ajouter des participants
à des compétitions .Ces cas seront détaillé dans ce qui suit.
15
3.2.4-Diagramme de cas d’utilisation relatif à un Administrateur
16
la figure 3.4 représente le diagramme de cas d’utilisation de l’administra-
teur composé minimum de quatre cas d’utilisation qui sont : gérer la sécurité
du site, mettre à jour une compétition, fermer une compétition et ajouter ou
supprimer des responsable. Ces cas seront détaillés dans ce qui suit.
17
5. Le cas d’utilisation : l’administrateur ferme une compétition parmi toutes
les compétitions (privées ou public).
18
La figure 3.5 décrit le diagramme de classe générale, conçu pour notre applica-
tion
19
Ce diagramme de classe contient sept classes :
20
3.3.2-Diagramme de séquence relatif à une compétition
21
figure 3.6 Diagramme de séquence relatif à une compétition
22
3.4- Description de la base de données :
Dans les bases de données, une table est un ensemble de données orga-
nisées sous forme d’un tableau où les colonnes correspondent à des catégories
d’information et les lignes à des enregistrements, également appelés entrées.
L’une des plus célèbres interfaces pour gérer une base de données sur un serveur
PHP est "phpmyadmin". Cette interface pratique permet d’exécuter, très faci-
lement et sans grandes connaissances en bases de données, des requêtes comme
les créations de table de données, insertions, mises à jour, suppressions et mo-
difications de structure de la base de données.
Dans notre projet nous avons besoin de spécifier cinq tables, la première
table est la table ‘Utilisateur’ qui va contenir toute les informations concer-
nant un utilisateur de l’application.
Cette table aura une colonne appelée ID qui est la clé primaire de la table. La
figure 3.7 décrit la table Utilisateur :
23
Figure 3.7 Table Utilisateur
-La deuxième table est la table ‘Compétition’ qui contient toutes les in-
formations concernant une compétition, et sa structure sur phpmyadmin est
présentee dans la figure 3.8 :
24
-La troisième table est la table ‘Inscription‘ dont la structure est décrite
par la figure 3.9 :
25
-La quatrième table est la table ‘algorithme’ décrit l’algorithme qui est
utilisé par le participant. Cette table est présentée dans la figure 3.10.
26
3.4.2-Le modèle Relationnel des données (MRD) :
Utilisateur(Id_Utilisateur,Nom,Prenom,Role,#Id_Inscription,#Id_algo)
Competition(Id_Competition,Nom,date_debut,date_fin,#Id_Responsable)
Inscription(Id_Inscription,date_dńscription,#Id_Competition)
Algorithme(Id_algo,Nom,codeAlgo)
Executable(Id_Execution,Score,Temps,#Id_algo,#Id_inscription)
3.4.3-Règles de gestion :
Parmi les règles de gestion définies au sein des contraintes d’intégrité qui
vont être représentées dans notre MRD, on distingue :
3.
4.
1.
5.
2.
1. la participation à des compétitions est ouverte à tout le monde.
2. l’utilisateur peut demander une ou plusieurs participations
3. une compétition peut contenir un ou plusieurs utilisateurs.
4. le responsable de chaque compétition peut envoyer à plusieurs utilisateurs
des codes de participation
5. Un utilisateur peut utiliser un seul algorithme pour la compétition choisie.
6. Un algorithme peut être utilisé par plusieurs utilisateurs.
7. un responsable peut s’occuper de plusieurs compétitions.
8. une compétion est gérée par un seul responsable
9. Un algorithme peut contenir plusieurs exécutions.
10. Une exécution est faite par un seul algorithme.
11. une exécution concerne une seule inscription.
12. une inscription peut concerner plusieurs exécutions.
27
3.5-Comportement dynamique de l’application :
Pour gérer les utilisateurs avec leurs droits d’accès, il faut tout d’abord
s’authentifier entant qu’Administrateur, accéder à la création d’un nouveau uti-
lisateur en remplissant le nom et le prénom, le login, le mot de passe, l’email, le
Téléphone et indiquer si l’utilisateur est un responsable ou non. Finalement on
peut soit le valider et quitter le formulaire ou de valider et de créer un nouvel
utilisateur.
3.6-Conclusion
28
Chapitre 4 : Réalisation
4.1 Introduction
Durant ce présent projet de fin d’études, tout le travail a été réalisé sur
deux ordinateurs portables qui ont les mêmes caractéristiques techniques sui-
vantes :
-SYMFONY2
29
code avec la communauté, elle a renommé symfony Framework [16] pour garder
les initiales SF. Avec le passage à la version 2.0, l’outil est simplement devenu
Symfony.
-MVC
30
Le modèle représente les véritables données avec toutes les informations qu’elles
véhiculent.
31
-Doctrine
Il s’est beaucoup fait connaitre grâce au Framework Symfony qui, au fil de ver-
sion, l’intègres au mieux en mieux aux dépens de Propél dans la mesure où
doctrine est un projet toujours maintenu.
32
-TWIG
-WampServer
33
Figure 4.5 logo de WampServer
-Modelio
Modelio est un outil de modélisation UML disponible sur les plates-formes Win-
dows, Linux et Mac. Il intègre également la modélisation BPMN, et le support
de la modélisation des exigences, du dictionnaire, des règles métier et des ob-
jectifs.
Modelio propose une gamme d’outils étendant ses fonctionnalités permettant,
entre autres, la mise en œuvre de l’approche MDA.
-Latex
34
La figure 4.7 montre le logo de Latex :
4.3.1 -PHP :
PHP : HyperText Preprocessor , plus connu sous son sigle PHP est un langage
de programmation libre, principalement utilisé pour produire des pages web dy-
namiques via un serveur HTTP, mais pouvant également fonctionner comme
n’importe quel langage interprété de façon locale. PHP est un langage oriente
objet. PHP a permis de créer un grand nombre de sites web célèbres, comme
Facebook, Wikipédia etc. Il est considéré comme la base de la création des sites
Internet dits dynamique Au lieu d’utiliser des tonnes de commandes a fin d’af-
ficher du HTML (comme en C ou en Perl), le code PHP est inclus entre une
balise de début < ? PHP et une balise de fin ?> qui permettant au serveur web
de passer en mode PHP. Ce qui distingue PHP des langages de script comme
JavaScript, est que le code est exécuté sur le serveur, générant ainsi le HTML,
qui sera ensuite envoyé au client. Le client ne reçoit que le résultat du script,
sans aucun moyen d’avoir accès au code qui a produit ce résultat.
35
Parmi les avantages de langage PHP :
1. Pas besoin de différencier les navigateurs du marché (le code fonctionne
sur tous dès qu’il fonctionne sur un)
2. Maîtrise du fonctionnement et du code
3. Le code source n’est pas visible
4. Nombreuses interactions avec le serveur (bases de données, fonctions avan-
cées d’images, de génération de PDF, d’exécution de scripts).
4.3.2 HTML :
L’HTML5 est le successeur de l’HTML 4.01 (et de l’XHTML 1.0), ça veut dire
qu’il s’agit toujours du HTML à la différence de quelques nouvelles balises. De
plus, la version 5 est aujourd’hui compatible avec la majorité des navigateurs et
répond aux normes W3C (C’est une communauté internationale où les membres
(une équipe à plein temps et le public) travaillent ensemble pour développer les
standards du web.)
36
4.3.3 CSS :
Avantages de CSS
37
au choix de l’utilisateur.
4.5.1-Authentification et Inscription
38
Dans l’espace utilisateur il y a deux interfaces :
1. La première "interface utilisateur 1" (voir figure 4.5.2 ) est la page d’accueil
de l’espace utilisateur
2. La deuxième "interface utilisateur 2" (voir figure 4.5.3) permet à l’utilisa-
teur de choisir une compétition parmi de la liste des compétitions dispo-
nibles
4.5.2-Espace <Utilisateur>
39
Liste des compétitions disponibles
40
4.5.3-Espace <Responsable>
41
Fonction du Responsable
42
4.5.4-Espace <Administrateur>
43
Fonctions de l’Administateur
4.6-Conclusion
44
Conclusion générale
L’objectif de notre projet consiste à concevoir et implémen-
ter une application web concernant la participation à des compéti-
tions sous le Framework Symfony2.
45
Webographie :
1. http ://fr.wikipedia.org (consulté le 17/5/2016)
7. http ://symfony.com/doc/master/book/controller.htmlmanaging-the-session
(consulté le 22/5/2016)
8. https ://openclassrooms.com/courses/developpez-votre-site-web-avec-le-framework-
symfony2 (consulté le 23/5/2016)
46
15. https ://www.ideematic.com/dictionnaire-web/application-web (consulté
le 28/5/2016)
47