PROJET DE FIN DE FORMATION

Dédicace

Je dédie mon rapport de stage à ma famille avec tous mes sentiments de respect, d’amour, de gratitude et de reconnaissance pour tous les sacrifices déployés pour m’élever dignement et assurer mon éducation dans les meilleurs conditions, mes professeurs et encadreurs sans exception, leurs efforts  afin de m’assurer une formation et un stage très solide les mots me manquent pour m’exprimer merci a vous. A tous mes amis ainsi que mon groupe d’étude en particulier Mon mentor Fofana Landry qui m’a beaucoup soutenue depuis la phase initiale jusqu’à la fin grand merci a toi, à tous les responsables de l’équipe pédagogique de notre Université qui ont travaillés afin de nous inculquer un apprentissage solide.

REMERCIEMENT

En préambule à ce stage, je remercie DIEU qui m’aide et me donne la patience et le courage durant ces langues années d’étude.

Aussi mes remerciements au corps professoral et administratif de l’université Virtuelle de Cote d’Ivoire qui déploient de grands efforts pour nous assurer une formation très actualisée.

Nous tenons aussi a exprimé notre sincère gratitude envers tous ce qui nous ont aidé ou ont participé au bon déroulement de ce projet.

Tout d’abord, nous tenons à remercier L’Université Virtuelle de Cote d’ivoire qui nous a bien accueillis. En effet nous avons eu le plaisir de travailler dans une entreprise de grandes valeurs. Nous nous devons remercier M. Bi Tra Jean Claude YOUAN pour sa générosité, sa compréhension et son aide inestimable. Nous sommes reconnaissant également à M. MAMADOU KONE notre encadreur durant le déroulement du projet pour son aide à la mise en place de ce modeste travail.

SOMMAIRE

Dédicace….......................................1

Remerciement……………………………………...............................................2

Sommaire   …..........................................3

Liste des figures …............................................5

Avant-propos…............................................6

Introduction générale…............................7

Chapitre I : Contexte de travail…......................................................8

  Cadre de stage….......................................................8

  I-Présentation de l’entreprise….................................8

I.1-a-Historique….......................................................8

  I.1.b-Evolution….......................................................8

  I.1.c- Les services d’affectation de l’UVCI………….9

  I.2-Etude de l’existant…………………................10

  I.3-Cahier de charge…......................10

  I.3.1-Spécialisations des besoins

I.3.1.a-Besoins fonctionnels…...... 11

I.3.1.b-Besoins non fonctionnels…...........12

Chapitre II : Conception…...............................................................................12

 II.1-Définition des différentes méthodologies .............13

             II.2- Merise……………..........................................................13

II.3- UML…………………......13

II.4- Choix de méthodologie…………….................................................13

II.4.1- Concept et architecture…………….................................................13

II.5- Conception détaillée….......................................................................14

II.5- Diagramme cas utilisation…........................................14

 II.5.1.1-Composition du diagramme de cas d’utilisation..............14

II.5.1.2-Acteur de notre plateforme …….........................15

II.5.1.3-Diagramme cas utilisation de notre plateforme…...................15

II.5.2-Diagramme de séquence......................16

II.5.2.1-Composition du diagramme de séquence…...............................17

  II.5.2.2-Les diagramme de séquence de notre plateform............17

     5.2.2.1-Diagramme de séquence (cas accède et consultation de menu)...............18

     5.2.2.2-Diagramme de séquence (cas d’authentification et d’inscription).........19

5.2.2.3-Diagramme de séquence (cas passer une commande)...........................19

5.2.2.4-Diagramme de séquence (cas suppression de menu)...........................19

   II.5.3-Diagramme de classe............................................21

Chapitre III : Réalisation.................................…........................................................22

I-Environnement de travail................................................................................22 

1-Environnement hard................................................................................22

2-Outil de développement................................................................................22

2.1-Astah Professional........................................22

2.2-Visual Studio Code........................................22

2.2-XAMPP........................................22

     II-Démonstrations des interfaces......…............................................................27

     III-Difficultés rencontrées et Enseignement tirés.......................................27

1) Difficultés rencontrés........................................27

2) Enseignements tirés........................................27

   Conclusion générale..............................................................................28

   Références bibliographiques et webographies.....................................…...............27

Listes des figures

Figure 1 : Diagramme cas utilisation d’un acteur et du Webmaster………………………...15

Figure 2 : Diagramme de séquence accède et consultation de menu…………………….….17

Figure 3 : Diagramme de séquence d’authentification et d’inscription……………….........17

Figure 4 : Diagramme de séquence passer une commande………………………………...18

Figure 5 : Diagramme de séquence de suppression de  menu……………………………...19

Figure 6 : Diagramme de classe…………………………………………………………..20

Figure 7 : interface de Visual Studio Code...……………………………………21

Figure 8 : Interface de  la base de données……………………………………20

Figure 9 : Page d’accueil………..……………………………………………….22

Figure 10 : Accueil (A propos)….................................................................22

Figure 11 : Page menu du jour…..……………………………………23

Figure 12 : Formulaire de connexion…..................................................23

Figure 13 : Formulaire d’inscription…...................................................23

Figure 14 : Page de profil…………………………………..……………24

Figure 15 : Page de modification de profil….............................................................24

Figure 16 : Page de panier…............................................................................24

Figure 17 : Page de validation…..........................................................................24

Figure 18 : Page d’ajout de menu…..........................................................................25

Figure 19 : Liste, modification et suppression des plats….....................................................25

Figure 20 : Page Liste des utilisateurs…..........................................................................25

AVANT-PROPOS

L’Université Virtuelle de Côte d'Ivoire (UVCI) est une université publique Ivoirienne d’enseignement à distance, située à Abidjan.

Créée par décret n° 2015-755 du 09 décembre 2015 et annoncée en septembre 2015, l’université virtuelle est dotée d’un budget de 20 milliards de francs CFA, incluant également l’équipement des étudiants en ordinateurs et celui des universités publiques en wifi. Pour le gouvernement, cette université virtuelle doit pallier le déficit de l’enseignement universitaire en Côte-d'Ivoire et la croissance importante du nombre d’étudiants. L’équipe enseignante est composée de douze (12) groupes de professeurs, sélectionnés après appel à projets et mettant en place des formations en ligne ouverte à tous (MOOCS).

L’Université Virtuelle a montré sa capacité à tisser des liens avec des organisations d'Union Européenne sur des sujets d'actualité et à prendre un leadership régional comme en témoigne la cérémonie qu'elle a organisée pour distribuer des ouvrages sur l’énergie solaire aux universités ivoiriennes. En partenariat avec des entreprises informatiques tels que : CISCO ; Microsoft ; Mediasoft Lafayette et Orange CI, elle offre des certifications professionnelles.

INTRODUCTION GENERALE

            La restauration se défini comme étant l’ensemble d’établissement où l’on sert à manger à une clientèle contrainte d’y recourir par des obligations professionnelles, universitaires, scolaires ou autre. En d’autre terme, c’est un lieu de commerce où l’on sert le repas en échange de la monnaie. En côte d’ivoire, le secteur éducatif est un facteur très important dans le programme de développement de notre cher beau pays. Chaque année, l’Etat ivoirien accueil environ des milliers d’étudiants et des élèves dans les différents établissements universitaires et scolaires ; Les restaurants et cantines rencontrent aussi d’énorme difficultés à cause du taux élevé des élèves et étudiants dans nos différents établissements. Donc l’on assiste à une insuffisance alimentaire au sien de nos restaurant et cantines. C’est cet état de fait qui nous a amené à orienter notre rapport de fin d’étude sur ‘MISE  EN  PLACE  D’UNE PLATEFORME  DE  RESTAURATIONS  POUR  ELEVES  ET  ETUDIANTS ’ainsi le problème qui se pose est :comment réaliser un système qui permettra de résoudre le problème de restauration au sien du système éducatif de la côte d’ivoire ?. Avec l’avènement des Technologies de l’information et de la communication (TIC) dans le secteur éducatif de notre très beau pays, après certaines recherches préliminaire et enfin, grâce à des informations que nous avons puis collecter auprès de notre population, nous allons élaborer notre plateforme, son architecture, les outils et technologie utiles. Pour ce faire, le travail se fera en trois(3) chapitres principaux. D’abord, nous verrons le contexte de travail. Il sera question de faire une présentation de l’entreprise, analyser les besoins et spécifications. Ensuite, nous allons concevoir le projet en nous basant sur un ensemble d’outils de conceptions. Et enfin, nous réaliserons le projet à travers son implémentation.

CHAPITRE I : CONTEXTE

Notre  stage  s’inscrit  dans  le  cadre  d’un  projet  de  stage  en  vue  d’obtenir  le diplôme  de  la  Licence de l’Université Virtuelle  de  Côte  d’ivoire(UVCI) en  Développement  d’Application  et  e-Services(DAS). Il  sera  question  pour nous  dans  cette  partie  de  faire  d’abord  une  présentation  générale  de  l’Université  Virtuelle  de  Côte  d’ivoire (UVCI) , ensuite  une  étude de l’existant, et  pour  finir  nous  procéderons  à  la  présentation   du  cahier  de charges.

I.1) Présentation générale

Notre présentation  générale  sera  constituée  des  différentes sections:

Ø  L’historique de l’université Virtuelle de Côte d’ivoire,

Ø  Son  évolution  et,

Ø  Son  activité.

I.1.a) Historique

Le 09 Décembre 2015 créée par le décret portant  le  N°2015-775, l’Etat de Côte d’ivoire procède à la création  de  l’Université Virtuelle de Côte d’ivoire qui  est  un  établissement  public  administratif(EPA). Sa création est issue de la deuxième phase de l’appui financier du deuxième contrat de Désendettement et de Développement(C2D) Education/Formation conclu entre la République française et la Côte d’ivoire grâce  la volonté  politique du Ministère de l’Enseignement Supérieur et de la Recherche Scientifiques. En effet, elle a été crée Afin de résoudre le problème de la massification (sureffectif) dans les amphis théâtre, au déficit en infrastructure, renforcer le système LMD, améliorer et apporter de nouvelle filière dans nos institues universitaire en vue de révéler le taux de l’employabilité en Côte d’ivoire. Après sa création, comment l’Université Virtuelle de Côte  d’ivoire a-t-elle évolue jusqu’à Aujourd’hui ? La réponse à cette question fera l’objet de notre section suivante.

I.1.b) Evolution

Le Ministère de l’Enseignement Supérieur et de la Recherche Scientifique avec le soutien de la (C2D) Education/Formation  qui vise à introduire le numérique dans le système éducatif de la Côte d’ivoire en particularité l’enseignement supérieur. L’université Virtuelle est le fruit de cette initiative car elle enseigne la filière de  Informatique et Sciences du Numérique(ISN).

Créée fin 2015, L’Université  de  Virtuelle  de  Côte d’ivoire prend  fonction  2016 avec la première promotion. Cette année,  elle est à sa troisième année de fonctionnement et elle compte environ  6500 étudiants qui sont formé à travers le numérique éducatif  avec les différentes spécialités comme : Base de Donnée(BD), Développement d’Application et e-Services(DAS), Réseaux et Sécurité Informatique(RSI), MultiMedia et Art du numérique(MMX), e-Commerce & Marketing Digital et Communication Digitale. Pour la rentré prochaine  elle  s’apprête  à lancé le Master et le Doctorat grâce a le numérique éducatif. Avec un tel progrès durant trois (3) seulement comment celle-ci est-elle organiser pour  réussir ces activités ?  La  réponse à cette inquiétude sera  notre section suivante.

I.1.c) Les activités de UVCI

L’Université Virtuelle de Côte d’ivoire est un établissement public et administratif. En effet, dans un but de développer et vulgariser l’enseignement à distance au sien de l’enseignement supérieur, l’UVCI  forme ces étudiants à travers  une plateforme grâce à  les technologies de l’information et de la communication (TIC) qui font partie intégrale du programme thématique de la recherche du Conseil Africain et Malgache pour l’Enseignement Supérieur(CAMES). Dans son programme au sien de l’ensseignement supérieur, elle se doit d’accompagner les autres Universités et Grande  Ecole publique qui dispensent les cours en présentiel  à travers des bibliothèques en Lignes afin de renforcer leurs qualités en ressources et recherches au sien de nos institues. Son siège social se situe à Abidjan et en sa tête l’on trouve le prof  Tiemonan  Koné. Nous pouvons joindre L’Université Virtuelle de Côte d’ivoire par courrier : courrier@uvci.edu.ci, par tel : 53666606/42222221 et aussi par  le site internet www.uvci.edu.ci .

Au terme de tout ce qui précède nous avons parlé de la présentation générale de l’Université virtuelle  de  Côte d’ivoire  c’est-a-dire son historique, son évolution et ces activités, nous allons ensuite parler de l’étude de l’existant dans la deuxième partie.

I.2/ Etude de l’existant

Une étude de l’existant consiste à analyser  de façon qualitative et quantitative le fonctionnement actuel d’un système. Notre étude consistera d’abord, à mettre en évidence le processus du fonctionnement actuel des restaurants et cantines au sien de nos institues. Et enfin les limites de ce processus afin d’apporter une amélioration.

Le système de restaurant et cantine au sien de nos institues universitaires et scolaires fonctionnent comme suit :

-          Au niveau du primaire et secondaire, chaque classe reçoit une liste manuscrite qu’il devra mettre son nom ainsi que sa classe afin d’avoir son ticket de plat et cela se répète chaque jours dans la semaine pour ceux qui son intéressé.

-          Au niveau des universités, chaque étudiant devra se rentre au guichet pour prendre son ticket avant d’aller faire son rang concernant le repas et ce phénomène se répète a chaque jours. Le repas s’avère souvent insuffisant a cause du taux élevé des étudiants désirant prendre  leurs déjeunés au sien du restaurant.

Après avoir vu  le fonctionnement des restaurants et cantines au sien de nos institues il est a retenti qu’ils rencontrent des difficultés dans ces   différents niveaux :

·         Celui-ci fonctionne de manière anarchique c’est-a-dire chaque jours passer un listing dans les classes pour recenser les élèves qui veulent manger a la cantine ou les étudiants qui doivent acheter leurs ticket, ensuite faire un rang pour aller prendre son déjeuner avant de revenir suivre son cours cas ou le repas s’avère insuffisant ces  difficiles.

Grâce a notre plateforme que nous allons mettre en place permettra a un élève ou étudiant qui désire prendre son déjeuner de le faire sans se taper le rang et de bien manger afin d’avoir un petit timing pour digéré grâce a son Smartphone.

I.3) Cahier de charge

En Côte d’ivoire, l’Etat  met l’accent sur le plan éducatif car  il est l’une des priorités dans tout les pays en voie de développement. Depuis 2012, nos institues scolaires et universitaires connaissent un sureffectif (massification) en son sien et nos restaurants, cantines en souffre aussi. Afin de palier a ce problème d’insuffisance alimentaire  au sien de nos institues nous avons décidé de mettre un système  afin de lutter contre ce déficit. Pour ce faire  nous allons analyser les spécifications  des besoins fonctionnels et non fonctionnels de notre plateforme de restaurants pour élèves et étudiants.

I.3.1) Spécifications des besoins

Dans cette phase nous allons déterminer  les acteurs  de notre plateforme, ensuite les fonctionnalités et enfin les besoins  non fonctionnels.

I.3.1.a/ les besoins fonctionnels

Notre plateforme de restaurant pour élèves et étudiants  doit satisfaire les exigences et les totalités de ces derniers. Pour ce faire nous allons présenter nos différents acteurs et les fonctionnalités attendues des nos élèves et étudiants dans ce qui suit :

Ø Les utilisateurs de notre plateforme

Les utilisateurs ciblés pour interagir avec  notre  application sont les élèves et étudiants ainsi que l’administrateur.

Ø Les fonctionnalités attendues

Notre plateforme de restaurants pour élèves et étudiants sera accessible à partir d’un navigateur web et nous aurons les différentes fonctionnalités comme :

-         Inscription  qui permet à l’élève ou l’étudiant de se faire enregistrer au sien de notre plateforme.

-          Connexion  permettra de se connecter sur notre plateforme à l’aide d’une adresse email et un mot de passe après l’inscription.

-          Passer une commande, annuler sa commande c’est-a-dire permettre  à  l’élève ou l’étudiant de faire son choix concernant ces préférences.

-          Voir son profil c’est-a-dire permettre a l’élève de voir son profil ainsi sa photo de profil.

-          Modifier son profil elle permettra a l’élève ou étudiant de n’est pas s’inscrire chaque année.

-          Point de repaire celui-ci permettra à l’élève ou étudiant de nous montrer l’endroit où il souhaitera êtres livré  après avoir  passé sa commande.

-          Menu de semaine voir les menus de chaque semaines

-          Un compte  cela permettra d’avoir de quoi faire leurs commandes

-          Déconnexion elle permettra aux différents acteurs de se déconnecter après avoir finir de visiter la plateforme.

Ø  Concernant l’administrateur de notre plateforme de restauration il aura le privilège de :

-          Ajouter, modifier  et supprimer  les menus

-          Voir la liste des élèves ou étudiants inscrits sur la plateforme.

-          Bloquer l’élève ou étudiant  s’il ne remplit pas les conditions

-          Recharger les différents comptes des acteurs.

Après avoir vu les fonctionnalités et les acteurs de notre plateforme, nous allons aborder les besoins non fonctionnels de notre plateforme dans la section suivante :

I.3.1.b/ les besoins non fonctionnels

Les besoins non fonctionnels concernent les mesures à prendre en considération afin de mettre en place une solution adéquate aux attentes c’est-a-dire au niveau de la conception de notre plateforme. Donc notre plateforme doit nécessairement assurer ces besoins qui  sont :

Ø  L’extensibilité

Notre plateforme doit  être extensible afin de pouvoir ajouter ou modifier de nouvelles fonctionnalités

Ø  La sécurité

La plateforme de restaurant pour élèves et étudiants doit être sécurité car les informations doivent pas être accessibles à tout le monde c’est-a-dire elle est possible à partir d’un login et mot de passe.

Ø  La responsivité 

La plateforme doit s’adapter a tout les écrans.

Ø  L’ergonomie

Le thème de notre plateforme doit vraiment être familiarisé avec nos différents acteurs.

Dans ce chapitre nous avons abordé la partie de la présentation générale de L’Université de Côte d’ivoire  en parlant de son historique, son évolution et ses activités. En plus nous avons étayez  l’étude de l’existant ainsi que la présentation  du cahier de charge.  Le chapitre suivant sera consacré à la conception.

CHAPITRE II : CONCEPTION

Dans le cycle de vie de notre projet de fin de formation, la conception  représente une phase très importante et déterminante pour produire une application de haute qualité. En d’autre terme, elle est la phase initiale de la création et de la mise en œuvre de notre application. C’est dans ce cadre que nous devons clarifier en premier lieu, la définition  des méthodologies de conception ensuite porter notre choix sur notre méthodologie et enfin présenter en détaille notre projet à travers les diagrammes.

II.1/Définition des différentes méthodologies

Dans la phase de conception d’un projet, il existe deux types de méthodologies qui sont :

Ø  MERISE

Ø  UML

II.2/Merise

Merise est une méthode de conception, développement et réalisation de projet informatique. Le but de cette méthode est d’arriver à concevoir un système d’information. La méthode Merise est basée sur la séparation des données et traitements à effectuer en plusieurs modèles conceptuels et physiques. En effet, l'agencement des données n'a pas à être souvent remanié, tandis que les traitements le sont plus fréquemment. Après la présentation de la méthode Merise nous allons faire un brefing sur la méthode UML.

II.3/ Uml

UML (Unified Modelling Language) se défini comme un langage graphique de modélisation  et de traitement de données. Il est spécialement conçu pour  représenter, concevoir, spécifier, documenter les artefacts des systèmes logiciel. Aussi c’est un langage qui permet de modéliser un problème de façon standard. Après avoir finir de présenter UML nous allons ensuite parler de notre choix d’outil dans la partie suivante.

II.4/ Choix de méthodologie

Pour faciliter notre tâche nous avons choisi le langage de modélisation unifié (UML : Unified Modelling Language) c’est une notation qui permet de modéliser un problème de façon standard. Ce langage est né de la fusion de plusieurs méthodes existantes auparavant, et il est devenu une référence en terme de modélisation objet, à un tel point que sa connaissance devienne indispensable pour un développeur. Aussi elle permet de «Visualiser »la compréhension du système en se basant sur les diagrammes qui sont au nombre de 9  regroupé en deux vues:

ü  Vue Statique (cinq diagrammes structurels)

·         Diagramme de Cas d’utilisation.

·         Diagramme de Classes.

·         Diagramme d’Objets.

·         Diagramme de Composants.

·         Diagramme de Déploiement.

ü  Vue Dynamique (quatre diagrammes comportementaux)

·         Diagramme de Séquence.

·         Diagramme d’activités.

·         Diagramme d’états transitions.

·         Diagramme de Collaboration.

Pour  notre projet  nous allons présenter quelques diagrammes que nous avons jugés bon pour la compréhension et le fonctionnement de notre plateforme.

II.4.1) concept et architecture

Notre projet de fin de formation est de Réaliser une plateforme de restauration pour les élèves et étudiants en ligne. Pour ce faire nous allons  nous baser sur le modèle MVC qui  est constitué de trois(3) parties. Evidement, les deux parties sont  parties connues sont  les vues V(Les interfaces IHM (Interface Homme Machine)  et le modèle M(le serveur de données) et une troisième Partie représenté comme contrôleur de trafic C, (le serveur d’application).  Cette architecture  a des avantages car elle reste la plus utilisé dans le monde du développement Web parce qu’elle regorge ces caractéristiques suivants :

Ø  L’allégement du poste de travail.

Ø  La prise en compte de l'hétérogénéité des plates-formes (serveurs, clients, langages, etc.).

Ø  L’introduction de clients dits " légers " (plus liée aux technologies Intranet/HTML qu'au 3-tiers proprement dit).

Ø  Une meilleure répartition de la charge entre les différents entités clients et serveurs.

Après la définition des différentes méthodologies et le choix de la méthodologie nous allons passer à la partie suivante.

II.5) Conception détaillé

Dans cette partie, nous allons présenter en détails la conception de notre plateforme à travers les diagrammes UML ( Unified Modelling Language) suivants :  Les diagrammes des cas d’utilisation, ensuite les diagrammes de séquence et enfin les diagrammes de classe.

II.5.1) Diagramme de cas d’utilisation

Définition

Les diagrammes de cas d’utilisation ont pour rôle de recueillir, analyser et organiser les besoins, ainsi que de recenser les grandes fonctionnalités du système. Il est la première étape de  UML dans le monde de la conception d’un système. Un diagramme de cas d’utilisation  capture le comportement d’un système, d’un sous-système, une classe ou d’un composant  tel qu’un utilisateur extérieur le voit. Donc il ne faut jamais négliger cette première étape  dans la réalisation d’un site Web conforme aux attentes des utilisateurs ciblés. Comment ce diagramme est-il composer ? La réponse à cette préoccupation sera l’objet de notre prochaine section.

II.5.1.1) composition du diagramme de cas d’utilisation

Le diagramme de cas d’utilisation est composé de trois éléments principaux qui sont :

ü  Acteur : C’est idéalisation d’un rôle joué par une personne externe, un processus ou une chose interagit directement avec notre système. Cet acteur est représenté par un petit  bonhomme avec son nom inscrit en dessous. Ensuite :

ü  Cas d’utilisation : C’est une entité cohérente représentant une fonctionnalité visible de  l’extérieur. Il présente un service de bout à bout, avec un déclenchement, déroulement et une fin pour l’acteur. Il est représente par une ellipse contenant un nom du cas (verbe à l’infinitif), et optionnellement au-dessus du nom, un stéréotype.

ü  Les Relation : Trois type de relations sont pris en charge par la norme UML et sont graphiquement représentées par des types particuliers de ces relations. Une relation  simple entre l’acteur et une utilisation est représenté par un trait simple.

Après la présentation de la composition de diagramme de cas d’utilisation nous allons voir les acteurs de notre plateforme dans la section suivante.

II.5.1.2) Les acteurs de notre plateforme

Les acteurs de notre plateforme sont les élèves et étudiants ainsi que   l’administrateur.

Les élèves et étudiants : C’est un acteur qui viendra en tant que visiteur et client car il aura un compte dès son inscription sur la plateforme en suivant en toute sécurité sa commande  sachant que notre site doit être unique responsable de la confidentialité des données personnelles de  nos différents acteurs.

L’administrateur : Pour les applications Web il est généralement  appelé « le Webmaster ». C’est celui la même qui est chargé de la dynamisation du site  et veille a sa mise à jours des menus, les prix, les disponibilités, la gestion des paiements et le programme de livraison.

II.5.1.3) Diagramme de cas d’utilisation de notre plateforme

Dans notre projet nous avons combinés les diagrammes de cas d’utilisation des élèves ou étudiants avec celui de l’administrateur du système. Pour ce faire nous avons procédé comme suit :

Figure 1 : Diagramme de cas d’utilisation (élève ou étudiant et administrateur)

L’élève ou étudiant : a  droit de consulter le menu du jour disponible a leurs portés mais pour passer sa commande sera obligé de s’inscrire et avoir un compte afin de passer sa commande en toute sécurité sur notre plateforme. Concernant :

 L’administrateur : La notion Webmaster de site  web désigne  communément celui est chargé du site web. Il gère toute la mise en place technique et parfois la mission éditoriale, il doit gérer au jour le jour la technique et mettre à jour le contenu du site web.

Dans cette section, nous avons parlé du diagramme de cas d’utilisation nous allons passer au diagramme de séquence dans la suite de cette partie.

II.5.2) Diagramme de séquence

Définition

Le diagramme de séquence est un diagramme d’interaction c’est-a-dire  qui montre en  détaille de la façon dont les opérations sont effectuées : quels sont les messages envoyés et quand ils le sont. Ce sont des diagrammes qui sont organisés en fonction du temps écoulé au fur et à mesure que nous parcourons les pages.  Après la définition, nous allons voir comment ceux-ci sont composés ?  La réponse à cette question fera l’objet de la section suivante.

II.5.2.1) Composition des diagrammes de séquences

Le diagramme de séquence est composé des éléments suivants :

Les lignes de vie : Une ligne de vue est une ligne verticale qui représente la séquence des événements, produite par un participant,  pendant l’interaction alors que le temps progresse en bas de cette ligne et ceux participant peut être une instance ou un composant ou un acteur.

Les messages : dans cette séquence, nous avons deux types de messages, le premier est dit message synchrone utilisé pour représenter des appels de fonction ordinaire dans un programme, et le deuxième est nommé asynchrone utilisé pour représenter la communication entre des threads distincts ou création d’un nouveau theard.

Les occurrences d’exécution : Représenter la période  d’exécution d’une opération.

Les commentaires : Un commentaire peut être joint à tout point sur une ligne de vie.

Les itérations : celui-ci représente un message de réponse  suite  à une question de vérification.

II.5.2.1) Les diagrammes  de séquence de notre plateforme

5.2.2/ Diagramme de consultation sur la plateforme

L’élève ou étudiant peut accéder a la plateforme de restaurant en ligne et ensuite consulter son menu du jour mais pour commander son plat préférer c’est-a-dire pour bénéficier des privilèges du site il devra s’authentifier.

Figure 2 : Diagramme de séquence (cas d’accède a la plateforme et consultation du menu)

5.2.3) Diagramme d’authentification et d’inscription

Pour bien profiter de notre plateforme de restaurant en ligne, l’élève ou étudiant doit s’authentifier, s’il n’est pas encore inscrire peux le faire aussi. Pour ce faire l’élève ou étudiant doit s’inscrire et s’authentifier, nos apprenants devront passer par l’ensemble de la séquence suivante :

Figure 3 : Diagramme de séquence (cas d’authentification et d’inscription)

-          L’élève ou étudiant veux se connecter la Base de données se lance pour la vérification de l’existence s’il n’existe pas il va devoir s’enregistrer grâce a un formulaire d’inscription.

-          ensuite il pourra essayer de se connecter a niveau étant donné qu’il  peut avoir d’autre éventualité c’est-a-dire se trompé sur son mot passe ou login donc il sera obligé de reprendre le cycle pour se connecter au final. Enfin nous allons voir le diagramme de commander pour ceux qu’il concerne l’élève ou l’étudiant.

5.2.4) Diagramme de séquence (cas de commande de plat)

Après avoir finir de s’authentifier, l’élève ou étudiant pourra enfin passer sa commande et être livré. Cette étape se matérialise comme suit :

Figure 4 : diagramme de séquence (cas de la commande)

Cette étape présente les étapes que doit étamer notre client en question pour effectuer sa commande. Nous avons aussi pris le cas où l’élève ou étudiant a un problème de compte où la somme qu’il détient n’est pas suffisante  pour effectuer sa commande il pourrait se faire recharger par l’administrateur afin d’effectuer celui-ci. Après avoir vu ces différents diagrammes qui concerne l’élève ou étudiant nous allons voir pour l’administrateur.

5.2.5) Diagramme de séquence (cas suppression d’un menu)

Parmi les scénarios dont l’administrateur  est chargé c’est-a-dire la gestion des menu exposé sur notre plateforme  telle que  bloquer un utilisateur, recharger les comptes des élèves et étudiants, ajouter, modifier et supprimer un menu que nous allons vous montrez dans le diagramme de séquence suivant :

Figure 5 : Diagramme de séquence (cas de suppression de menu)

L’administrateur s’authentifie sur la plateforme avant d’être redirige sur la page des menus. Ensuite le menu qu’il désire supprimer  s’affiche, il va le sélectionner,  un système d’avertissement déclenche pour lui demande s’il veut vraiment supprimer ce menu l’administrateur confirme la suppression l’opération de suppression se passe avec succès, et en fin le menu ne s’affiche plus la plateforme car elle est supprimer définitivement dans la base de donnée.

II.5.3) Diagramme de classe

Définition

Un diagramme de classe UML décrit la structure objet et d’information utilisé pour notre plateforme Web, à la fois interne et en communication avec ses utilisateurs. Il décrit les informations sans faire référence à une implémentation particulière. Ces classes et  relations peuvent êtres implémentées plusieurs manière, comme les tables dans une base de donnée. Après la définition nous allons voir sa composition dans la section suivante.

5.3.1) Composition de diagramme de classe

Le diagramme de classe peut contenir en général les éléments suivants :

Les classes : Elles représentent la description formelle d’un ensemble d’objets ayant une sémantique et des caractéristiques communes. Le diagramme est représenté en utilisant un rectangle  divisé en trois sections c’est-a-dire  le nom dans la section supérieur,  au centre les propriétés  et en bas les méthodes des classes.

Les associations : une association est une relation entre deux classes (association binaire) ou plus (association n-aire), qui décrit les connexions structurelles entre leurs instances.

Les attributs : les attributs représentent les données encapsulées dans les objets des classes. Chacune de ces informations est définie par un nom, un type de données, une visibilité et peut être initialisé.

5.3.2) Diagramme de classe de notre plateforme

Notre diagramme de classe se présent comme suit :

Figure 6 : Diagramme de classe de notre plateforme

Dans ce chapitre nous avons défini d’abord la méthodologie de la conception qui est Merise et UML. Ensuite faire notre choix au niveau de la méthodologie appliquer concernant notre projet et en fin nous avons présenté  les diagrammes de UML c’est-a-dire  diagramme de cas d’utilisation, séquence et de classe pour finir.  Le prochain chapitre sera dédié à la Réalisation. 

CHAPITRE  III : REALISATION

I/ Environnement  de travail

Au niveau de  la phase de réalisation, nous allons énumérer les outils soft et hard  que nous avons utilisés pour réaliser notre site ainsi que ses principales interfaces. Aussi les difficultés et les enseignements que nous avons rencontrés durant ce stage.

1)   Environnement  Hard

Nous avons développé notre application web avec  l’  outil suivant :

·         Hôte : HP

·         Processeur : système d’exploitation 64 bits, processeur x64

·         RAM : 4GO

2)   Outils de développement

Pour la réalisation  de  notre projet nous avons choisir les applications suivants :

Ø Astah Professional

Ø Visual Studio Code

Ø XAMPP

2.1/ Astah Professional

Astah Professional est un langage de conception c’est-a-dire  elle permet de modéliser une application  grâce a ces diagramme de classe. Elle est utilisée  par  une forte communauté de développeurs. Elle est simple et facilite a apprendre. Nous l’a vont utiliser pour construire nos diagrammes de classes lors de la phase de conception.

2.2/ Visual Studio Code

Visual Studio Code comme son nom l’indique est un langage de programmation dans les langages comme HTML, CSS et PHP. Il est aussi utiliser par plusieurs développeurs car il est simple  à utiliser. Après la présentation  de Visual Studio Code,  nous allons passer à la présentation de notre Server XAMPP.

Figure 7 : interface de Visual Studio Code

2.3/ XAMPP

Pour notre application Web nous avons eu besoin d’un Server qui permettra de stocker nos données et de construire une base de données cohérente et efficace. XAMPP est synonyme de multiplateforme (X), Apache (A), MySQL (M), PHP(P) et Perl (P). C'est une distribution Apache simple et légère qui permet aux développeurs de créer facilement un serveur web local à des fins. Aussi il faut noter qu’il est multiplateforme c’est-a-dire elle fonctionne sur tout les systèmes d’exploitation  comme  Windows, Mac, Linux aussi. Après la présentation des choix d’outils qui ont permis de  développer  notre application, nous allons passer  à la démonstration de nos interfaces.

Figure 8 : interface de Xampp (cas de la base de données)

II/Démonstrations des Interfaces

Cette partie dénombre la présentation des Scénarios applicatifs de notre application web. Nous allons présenter dans ce qui suit, la parties clients qui interagir  avec notre site web.

Figure 9 : Page d’accueil

Pour ma page d’accueil, s’affiche dès l’accès à notre application web, elle est composée  de  7 parties principales qui sont :

-Une  page qui parle de nous c’est-a-dire A propos de nous qui fait un brefing sur notre plateforme.

-Une partie qui affiche le menu du jour, aussi peux permettre a le visiteur de passer sa commande a condition d’être authentifier.

-Une partie  équipe qui sera chargé du menu de la semaine ;

-Une partie  connexion qui permettra à l’utilisateur de se connecter et voir son profil ainsi la modifier, passer aussi et valider sa commande ;

-Une partie panier en anglais carts qui permet au visiteur de voir combien de plats il a sélectionné ;

-une partie contact qui permettra aux visiteurs de  faire une suggestion ;

-Une partie profil qui permettre a le client de voir ces information le concernant ;

Figure 10 : partie A propos de nous

Dans cette partie vous allez trouvez  les informations concernant notre cantine en ligne ; Ensuite viens la partie de  menu, Dans cette partie le visiteur en question fera son choix en fonction du menu proposer ;

Figure 11 : Partie menu du jour

Dans cette partie le client verra les catégories du menu ainsi que les images  du plat suivi du prix ; il pourra faire sa commande à condition d’être authentifier.

Figure 12 : Partie connexion

Dans cette  partie le client doit entrer son email et son mot de passe ; S’il n’est pas encore inscrire les informations entrées ne seront pas correcte dans la partie s’authentifier et aussi la possibilité de s’enregistrer et de se connecter afin de voir son profil ;

Figure 13 : Page d’inscription

Dans la partie inscription l’utilisateur pourra s’inscrire en respectant  le principe de remplissage du formulaire afin de pouvoir  se connecter sur la plate-forme ;

Figure 14 : Page profil

Dans cette partie le client pourra voir les informations  après son inscription et ensuite après sa connexion reçu sur le site ; il aura le choix soit modifier les informations ;

Figure 15 : Page de modification profil

Pour valider sa commander, le client devra se connecter ensuite cliquer sur le carts en anglais voir les plats qu’il a sélectionné  afin de valider sa commande ;

Figure 16 : page de panier

Dans cette partie le client verra sa sélection mais aura le choix soit valider ou supprimer sa commande ; Dans le cas valider la commande, il aura le formulaire à remplir  afin d’être livrer.

Figure 17 : Page de validation de commande

Nous avons fini dans le processus de l’interaction entre client et la plate-forme ; nous allons ensuite entamer la partie admin de notre plateforme ;

Figure 18 : Page d’ajout

Dans cette partie l’administrateur du site pourra ajouter des plats au menu qui sera directement mise à jours sur le site ; ensuite il peut visiter les plats qui sont sur le site, les modifient  et même les supprimés ;

Figure 19 : Liste des plats et catégories

Dans cette partie l’administrateur du site liste les plats et les prix ainsi que les catégories envi de les modifient ou supprimer ;

Enfin l’administrateur peut aussi voir la liste des clients inscrit sur le site, il peut les bloquent aussi ;

Figure 20 : Liste des utilisateurs inscrits

III/Difficultés rencontrés et Enseignements tirés

1) Difficultés rencontrés

Dès le début de mon stage, j’ai rencontrés des difficultés concernant la vie professionnelle ; En effet n’ayant aucune expérience, j’ai commencé a paniqué et a douter de mes capacités parce que je ne connaissais pas du tout l’atmosphère qui se dégageait dans cet établissement ;  En fait le souci de timing m’aura pas permis une parfaite organisation suffisante afin de réaliser un travail digne de mon nom ; Mais toutefois il faut reconnaître que cet stage m’apporter beaucoup de satisfaction et aussi m’aura inculte un enseignement de la carrière professionnelle.

2) Enseignement tirés   

Mon stage au sein de l’Université Virtuelle de Côte d’ivoire m’a vraiment permis de développer et d’acquérir le savoir être afin de pouvoir brasé une carrière professionnelle dans le monde du travail ; Il m’a aussi inculqué la confiance en soi même, l’esprit d’équipe parce que une chose est de se faire confiance mais aussi écouter et appliquer les conseils des autres. Le travail qui m’était confié a été un vrai test pour moi car il m’aura permis de m’appliquer d’avantage sur ma spécialité et de suivre cette voie.

Au terme de la présentation de  la phase de réalisation nous avons retenir que un client peut s’inscrit, connecter, visiter son profil et même passer une commande aussi il y’a l’action de l’administrateur qui peux ajouter, supprimer, visiter  les plats et les utilisateurs inscrire sur notre  site web ; Le prochain chapitre sera dédié a la conclusion.

CONCLUSION  GENERALE

Notre application web s’inscrit dans le cadre  d’un stage  en vue d’obtenir le diplôme de la licence de l’université virtuelle de côte d’ivoire (UVCI) dans la spécialité Développement d’application et e-Services(DAS). Dans ce projet, nous somme appelés a concevoir et a réaliser  un restaurant pour les élèves et étudiants en ligne afin d’accompagnés nos différents restaurants et cantines au sien de nos institutions d’apprentissages.  Au cours de cette mission  nous étions amenés à résoudre le problème concernant la restauration des élèves et étudiants au sien de nos institues qui rencontrent d’énorme difficultés a cause du taux élevé de nos apprenants ; Après une enquête bien mené nous avons décidé de mettre en place une plateforme de restaurant en ligne pour les élèves et étudiants afin d’accompagnés nos cantines et restaurants dans leurs tâches. Et notre stage se termine après 2 mois ferme de travaille rigoureux, nous espérons que cela bénéfique pour nous et pour tous les consultant de ce rapport de stage.

Références Bibliographique et webographies

Affiche plateforme de mooc Disponible sur internet a l’adresse https://www.ludomag.com/2018/11/13/luniversite-virtuelle-de-cote-divoire-france-universite-numerique-et-lagence-universitaire-de-la-francophonie-sassocient-pour-deployer-une-plateforme-de-mooc-ivoir/