Vous êtes sur la page 1sur 57

REPUBLIQUE DU CAMEROUN REPUBLIC OF CAMEROON

Paix-Travail-Patrie Peace-Work-Fatherland
******* *******
MINISTERE DE L’ENSEIGNEMENT SUPERIEUR MINISTRY OF HIGHER EDUCATION
******* *******
Institut Universitaire des Sciences et
Techniques de Yaoundé Université de Ngaoundéré
******* *******
The University Institute of Science and The University of Ngaoundere
Technology of Yaounde *******
*******

RAPPORT DE STAGE

CONCEPTION D’UN SITE WEB E-COMMERCE MULTI


VENDOR

Rédigé et soutenu en vue de l’obtention de la


LICENCE PROFESSIONNELLE EN GENIE INFORMATIQUE

Option : Ingénierie des génies logiciel


Par :

Youa Emeran
Étudiant en troisième année

Encadreur Professionnel Encadreur Académique


M. Thierry Kamta M. LONGO CHIAGA PEDRO
Directeur de Transfo Africa Enseignant à l’IUSTY

JUILLET 2022
Conception d’un site web e-commerce multi vendor 2022

SOMMAIRE
INTRODUCTION GENERALE ............................................................................................ 11
1er Partie: RAPPORT D’INSERTION .............................................................................. 12
INTRODUCTION ............................................................................................................. 13
I. PRESENTATION DE L’ENTREPRISE ..................................................................... 13
II. PRESENTATION DU THEME DE STAGE ............................................................... 15
Conclusion ...................................................................................................................... 16
2e Partie: CAHIER DES CHARGES .................................................................................. 17
INTRODUCTION ............................................................................................................. 18
I. ETUDE DE L’EXISTANT .......................................................................................... 18
II. SCHEMATISATION DE LA NOUVELLE SOLUTION VALIDEE ................................ 21
III. DIAGRAMME DE REALISATION DU PROJET .................................................... 27
IV. COUT ESTIMATIF DU PROJET ........................................................................... 27
3e Partie: DOSSIER DE CONCEPTION............................................................................ 28
INTRODUCTION ............................................................................................................. 29
I. ETUDE DES SPECIFICATIONS FONCTIONNELLES ............................................. 29
II. CONCEPTION DETAILLEE ..................................................................................... 38
CONCLUSION ................................................................................................................ 39
4e Partie: DOSSIER DE REALISATION ............................................................................ 40
INTRODUCTION ............................................................................................................. 41
I. DESCRIPTION DE L’ENVIRONNEMENT TECHNIQUE .......................................... 41
II. DESCRIPTION DE L’ARCHITECTURE DE L’APPLICATION ................................... 45
III. CODAGE REALISE .............................................................................................. 48
CONCLUSION ................................................................................................................ 49
5e Partie: GUIDE D’UTILISATION..................................................................................... 50
INTRODUCTION ............................................................................................................. 51
I. FONCTIONNALITES DE L’APPLICATION ............................................................... 51
II. INSTALLATION D’APPLICATION ............................................................................ 51
CONCLUSION .................................................................................................................... 52
CONCLUSION GENERALE ................................................................................................ 53
BIBLIOGRAPHIE ................................................................................................................ 54
WEBOGRAPHIE ................................................................................................................. 54
TABLE DES MATIERES ..................................................................................................... 55

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


P a g e | ii
Conception d’un site web e-commerce multi vendor 2022

DEDICACE

A ma Famille

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


P a g e | iii
Conception d’un site web e-commerce multi vendor 2022

REMERCIEMENTS

Ce rapport n’aurait pas été réalisé tout d’abord sans le soutien et la participation
de certaines personnes qui ont été d’une grande inspiration pour nous. Nos plus
humbles reconnaissances à l’instar de :
 Docteur ZINGUI MESSOMO Xavier Directeur Fondateur de l’IUSTY ;
 Monsieur LONGO CHIAGA Pédro notre encadreur académique qui pendant
toute cette durée nous a assisté dans la réalisation de ce document et surtout
pour son écoute, sa disponibilité et son savoir-faire ;
 A tous les enseignants du département informatique à qui nous devons respect
et reconnaissance ;
 Monsieur KAMTA THIERRY fondateur de Transfo Africa et encadreur
professionnel qui, pendant cette période nous a assisté dans la réalisation de
ce projet par des commentaires, des suggestions et des qualités scientifiques
qui ont été très précieuses pour mener à bien ce travail ;
 Aux membres de ma familles qui me soutiennent depuis longtemps ;

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


P a g e | iv
Conception d’un site web e-commerce multi vendor 2022

RESUME

Durant la période s’étendant du 14 avril au 14 juin, notre stage a été effectué


au sein de Transfo Africa sur le thème : « conception d’un site e-commerce multi
vendor ». Quelque temps après notre arrivée à Transfo Africa, nous avons constaté
que Transfo Africa disposait déjà d’un site de vente, mais ce dernier ne répondait pas
aux attentes de la structure. Ainsi, il nous a été proposé de nous pencher sur la refonte
de cette plate-forme.
Durant notre séjour au sein de Transfo Africa, nous avons effectué les activités
liées principalement à la commercialisation, la maintenance, l’analyse et la conception
des applications web.

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


Pag e |v
Conception d’un site web e-commerce multi vendor 2022

ABSTRACT
During the period from April 14 to June 14, our internship was carried out within
Transfo Africa on the theme: "design of a multi-vendor e-commerce site". Sometime
after our arrival at Transfo Africa, we noticed that Transfo Africa already had a sales
site, but it did not meet the expectations of the structure. Thus, it was proposed to us
to look into the redesign of this platform.
During our stay at Transfo Africa, we carried out activities mainly related to the
marketing, maintenance, analysis and design of web applications.

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


P a g e | vi
Conception d’un site web e-commerce multi vendor 2022

LISTE DES ABRÉVIATIONS

UML: Unified Modelling Language


IDE: Integrated Development Environment
PHP: Hypertext Pre-processor
API: Application Programming Interface
SPA: Single Page Application
MPD : Modèle Physique de Données
MLD : Modèle Logique de Données
CPU: Central Processing Unit
RAM: Random Access Memory
LTS: Long-Term Support
BSD: Berkeley Software Distribution
ANSI: American National Standards Institute
MVC: Model View Controller
Ms Word: Microsoft Word
vCPU: Virtual Central Processing
SSD: Solid State Drive
SEO : Search Engine Optimisation

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


Page |
vii
Conception d’un site web e-commerce multi vendor 2022

LISTE DES FIGURES

Figure 1 Plan de localisation .................................................................................... 14


Figure 2 Organigramme transfo africa...................................................................... 14
Figure 3 cas d'utilisation Responsable du stock ....................................................... 23
Figure 4 cas d'utilisation du client............................................................................. 24
Figure 5 cas d'utilisation de la banque ..................................................................... 24
Figure 6 cas d'utilisation du marchand ..................................................................... 25
Figure 7 cas d'utilisation du responsable de vente ................................................... 25
Figure 8 cas d'utilisation de l'administrateur ............................................................. 26
Figure 9 cas d'utilisation des importateurs ............................................................... 26
Figure 10 diagramme de réalisation du projet .......................................................... 27
Tableau 11 liste des acteurs et leurs rôles ............................................................... 29
Figure 12 description cas d’utilisation : devenir marchand ....................................... 34
Figure 13 diagramme globale des cas d'utilisateur .................................................. 35
Figure 14 cas d'utilisation Authentification ............................................................... 36
Figure 15 diagramme de communication Authentification ........................................ 36
Figure 16 diagramme de classe ............................................................................... 37
Figure 17 MLD associé à la classe .......................................................................... 38
Figure 18 MPD ......................................................................................................... 39
Figure 19 architecture MVC de Symfony.................................................................. 45
Figure 20 page d'accueil .......................................................................................... 46
Figure 21 page de listing .......................................................................................... 46
Figure 22 page détail produit .................................................................................... 47
Figure 23 page panier .............................................................................................. 47
Figure 24 Authentificateur ........................................................................................ 48
Figure 25 code du userChecker ............................................................................... 48

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


Page |
viii
Conception d’un site web e-commerce multi vendor 2022

LISTE DES TABLEAUX

Tableau 1 identification des acteurs et cas d'utilisation ............................................ 23


Tableau 2 description cas d’utilisation : s'inscrire ..................................................... 30
Tableau 3 description cas d’utilisation : Authentification .......................................... 31
Tableau 4 description cas d'utilisation : Consulter liste produit ................................ 31
Tableau 5 description cas d'utilisation : Gérer favoris .............................................. 31
Tableau 6 description cas d’utilisation : Gérer panier ............................................... 32
Tableau 7 description cas d'utilisation : Gérer profile ............................................... 32
Tableau 8 description cas d’utilisation : Gérer commande ....................................... 33
Tableau 9 description cas d'utilisation : devenir marchand ...................................... 34

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


P a g e | ix
Conception d’un site web e-commerce multi vendor 2022

Rapport de stage Redigé et Soutenu à IUSTY par Youa Emeran


Page |x
Conception d’un site web e-commerce multi vendor 2022

INTRODUCTION GENERALE

Le commerce désigne l’activité économique d’achat et de revente de bien et de


service, en particulier l’achat dans le but de revendre avec un profit ou un bénéfice.
Ce dernier a ses lois propres qui sont recueillies dans les codes de commerce et ses
propres juridictions nationales ou internationales. Ce dernier qui auparavant
fonctionnait avec l’échange des biens ou de services, en remplacement d’un paiement
officiel (troc) a subi une évolution considérable frappée par : la valorisation des biens
et services grâce à l’avènement de la monnaie ; l’évolution des comportements
d’achat, avec la demande de gain de temps, la sensibilité aux prix, et est directement
liée à l’évolution des modes de vie avec l’individualisation, la taille des ménages, et
au contexte socioéconomique avec le pouvoir d’achat. Les autres facteurs d’évolution
sont la mondialisation et la technologie. Grace a l’évolution technologie, nous en
sommes aujourd’hui à l’aire du commerce électronique(e-commerce) qui désigne
l’achat et la vente de produits sur internet. Le e-commerce étant notre objectif
principal, le but de notre travail sera de proposer une solution permettant à Transfo
Africa de vendre ses biens et services sur internet et de permettre à d’autres
commerçants de s’affilier à Transfo Africa afin de bénéficier de cette solution. La
découverte de cette solution s’articule autour de cinq parties : La première partie
intitulée le rapport d’insertion chargée de la présentation générale de la structure
d’accueil et du thème de stage ; suivi de la seconde partie qui portera sur le cahier
de charge dans laquelle nous allons décrire les besoins fonctionnels et non
fonctionnel attendus de notre solution ; la troisième partie dénommée dossier de
conception nous permettra d’avoir plus de détails sur notre projet. Le dossier de
réalisation qui fera l’objet de la quatrième partie traitera principalement le descriptif
de l’environnement et de l’architecture de notre application ; En fin nous clôturerons
par le guide d’utilisation dans lequel nous allons décrire progressivement comment
utiliser notre solution.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 11
Conception d’un site web e-commerce multi vendor 2022

1er Partie: RAPPORT D’INSERTION

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 12
Conception d’un site web e-commerce multi vendor 2022

INTRODUCTION
Dans cette partie, il sera question pour nous de présenter TRANSFO AFRICA dans
une perspective générale en faisant ressortir tour à tour son historique, ses missions
et objectifs, ses activités, son organigramme et localisation, les objectifs du stage, la
réception et l’intégration puis les difficultés rencontrées durant notre séjour dans cet
établissement.

I. PRESENTATION DE L’ENTREPRISE
a. Historique, mission et objectifs
Transfo Africa est un Etablissement à but lucratif créé le 05 octobre 2021 par
M. Thierry Kamta, qui a commencé ses activités par une communauté d’informaticiens
(ingénieurs, enseignant-chercheur, techniciens) et de spécialistes des métiers
associés à l’informatique. Conscients qu’une bonne maitrise des technologies de
l’information et de la communication est un moyen efficace d’assurer un
développement durable.
Transfo Africa situé à la nouvelle route omnisport face à l’école publique
Mfandena se donne pour mission de vulgariser les technologies à travers des
solutions innovantes, utiles et accessibles à tous. Transfo Africa promouvoir
l’innovation technologique, la promotion des TIC et s’investit dans les domaines tels
que : la prestation des services informatiques, la sécurité des systèmes informatiques,
les réseaux de données, l’ingénierie logiciel, la cybersécurité, l’import-export et le
développement des solutions libres, simples, utiles et performantes. Il a pour principal
objectif de permettre aux jeunes diplômés de proposer des solutions innovantes aux
problèmes de la société, augmenter et diffuser les connaissances informatiques à
travers toute l’Afrique. Il compte actuellement une dizaine de membres et son
président M. Thierry Kamta, qui encourage les jeunes à la réalisation des projets et
aux formations à l’échelle internationale d’où leur slogan « Transformons l’Afrique en
partenariat avec l’occident ».

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 13
Conception d’un site web e-commerce multi vendor 2022

b. Plan de localisation

Figure 1 Plan de localisation

c. Organigramme

Figure 2 Organigramme transfo africa

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 14
Conception d’un site web e-commerce multi vendor 2022

d. Présentation du service d’accueil


Deux semaines après le dépôt de notre dossier de stage à Transfo Africa, nous
avons été appelés pour un entretien avec le directeur général. Au cours de cette
entretient, nous avons pris connaissance des règlements qui régissent au sein de
cette entreprise, ainsi que les biens et services qu’elle met à la disposition de ses
clients. Pour nous permettre d’intégrer facilement l’entreprise, il nous a été créé un
compte professionnel et une formation nous a été remise pour que l’on puisse
s’arrimer facilement aux méthodes de travail professionnel.

II. PRESENTATION DU THEME DE STAGE


a. Enoncé du thème
Quelque temps après notre arrivée à Transfo Africa, il eut un arrivage d’un
conteneur de 40 pieds contenant les marchandises de Transfo Africa (ordinateurs,
équipements de réseautique…) et les colis de diverses personnes. C’est ainsi que
l’entreprise se retrouva avec une quantité énorme de marchandises a écoulé dans le
plus bref délai pour libérer ses locaux. Pour se faire elle publie ses produits dans leur
site de vente mais ce dernier ne donna pas un retour positif. A cette même période,
un problème de la traçabilité des entrées et sorties des produits ainsi que des colis
surgis. Pour palier à ces problèmes, nous avons décidé de proposer la refonte
complète du site web de vente et d’y apporter quelques améliorations.

b. Enoncé des taches à faire


Pour mener à bien notre projet, nous allons suivre les méthodes de travail et
les bonnes pratiques des ingénieurs en génie logiciel qui sont entre autres :

Etape 1 : analyse fonctionnelle et définition des objectifs


o Bien comprendre le thème
o Bien comprendre les objectifs, les périmètres et les livrables du projet
o Etude de l’existant
o Définir les taches à réaliser
o Estimer la durée de chaque tache
o Ordonnancer les taches
o Attribuer les ressources à chaque tache
Etape 2 : conception détaillée
o Découpage et chiffrage
o Planification

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 15
Conception d’un site web e-commerce multi vendor 2022

o Constitution de l’équipe de travail


Etape 3 : développement de l’application
o Réalisation
o Codage ou programmation
Etape 4 : tests et intégration
o Test unitaire
o Test de régression
o Test de non régression
Etape 5 : recette
o Vente du logiciel
o Test de validation par l’utilisateur
o Document du projet
Etape 6 : mise en production
o Livraison du produit
o Mise en service
o Formation du personnel
Etape 7 : maintenance
o Correction d’erreur et bug
o Intégration de nouvelles fonctionnalités

Conclusion
Maintenant que nous avons pris connaissance de la structure dans laquelle
nous avons effectué notre stage, du projet qui nous a été confié et des taches dont la
réalisation nous incombe, il sera question pour nous au prochain chapitre de clarifier
les objectifs et les besoins fonctionnels du système que nous souhaitons mettre sur
pied.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 16
Conception d’un site web e-commerce multi vendor 2022

2e Partie: CAHIER DES CHARGES

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 17
Conception d’un site web e-commerce multi vendor 2022

INTRODUCTION
Dans cette partie du document qui tient lieu de cahier de charge, nous ferons
ressortir tour à tour les informations relatives à notre projet afin de formaliser les
besoins, les objectifs, les contraintes et les fonctionnalités attendues de notre
système.

I. ETUDE DE L’EXISTANT
a. Recueil de l’existant
Transfo Africa dispose déjà d’un site de vente en ligne disponible à l’adresse
www.shop.transfoafricainc.com. Cette plateforme est actuellement hébergée sur un
serveur mutualisé chez infomaniak. Actuellement les opérations possibles à réaliser
sur cette plate-forme sont les suivantes :
 Client :
Pour un client, il est actuellement possible de créer son compte, s’y connecter,
éditer les informations de son compte changer son mot de passe. Il peut aussi choisir
un produit dans le catalogue disponible sur la plateforme et l’ajouter au panier pour
pouvoir passe sa commande.
 Administrateur :
Il dispose d’une vue unique lui permettant de gérer le contenu du site tels que : la
gestion des utilisateurs, la gestion des produits, la gestion des commandes et des
bannières.

b. Analyse et critique de l’existant


Le Site de vente de Transfo Africa présente de nombreuses défaillances qui sont
de nature diverse. Ergonomiquement, le site ne dispose pas d’un visuel attirant pour
le visiteur et par conséquent ne peut rivaliser avec d’autres concurrents, tels que aliba,
amazone et d’autres géants du domaine. Du point de vue sécuritaire, l’on a pu relever
des informations sensibles de l’utilisateur connecter stocker au niveau du navigateur
tels que : le mot de passe crypter ; le jeton d’accès pour l’authentification pouvant
servir à des fins de piratage ; l’utilisateur qui reste toujours connecté après expiration
du jeton d’accès ; d’autres informations personnelles sur l’utilisateur.
Fonctionnellement nous avons relevé de nombreux bugs sur la plateforme parmi
lesquels on peut citer le panier qui garde les informations après expiration de la
session, disfonctionnement possible lors de la passation de la commande relativement
dû au manque d’informations sur l’adresse de l’utilisateur. En termes de performance,

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 18
Conception d’un site web e-commerce multi vendor 2022

le site www.shop.transfoafricainc.com a été conçu avec une nouvelle technologie pour


des applications de type SPA donc la réputation est justement la rapidité sur le
traitement de données et le temp de réponse rapide, malheureusement nous avons
constaté que le résultat n’était pas celui escompté.

c. Proposition de la nouvelle solution


Le but d’un projet étant de satisfaire un besoin, il convient que l’on recense celle-
ci avant de proposer une nouvelle solution.
Besoin fonctionnel
Il s’agit ici de ressortir le besoin qu’un produit ou un service devrait faire à la fin
de sa réalisation. Dans le cas de notre projet, avons :
Pour les visiteurs du site (client), ils doivent pourvoir effectuer les demandes
suivantes :
 Consulter la liste des produits, pour pouvoir consulter les détails de ce dernier
et effectuer les achats
 Enregistrer un produit en tant que favori pour pouvoir faire l’achat de ce
dernier plus tard.
 Réserver un produit en vue de l’acheter plus tard.
 Inviter d’autres personnes à faire des achats dans le site pour gagner des
coupons de réduction.
 Faire une demande pour devenir vendeur.
 Confirmer sa commande.
 Consulter la liste des commandes passées.
 Consulter l’historique des commandes passées.
 Annuler une commande.
 Suivre sa commande, pour connaitre quand le produit lui sera livré.
 Imprimer la facture d’une commande.

Pour les Marchands :


 Ils doivent pouvoir effectuer les même opérations qu’un client.
 Gérer un produit.
 Effectuer une demande pour l’ajout de la catégorie ou de la marque d’un
produit.
 Gérer ses commandes.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 19
Conception d’un site web e-commerce multi vendor 2022

 Consulter la lister de ses clients.


 Avoir un retour sur l’avis des clients.
 Voir les statistiques de vente.

Pour l’administrateur (Transfo Africa) :


En plus des taches que doivent effectuer les visiteurs et les vendeurs, les admins
du site pourront effectuer certaines taches en fonction de leurs habilitations :
 Gérer les utilisateurs
 Gérer les publicités.
 Activer ou désactiver certaines fonctionnalités du site comme la fonctionnalité
de réservation des produits, d’invitation des utilisateurs etc.

Pour les banques :


 Consulter le stock de produits
 Consulter les statistiques des ventes par semaine

Transfo Africa a également exprimé le besoin de pouvoir faire de la gestion de l’import-


export sur cette plateforme, besoin que nous prendrons en considération lors de notre
analyse.

Besoin non fonctionnel


Il s’agit des besoins qui caractérisent le système. C’est-à-dire les besoins en
matière de performance, de type de matériels ou le type de conception. En dehors
des besoins fondamentaux, notre système devra remplir les attentes suivantes :
 Sécurité
 La performance du réseau (temps de réponse)
 Facile à utiliser par rapport à l’ancien système
 Fiable, robuste et disponible (accessible à tout moment)
 Conforme aux besoins attendus
 Ergonome et flexible (peut être utilisé à plusieurs fins)
 Intègre (s’adapte aux future évolutions) et maintenable
 Réutilisable (code source)

Solution proposer
Maintenant que nous avons analyser et déceler les anomalies de l’existant, une
approche de solution seras de concevoir et développer un site web qui viendras pallier

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 20
Conception d’un site web e-commerce multi vendor 2022

les insuffisances que nous avons pu déceler lors de notre analyse. Ce site web qui
sera encrer sur les besoins exprimer par Transfo Africa qui se à la fois performante et
ergonomique.

II. SCHEMATISATION DE LA NOUVELLE SOLUTION VALIDEE


a. Découpage en processus
Pour une meilleure compréhension de notre thème, il est important pour nous de
le segmenter en différents processus de réalisation. Et c’est dans cette optique que
dans notre cas nous pouvons distinguer :
Processus de passation de la commande : dans ce processus, l’objectif est de
permettre au client d’effectuer un achat. Pour cela, il a besoin de consulter la liste des
marchandises disponibles, faire un choix de produit qui correspond à son besoin,
l’ajouté au panier et passer à la caisse pour le règlement de la facture ;
Processus de paiement : après avoir alimenté son panier avec les produits
correspondant à son besoin, il faut régler la facture. Pour se faire, les informations
complémentaires sur l’adresse du client, le mode de livraison et le type de paiement
doivent être fournis. Une fois que ces informations ont été fournis, un processus de
paiement automatique est déclenché en fonction du type de paiement choisi. Il y a
plus qu’à confirmer le paiement et attendre la livraison de ce produit.
Processus de livraison : après confirmation du paiement, une notification est
envoyée au niveau de Transfo Africa qui se charge de préparer les commandes
passées pour effectuer une livraison. Il imprime en suite un bordereau de livraison
correspondant à la commande du client et le confie à un coursier qui finalise la
livraison.
Processus création d’une boutique : Pour ce faire, il initie une demande de création
de boutique (constituée des informations de la boutique) à destination de Transfo
Africa qui, étudie cette demande et en fonction des informations contenues celle-ci, il
peut accepter ou refuser la demande de création. Si la demande a été accepté, le
client reçoit une notification confirment la création de sa boutique.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 21
Conception d’un site web e-commerce multi vendor 2022

b. Identification des Acteurs et des Cas d’Utilisation

Acteur Cas d’utilisation


Client  S’inscrire
 Se connecter
 Consulter liste produit
 Gérer le panier
 Gérer les favoris
 Gérer son profile
 Passe une commande
 Annuler une commande
 Consulter les commandes
 Tracer une commande
 Imprimer facture
 Devenir vendeur
 Affilier les potentiels client
Marchand  S’inscrire
 Se connecter
 Créer boutique
 Ajouter produit dans une boutique
 Demande l’ajout de nouvelle marque ou
catégorie
 Gérer ses commandes
 Recevoir le paiement des clients
 Consulter statistique
Responsable de stock  Se connecter
 Gérer produit
 Imprimer fiche de stock
Responsable de vente  Se connecter
 Gérer les ventes
 Consulter statistique de vente
 Imprimer fiche de vente
Administrateur  Se connecter

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 22
Conception d’un site web e-commerce multi vendor 2022

 Créer utilisateur (Client, vendeur, responsable de


stock et de vente, administrateur)
 Bloquer les utilisateurs
 Accepter les demandes des utilisateurs voulant
devenir vendeur
 Gérer les boutiques
 Accepter les demandes de création des marques
et des catégories
 Gérer les produits
 Gérer les commandes
 Gérer les publicités
 Consulter statistique
Banque  Se connecter
 Consulter stock
 Consulter statistique de vente
Importateur  S’inscrire
 Se connecter
 Envoyer colis
 Recevoir colis
Tableau 1 identification des acteurs et cas d'utilisation

c. Diagrammes des cas d’utilisation


Un diagramme de cas d'utilisation capture le comportement d'un système, d'un
sous-système, d'une classe ou d'un composant tel qu'un utilisateur extérieur le voit.
 Cas d’utilisation responsable de stock ;

Gérer
produit
<<include>>
Se
Connecter

Responsabel stock <<include>>

Imprimer
fiche de stock

Figure 3 cas d'utilisation Responsable du stock

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 23
Conception d’un site web e-commerce multi vendor 2022

 Cas d’utilisation client

S'inscrire <<include>>

Consulter liste
<<include>>
produit

Gérer les Authentification


favoris <<include>>

Gérer le
panie <<include>>
Client

Gérer son
profile <<include>>

Gérer les
commandes
<<include>>

Devenir un
marchand
<<include>>

Imprimer les
factures
<<include>>

Affilier
potentiel client
<<include>>

Figure 4 cas d'utilisation du client


 Cas d’utilisation de la banque

Consulter stock

<<include>>
Se connecter

Banque

Consulter
statistique vente

Figure 5 cas d'utilisation de la banque

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 24
Conception d’un site web e-commerce multi vendor 2022

 Cas d’utilisation marchand

S'inscrire
<<include>>

<<include>> Authentification

Creer
boutique

Gérer produit
<<include>>

Marchand Demande
ajout marque
ou categorie <<include>>

Gérer
commande
<<include>>
Recevoir le
paiement
des clients <<include>>

Consulter
statistique <<include>>

Figure 6 cas d'utilisation du marchand

 Cas d’utilisation responsable de vente

Gérer les <<include>>


ventes

Imprimer <<include>>
Se connecter
fiche vente

Responsable vente

Consultater
statisque
vente <<include>>

Figure 7 cas d'utilisation du responsable de vente

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 25
Conception d’un site web e-commerce multi vendor 2022

 Cas d’utilisation de l’administrateur

<<include>>
Creer
utilisateur <<include>>

Bloquer
utilisateur

Se
Accepter connecter
demande <<include>>
marchand

Gerer <<include>>
boutique

Admin
Accepter demande
creation marque / <<include>>
categorie

Gerer
produits
<<include>>

Consulter
statistiaque <<include>>

Gérer
publicités <<include>>

Figure 8 cas d'utilisation de l'administrateur

 Cas d’utilisation des importateurs

S'inscrire
Se connecter

Tracer colis

Envoyer colis
Importateur

Recvoir colis

Figure 9 cas d'utilisation des importateurs

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 26
Conception d’un site web e-commerce multi vendor 2022

III. DIAGRAMME DE REALISATION DU PROJET

Figure 10 diagramme de réalisation du projet

IV. COUT ESTIMATIF DU PROJET


Parmi les différentes étapes de gestion d’un projet, l’évaluation du coût du projet
est la plus importante et la plus délicate. En effet, cette phase nécessite beaucoup
de rigueur et doit être la plus exhaustive possible afin de fournir un chiffrage précis,
fiable et pertinent. Apres plusieurs recherches et conseils en consultation des
professionnels du métier, il en ressort les coûts suivants :
 Achat du nouveau nom de domaine : 10 000 FCFA
 Achat de l’hébergement : 226 000 FCFA / an
 Main d’œuvre : 1 500 000 FCFA
 Equipement de travail : 700 000 FCFA
Pour un total de 2,436,000 FCFA

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 27
Conception d’un site web e-commerce multi vendor 2022

3e Partie: DOSSIER DE CONCEPTION

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 28
Conception d’un site web e-commerce multi vendor 2022

INTRODUCTION
Un dossier de conception est un outil qui décrit dans les détails un projet et
pourra être utilisé dans différents contextes en externe et en interne. Cet outil peut
servir de guide pour connaitre les objectifs à atteindre ainsi que tous les processus
par lesquels il faudra passer.

I. ETUDE DES SPECIFICATIONS FONCTIONNELLES


a. Rappel des objectifs à atteindre
D’après notre cahier de charge, notre objectif est centré sur développer un site web
sécurisé, performant et ergonomique qui viendra pallier et répondre aux besoins de
Transfo Africa.

b. Liste des acteurs et leurs rôles

Acteur Rôle

Client Est une personne qui navigue sur notre plateforme à la


recherche d’un produit pour l’acheter

Marchand Est un commerçant qui vend ses produits sur notre


plateforme.

Responsable de stock Est un employé de Transfo Africa, qui peut ajouter et


mettre à jour le stock produit
Responsable de vente Est un employé de Transfo Africa qui peut gérer les
commandes distant et présentiel de l’entreprise

Administrateur Est une personne qui dispose de l’accès total à la


plateforme.

Banque Est un partenaire de Transfo Africa, qui peut Controller


l’État de vente de Transfo Africa

Importateur C’est une personne qui veut importer ou exporter un


produit à l’intérieur ou à l’extérieur du pays

Tableau 11 liste des acteurs et leurs rôles

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 29
Conception d’un site web e-commerce multi vendor 2022

c. Description des cas d’utilisation

Cas d’utilisation S’inscrire


Objectifs Être reconnu par le système
Acteurs principaux Client
Acteurs Secondaires Système
Précondition Disposer d’un numéro de téléphone et d’une adresse
email valide
Postcondition Reconnue en tant qu’utilisateur du système
Scenario nominal 1. Se rendre à la page d’inscription
2. Remplir le formulaire
3. Cliquer sur le bouton envoyer
Scenario alternatif  Echec inscription : recommencer scenario 2
 Formulaire incomplet : recommencer scenario 2
 Les informations sont incorrectes : recommencer
scenario 2.
Exception
Tableau 2 description cas d’utilisation : s'inscrire

Cas d’utilisation Authentification


Objectifs Avoir accès à la partie restreinte du système suivant
son rôle.
Acteurs principaux Client
Acteurs Secondaires Système
Précondition Être inscrit et avoir activer son compte
Postcondition Être connecter
Scenario nominal 1. Se rendre à la page de connexion
2. Remplir les informations de connexion
3. Cliquer sur se connecter
Scenario alternatif  Echec de la connexion : recommence scenario 2
 Formulaire incomplet : recommencer scenario 2

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 30
Conception d’un site web e-commerce multi vendor 2022

 Les informations sont incorrectes : recommencer


scenario 2.
 Compte non confirmer : recommencer cas
d’utilisation S’inscrire
Exception
Tableau 3 description cas d’utilisation : Authentification

Cas d’utilisation Consulter liste produits


Objectifs Avoir la liste des produits disponibles
Acteurs principaux Client
Acteurs Secondaires Système
Précondition
Postcondition
Scenario nominal 1. Se diriger vers la page d’accueil
2. Choisir un catalogue de produit
3. Voir la liste des produits du catalogue
Scenario alternatif
Exception
Tableau 4 description cas d'utilisation : Consulter liste produit

Cas d’utilisation Gérer les favoris


Objectifs Avoir une liste souhait
Acteurs principaux Client
Acteurs Secondaires Système
Précondition Être Authentifier
Postcondition
Scenario nominal 1. Se rendre à la page d’accueil
2. Choisir un catalogue de produit
3. Voir la liste des produits du catalogue
4. Choisir un produit
5. Cliquer sur ajouter au favori
Scenario alternatif
Exception
Tableau 5 description cas d'utilisation : Gérer favoris

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 31
Conception d’un site web e-commerce multi vendor 2022

Cas d’utilisation Gérer panier


Objectifs Avoir un panier de produits près pour l’achat final
Acteurs principaux Client
Acteurs Secondaires Système
Précondition
Postcondition
Scenario nominal 1. Se rendre à la page d’accueil
2. Choisir un catalogue de produits
3. Voir la liste des produits du catalogue
4. Choisir un produit
5. Cliquer sur ajouter produit au panier
Scenario alternatif
Exception
Tableau 6 description cas d’utilisation : Gérer panier

Cas d’utilisation Gérer Profile


Objectifs Modifier les informations de son compte
Acteurs principaux Client
Acteurs Secondaires Système
Précondition Être Authentifier
Postcondition
Scenario nominal 1. Se rendre à la page d’accueil
2. Cliquer sur compte
3. Cliquer sur modifier compte
4. Remplir les informations
5. Cliquer sur modifier
Scenario alternatif  Information erronée : recommencer scenario 4
 Formulaire vide : recommencer scenario 4
Exception
Tableau 7 description cas d'utilisation : Gérer profile

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 32
Conception d’un site web e-commerce multi vendor 2022

Cas d’utilisation Gérer Commande


Objectifs Acheter un produit
Acteurs principaux Client
Acteurs Secondaires Système
Précondition Avoir alimenter le panier
Postcondition Imprimer facture
Scenario nominal 1. Se diriger vers la page d’accueil
2. Cliquer sur le panier
3. Cliquer sur passer à la caisse
4. Choisir adresse de livraison
5. Cliquer sur suivant
6. Choisir mode de paiement
7. Valider paiement
8. Cliquer sur terminer
Scenario alternatif  Adresse de livraison vide : recommencer
scenario 4
 Mode de paiement vide : recommencer
scenario 6
 Solde insuffisant : recommencer scenario 6
Exception
Tableau 8 description cas d’utilisation : Gérer commande

Cas d’utilisation Devenir un marchand


Objectifs Pouvoir vendre sur la plateforme
Acteurs principaux Client
Acteurs Secondaires Système, administrateur
Précondition Être authentifier
Postcondition Gérer produit
Scenario nominal 1. Se diriger vers la page d’accueil
2. Cliquer sur compte
3. Cliquer sur devenir vendeur
4. Remplir le formulaire

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 33
Conception d’un site web e-commerce multi vendor 2022

5. Cliquer sur envoyer la demande


Scenario alternatif  Formulaire incomplet : recommencer scenario 4
 Information erronée : recommencer scenario 4
 Format fichier incorrecte : recommencer scenario 4

Exception
Tableau 9 description cas d'utilisation : devenir marchand

Cas d’utilisation Créer boutique


Objectifs Ajouter une nouvelle boutique
Acteurs principaux Marchand
Acteurs Secondaires Système, administrateur

Précondition Être authentifié

Postcondition Gérer produit


Scenario nominal 1. Se diriger vers la page d’accueil
2. Cliquer sur compte
3. Cliquer sur mes boutiques
4. Cliquer sur crée une nouvelle boutique
5. Remplir le formulaire
6. Cliquer sur envoyer la demande

Scenario alternatif  Formulaire incomplet : recommencer scenario 4


 Information erronée : recommencer scenario 4
 Format fichier incorrecte : recommencer scenario 4

Exception

Figure 12 description cas d’utilisation : devenir marchand

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 34
Conception d’un site web e-commerce multi vendor 2022

d. Diagramme global des cas d’utilisation


Gérer le
panie Consulter liste
produit

Devenir un
marchand

Affilier
potentiel client
Gérer son <<include>>
profile
Imprimer les
factures <<include>>

Gérer <<include>>
commande

Gérer les <<include>>


Client favoris

<<include>>
Creer
boutique
Recevoir le <<include>>
paiement
des clients

<<include>>
Demande
<<include>>
ajout marque
ou categorie
Marchand

Gérer <<include>>
produit

<<include>>
Imprimer
fiche de stock

Gérer les S'inscrire <<include>>


Responsable stock
ventes

Consultater
<<include>>
statisque <<include>>
vente
Authentific
Imprimer
ation
fiche
vente <<include>>
Responsable vente

Consulter
stock
<<include>>

Consulter <<include>>
statistique
Creer
vente <<include>>
Banque utilisateur

Bloquer
utilisateur <<include>>

Accepter
demande
marchand <<include>>
Admin

Gerer <<include>>
boutique

Accepter
demande
creation <<include>>
marque /
categorie

Consulter
statistiaque <<include>>

Gérer
publicités <<include>>

Tracer
colis
<<include>>

Envoyer
colis <<include>>
Importateur

Recevoir
colis <<include>>

Figure 13 diagramme globale des cas d'utilisateur

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 35
Conception d’un site web e-commerce multi vendor 2022

e. Diagramme de séquence de quelque cas d’utilisation


Les diagrammes de séquence est un diagramme qui permet de décrire comment
les éléments du système interagissent entre eux et avec les acteurs. Pour être plus
spécifies, une interaction doit être décrite dans plusieurs diagramme UML.
 Cas d’utilisation Authentification
Authentification

Authenfication: module d'


Connexion: Page de connexion
Authentification

Utilisateur
Entrer un nom d'utilisateur / numero de
telephone

Entrer mot de passe

Cliquer sur le bouton se connecter


Envoie des information de connexion

Validation des information de connexion

alt [login et mot de passe correcte]


Connexiont accepter

Redirection ver la page demander

[mot de passe et login incorrecte]


Utilisateur rediriger ver la page de
connexion
netoyage des informations de connexion

Figure 14 cas d'utilisation Authentification

f. Diagramme de communication
Le diagramme de communication est un diagramme UML apparue depuis sa
version 2.0. Elle est une représentation simplifier d’un diagramme de séquence se
concentrant sur les échanges de messages entre les objets.
 Cas d’utilisation Authentification

1: Saisit(login, mot de passe) 2: Envoie(login, mot de passe)

:page de connexion :module d'authentification

Utilisateur 6: Reponse 5: Reponse

4: Reponse
3: Requete sql

:fournisseur d'utilisateurs

Figure 15 diagramme de communication Authentification

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 36
Conception d’un site web e-commerce multi vendor 2022

g. Diagramme de classe
Country
State - id : int
City * - name : int
- id : int
* 1..1 - flag : String
- id : int - name : String
- name : String 1..1 - code : int
1..1 - phone_code : int

1..1 1..1
Adresse
* *
- id : int
User - telephone : int
Store - adresse : int
- id : int 0..*
0..*
- id : int - username : String 1..1
- name : String - email : String
- description : String - password : String
- email : String * - first_name : String
- phone : String 1..1 - last_name : String Paiement
- logo : String - telephone : String - id : int
- web_site : String - role : String - payment_type : String
- created_at : Date 1..1 - confirmation_token : String 1..1 - provider : String
- updated_at : Date - created_at : Date 0..* - account_no : int
- deleted_at : Date - updated_at : Date - expiry : Date

1..1 1..1
*

Category Product
- id : int Cart_item Shopping_session
- id : int
- name : String 1..1 - name : String - id : int - id : int
- description : String - quantity : int *
0..* - description : String - total : double
- created_at : Date 1..1 - created_at : Date 1..1
- price : double - created_at : Date
- updated_at : Date - created_at : Date 1..1 - modified_at : Date - updated_at : Date
- deleted_at : Date - updated_at : Date 1..1
- deleted_at : Date

Inventory
1..1 0..* 1..1
- id : int 1..1
- quantity : int Order_items
- created_at : Date - id : int
1..1
- deleted_at : Date - quantity : int
- updated_at : Date - created_at : Date
* - updated_at : Date

1..1

discount
0..* 1..1
- id : int
- name : String
- description : String Order_details
- discount_percent : double
- id : int
- active : boolean
- total : double payment_details
- created_at : Date
- created_at : Date - id : int
- updated_at : Date 1..1
- updated_at : Date - amount : double
- deleted_at : Date 1..1
- provider : String
- status : boolean
- created_at : Date
- updated_at : Date

Figure 16 diagramme de classe

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 37
Conception d’un site web e-commerce multi vendor 2022

II. CONCEPTION DETAILLEE


a. Modèle relationnel associé aux différentes Classes
Country
State
City id <pi> Entier <O>
id <pi> Entier <O> Association_13 name Entier
id <pi> Entier <O> Cou_id <fi> Entier <O>
Association_14 flag Caractère variable (254)
Association_17
Sta_id <fi> Entier <O> name Caractère variable (254) code Entier
name Caractère variable (254)
StatePk <pi> phone_code Entier
CityPk <pi>
CountryPK <pi>

Adresse
Association_16 id <pi> Entier <O>
Store User Use_id <fi1> Entier <O>
Cit_id <fi2> Entier <O>
id <pi> Entier <O> Association_15 id <pi> Entier <O>
telephone Entier
Cit_id <fi1> Entier <O> Cit_id <fi> Entier <O>
Association_1 adresse Entier
Use_id <fi2> Entier <O> username Caractère variable (254)
name Caractère variable (254) email Caractère variable (254) adressePk <pi>
description Caractère variable (254) password Caractère variable (254)
Association_19
email Caractère variable (254) first_name Caractère variable (254)
phone Caractère variable (254) last_name Caractère variable (254)
logo Caractère variable (254) telephone Caractère variable (254) Paiement
Association_18
web_site Caractère variable (254) role Caractère variable (254) id <pi> Entier <O>
Association_2
created_at Date & Heure confirmation_token Caractère variable (254) Use_id <fi> Entier <O>
updated_at Date & Heure created_at Date & Heure payment_type Caractère variable (254)
deleted_at Date & Heure updated_at Date & Heure provider Caractère variable (254)
StorePK <pi> userPk <pi> account_no Entier
expiry Date & Heure
paiementPk <pi>
Product
(D)
id <pi> Entier <O>
Category Car_id <fi4> Entier <O>
Inv_id <fi3> Entier <O> Cart_item
id <pi> Entier <O> Shopping_session
Ord_id <fi5> Entier <O> id <pi> Entier <O>
name Caractère variable (254) Association_3 Sto_id <fi6> Entier <O> Sho_id <fi> Entier <O> id <pi> Entier <O>
description Caractère variable (254)
dis_id <fi2> Entier <O> Association_11 Use_id <fi> Entier <O>
created_at Date & Heure quantity Entier
Association_6
Cat_id <fi1> Entier <O> created_at Date & Heure total Numérique (8,0)
updated_at Date & Heure
name Caractère variable (254) (D)
modified_at Date & Heure created_at Date & Heure
deleted_at Date & Heure
description Caractère variable (254) updated_at Date & Heure
categoryPk <pi> CartItemPK <pi>
Association_12
price Numérique (8,0)
ShoppingSessionPk <pi>
created_at Date & Heure
updated_at Date & Heure Association_9
deleted_at Date & Heure
Inventory ProductPk <pi> Order_items
id <pi> Entier <O> id <pi> Entier <O>
(D)
quantity Entier Association_7 (D) Ord_id <fi> Entier <O>
created_at Date & Heure Association_5 quantity Entier
deleted_at Date & Heure created_at Date & Heure
updated_at Date & Heure Association_4 updated_at Date & Heure
inventoryPk <pi> OrderItemPk <pi>

Association_8

discount payment_details
id <pi> Entier <O> Order_details id <pi> Entier <O>
name Caractère variable (254) amount Numérique (8,0)
id <pi> Entier <O>
description Caractère variable (254) provider Caractère variable (254)
Use_id <fi1> Entier <O>
discount_percent Numérique (8,0) status Booléen
pay_id <fi2> Entier <O>
active Booléen created_at Date & Heure
total Numérique (8,0)
created_at Date & Heure updated_at Date & Heure
created_at Date & Heure
updated_at Date & Heure PaymentDetailsPk <pi>
updated_at Date & Heure Association_10(D)
deleted_at Date & Heure
OrderDetailPK <pi>
discountPk <pi>

Figure 17 MLD associé à la classe

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 38
Conception d’un site web e-commerce multi vendor 2022

b. Modèle physique de donnée et volumétrie de la DB


Country
State
id int <pk>
City
id int <pk> name int
id int <pk> Cou_id int <fk> flag varchar(254)
Sta_id int <fk> name varchar(254) code int
name varchar(254) ... phone_code int
... ...

Adresse
id int <pk>
Use_id int <fk1>
Store User
Cit_id int <fk2>
id int <pk> id int <pk> telephone int
Cit_id int <fk1> Cit_id int <fk> adresse int
Use_id int <fk2> username varchar(254) ...
name varchar(254) email varchar(254)
description varchar(254) password varchar(254)
first_name varchar(254) Paiement
email varchar(254)
phone varchar(254) last_name varchar(254) id int <pk>
logo varchar(254) telephone varchar(254) Use_id int <fk>
web_site varchar(254) role varchar(254) payment_type varchar(254)
created_at datetime confirmation_token varchar(254) provider varchar(254)
updated_at datetime created_at datetime account_no int
deleted_at datetime updated_at datetime expiry datetime
... ... ...

Product
id int <pk>
Car_id int <fk4>
Category
Inv_id int <fk3> Cart_item Shopping_session
id int <pk> Ord_id int <fk5> id int <pk> id int <pk>
name varchar(254) Sto_id int <fk6> Sho_id int <fk> Use_id int <fk>
description varchar(254) dis_id int <fk2> quantity int total numeric(8,0)
created_at datetime Cat_id int <fk1> created_at datetime created_at datetime
updated_at datetime name varchar(254) modified_at datetime updated_at datetime
deleted_at datetime description varchar(254) ... ...
... price numeric(8,0)
created_at datetime
updated_at datetime
Inventory deleted_at datetime
...
id int <pk> Order_items
quantity int
id int <pk>
created_at datetime
Ord_id int <fk>
deleted_at datetime
quantity int
updated_at datetime
created_at datetime
...
updated_at datetime
...

discount
id int <pk>
name varchar(254) Order_details
description varchar(254) id int <pk>
discount_percent numeric(8,0) Use_id int <fk1>
active bool pay_id int <fk2> payment_details
created_at datetime total numeric(8,0)
updated_at datetime id int <pk>
created_at datetime
deleted_at datetime amount numeric(8,0)
updated_at datetime
... provider varchar(254)
...
status bool
created_at datetime
updated_at datetime
...

Figure 18 MPD

CONCLUSION
Le travail ainsi élaboré, montre l’importance de la prévision dans l’élaboration
d’une bonne gestion du projet. L’objectif d’un site e-commerce est d’attirer le maximum
de trafic sur son site afin d’effectuer un maximum de ventes. Dans cette optique, un,
bon référencement naturel constitue une arme redoutable pour attirer les clients et en
fin réussir à les convertir.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 39
Conception d’un site web e-commerce multi vendor 2022

4e Partie: DOSSIER DE REALISATION

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 40
Conception d’un site web e-commerce multi vendor 2022

INTRODUCTION
Le dossier de réalisation est très important dans le sens où il apporte plus de
détails sur les moyen mis en œuvre pour la réalisation d’un projet notamment en
faisant une description de l’environnement technique et l’architecture du projet.

I. DESCRIPTION DE L’ENVIRONNEMENT TECHNIQUE


a. Configuration matérielle
Les ressources matérielles utilisées pour la mise en œuvre de notre plateforme
sont les suivantes :
 Ordinateur Intel(R) Core i5 CPU 661 @3.33GHz
 10GB de mémoire vive (RAM)
 500GB en capacitée de stockage (HDD)
 Système d’exploitation Ubuntu 20.04 LTS
 Système d’exploitation Windows 10

b. Outils logiciel
Au niveau software la configuration que nous avons mise au point dans notre
système d’exploitation Ubuntu 20.04 LTS pour le développement de cette
infrastructure est :
 Apache 2

Le logiciel libre Apache HTTP Server (Apache) est un serveur HTTP créé et
maintenu au sein de la fondation Apache. Apache est conçu pour prendre en charge
de nombreux modules lui donnant des fonctionnalités supplémentaires : interprétation
du langage Perl, PHP, Python et Ruby, serveur proxy, Common Gateway
Interface, Server Side Includes, réécriture d'URL, négociation de contenu, protocoles
de communication additionnels, etc. Néanmoins, il est à noter que l'existence de
nombreux modules Apache complexifie la configuration du serveur web. En effet, les
bonnes pratiques recommandent de ne charger que les modules utiles : de
nombreuses failles de sécurité affectant uniquement les modules d'Apache sont
régulièrement découvertes.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 41
Conception d’un site web e-commerce multi vendor 2022

 Php 8.1

PHP: HyperText Preprocessor, plus connu sous son sigle PHP (sigle auto-
référentiel), est un langage de programmation libre, principalement utilisé pour
produire des pages Web dynamiques via un serveur HTTP, mais pouvant également
fonctionner comme n'importe quel langage interprété de façon locale. PHP est
un langage impératif orienté objet.

PHP a permis de créer un grand nombre de sites web célèbres,


comme Facebook et Wikipédia https://fr.wikipedia.org/wiki/PHP - cite_note-31. Il est
considéré comme une des bases de la création de sites web dits dynamiques mais
également des applications web.
 Node js

Node.js est une plateforme logicielle libre en JavaScript, orientée vers les
applications réseau évènementielles hautement concurrentes qui doivent
pouvoir monter en charge.
 Docker

Docker est un logiciel libre permettant de lancer des applications dans des
conteneurs logiciels. Selon la firme de recherche sur l'industrie 451 Research, «
Docker est un outil qui peut empaqueter une application et ses dépendances dans un
conteneur isolé, qui pourra être exécuté sur n'importe quel serveur ». Il ne s'agit pas
de virtualisation, mais de conteneurisation, une forme plus légère qui s'appuie sur
certaines parties de la machine hôte pour son fonctionnement. Cette approche permet

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 42
Conception d’un site web e-commerce multi vendor 2022

d'accroître la flexibilité et la portabilité d’exécution d'une application, laquelle va


pouvoir tourner de façon fiable et prévisible sur une grande variété de machines hôtes,
que ce soit sur la machine locale, un cloud privé ou public, une machine nue, etc.
Nous utilisons Docker ici pour la mise en place de notre environnement de
développement.
 Postgresql

PostgreSQL est un système de gestion de base de données relationnelle et objet.


C'est un outil libre disponible selon les termes d'une licence de type BSD. Ce système
est concurrent d'autres systèmes de gestion de base de données, qu'ils soient libres,
ou propriétaires.
 Adminer

Adminer est une application Web offrant une interface graphique pour plusieurs
systèmes de gestion de base de données, réalisée en PHP et distribuée sous licence
Apache. Il se présente comme une alternative légère à pgAdmin, phpMyAdmin et a
pour particularité d'être entièrement contenu dans un seul fichier PHP.
 Redis

Redis est un système de gestion de base de données clé-valeur extensible, très


hautes performances, écrit en C ANSI et distribué sous licence BSD. Il fait partie de
la mouvance NoSQL et vise à fournir les performances les plus élevées possible.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 43
Conception d’un site web e-commerce multi vendor 2022

 PhpStorm

PhpStorm est un éditeur pour PHP, HTML, CSS et JavaScript, édité


par JetBrains. Il permet d'éditer du code PHP pour les versions allant de la 5.3 à la
8.1. Il est réputé pour son débogueur visuel sans configuration, qui fournit une visibilité
incomparable sur ce qui se passe dans votre application à chaque étape.

 Symfony 6

Symfony est un ensemble de composants PHP ainsi


qu'un framework MVC libre écrit en PHP. Il fournit des fonctionnalités modulables et
adaptables qui permettent de faciliter et d’accélérer le développement d'un site web.
Symfony est utilisé par Askeet et beaucoup d'autres applications, dont Delicious et
Yahoo! Bookmarks.
Au niveau de notre système d’exploitation Windows 10, nous avons installé pour
les besoins de rédaction du rapport et schématisation des diagramme lors de la phase
d’analyse les logiciels suivants :
 PowerDesigner

Power Designer (anciennement PowerAMC) est un logiciel de conception


créée par la société SAP, qui permet de modéliser les traitements informatiques et
leurs bases de données associées.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 44
Conception d’un site web e-commerce multi vendor 2022

II. DESCRIPTION DE L’ARCHITECTURE DE L’APPLICATION


a. Architecture générale de l’application
L’architecture d’un logiciel décrit la manière dont seront agencés les différents
éléments d’une application et comment ils interagissent entre eux. Dans notre cas
l’architecture adopter pour la réalisation de notre plateforme est l’architecture MVC.
Ce patron de conception a pour principe la séparation des problématiques, elle
regroupe les fonctions nécessaires en trois catégories :
 Un modèle (modèle de données) ;
 Une vue (présentation, interface utilisateur) ;
 Un Contrôleur (logique de contrôle, gestion des évènements,
synchronisation).
Notre application dépendant du cadre de travail (Framework) Symfony, elle suit donc
l’architecture suivant :

Figure 19 architecture MVC de Symfony

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 45
Conception d’un site web e-commerce multi vendor 2022

b. Présentation des écrans (ou) états


 Page d’accueil

Figure 20 page d'accueil

 Liste produit

Figure 21 page de listing

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 46
Conception d’un site web e-commerce multi vendor 2022

 Détail produit

Figure 22 page détail produit

 Panier de produit

Figure 23 page panier

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 47
Conception d’un site web e-commerce multi vendor 2022

III. CODAGE REALISE


 Authenticator
Cette Classe joue un rôle très important dans le système de sécurité de notre
application, dans un certain sens, on peut dire qu’elle est le chef d’orchestre de notre
système de sécurité.

Figure 24 Authentificateur

 UserChecker
Cette classe permet vérifier si l’utilisateur a le droit de se connecter ou de continuer
a navigué dans notre plateforme, par exemple un utilisateur n’ayant pas activer sont
compte bien qu’étant inscrit ne peut se connecter dans notre plateforme.

Figure 25 code du userChecker

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 48
Conception d’un site web e-commerce multi vendor 2022

CONCLUSION
Maintenant que vous avez une idée des ressources matérielle et logicielle, de
l’architecture adopter pour la mise œuvre de notre application, il convient que l’on
sache comment déployer notre site web sur internet.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 49
Conception d’un site web e-commerce multi vendor 2022

5e Partie: GUIDE D’UTILISATION

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 50
Conception d’un site web e-commerce multi vendor 2022

INTRODUCTION
Le guide d’utilisation est un support explicatif du maniement ou du fonctionnement
d’un objet ou d’un service. Pour accompagne notre livrable, nous allons décrit le
fonctionnement de notre application en faisant ressorti les fonctionnalités, comment
l’installer, les ressources matérielle et logiciel requis cette dernière.

I. FONCTIONNALITES DE L’APPLICATION
Parmi les nombreuses fonctionnalités, que propose notre plateforme, nous allons
nous concentrer sur quelques-uns de ceux-ci qui mérite notre attention qui sont :
 Un design unique, efficace et adapte aux mobiles
 Un tunnel de commandes optimise pour les conversions.
 Email marketing et alertes sur les paniers abandonnés.
 Un référencement efficace
 Plusieurs méthodes de paiement et de livraison
 Programme de fidélité et codes promotionnels
 Option multi vendor
 Option affiliation

II. INSTALLATION D’APPLICATION


Contrairement à l’application native pour système d’exploitation, qui nécessite un
fichier d’installation (setup) pour son déploiement, un site web a besoin elle d’être
hébergé sur un serveur distant lié à un nom de domaine, ou chez soit si l’on dispose
des moyens.
a. Configuration nécessaire
Donc pour le déploiement de notre solution, nous recommandons pour un
fonctionnement optimal, de choisir un hébergement de type cloud managé disposant
des caractéristiques suivant :
Configuration matérielle
 100 Go d’espace disque SSD
 2 vCPU
 8 Go de Ram
Configuration logicielle
 Apache 2
 Php 8.1
 Composer 2
 PostgreSQL 12
 Redis

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 51
Conception d’un site web e-commerce multi vendor 2022

 Node js 14.x.x
 Supervisor
b. Déploiement
Après avoir disposé des ressources matériel et logiciel requis pour la mise en
place de notre solution, effectuer les manipulations suivantes :
 Dans un premier temps mettre à jour le fichier de configuration de Symfony
pour la mise en production.
 Si vous ne dispose pas Node js dans votre environnement de production,
vous pouvez compiler les assets manuellement depuis votre poste en suivant
la documentation de Symfony sur les assets « The Asset Component
(Symfony Docs) ».
 Si vous disposer d’un accès ssh a votre serveur, connecter vous et copier y la
solution. Sinon connecter vous via Filezilla et copier la solution via ftp.
Une fois que la solution chez votre hébergeur, accéder au Shell distant et
effectuer les manipulations suivantes :
 Crée la base de donne en utilisant la commande suivante :
# php bin/console doctrine:schema:update --force

 Crée l’administrateur de base en utilisant la commande

# php bin/console doctrine:fixtures:load

 En fin faire pointer le chemin root de votre hébergement vers le dossier public
 Il ne vous reste qua vous connecter et en tant qu’administrateur pour pupuler
votre site de vente.
CONCLUSION
Maintenant que notre site de vente est en ligne, que nos potentiel client
peuvent effectuer les achats sur celle-ci, nous ne devons pas oublier que celle-ci ne
va pas se s’alimenter toute seul, il faut donc veiller à ce qu’elle soit mise à jour
continuellement avec du nouveau contenu attirent pour les internautes.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 52
Conception d’un site web e-commerce multi vendor 2022

CONCLUSION GENERALE
Parvenue au terme de notre travail, il est frappant de constater l’ensemble des
facilitations que notre solution apporte à l’entreprise Transfo Africa entre autre : la
gestion de stock ; rapprocher l’entreprise de ses clients ; améliorer la visibilité et la
communication de l’entreprise ; l’accès distant et facile aux offres de services et
articles aux client ; la pérennisations des informations de transaction et autre
statistique ; etc.
Bref les processus autre fois manuel sont à la fois numérisés et pérenniser
grâce aux données stockes.
Tout ceci étant fait, il demeure la question du référencement SEO afin de mieux
référencer le site pour une meilleure visibilité.

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 53
Conception d’un site web e-commerce multi vendor 2022

BIBLIOGRAPHIE
 Rapport de stage de MAYOU NGAFON Valery sur l’informatisation des
dossiers de master II et de thèse au centre de recherche et de la formation
doctorale en sciences, technologies et géosciences de l’université de
Yaoundé I
 Rapport de stage de Melle Maroua CHAABANT sur Conception et
développement d’un site web de e-commerce pour le compte de LSAT_Nokia

WEBOGRAPHIE

 https://symfony.com/
 https://www.php.net/
 https://www.postgresql.org/docs/
 https://themeforest.net/item/emarket-multipurpose-woocommerce-wordpress-
theme/20492674
 https://fabric.inc/blog/ecommerce-database-design-example/

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 54
Conception d’un site web e-commerce multi vendor 2022

 https://www.docker.com/get-started/

TABLE DES MATIERES

SOMMAIRE .............................................................................................................................................. ii
DEDICACE ............................................................................................................................................... iii
REMERCIEMENTS ................................................................................................................................... iv
RESUME................................................................................................................................................... v
ABSTRACT............................................................................................................................................... vi
LISTE DES ABRÉVIATIONS ...................................................................................................................... vii
LISTE DES FIGURES ............................................................................................................................... viii
LISTE DES TABLEAUX .............................................................................................................................. ix
INTRODUCTION GENERALE ................................................................................................................... 11
1er Partie: RAPPORT D’INSERTION ................................................................................................. 12
INTRODUCTION ................................................................................................................................. 13
I. PRESENTATION DE L’ENTREPRISE ............................................................................................. 13
a. Historique, mission et objectifs ............................................................................................ 13
b. Plan de localisation ............................................................................................................... 14

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 55
Conception d’un site web e-commerce multi vendor 2022

c. Organigramme ...................................................................................................................... 14
d. Présentation du service d’accueil ......................................................................................... 15
II. PRESENTATION DU THEME DE STAGE ...................................................................................... 15
a. Enoncé du thème .................................................................................................................. 15
b. Enoncé des taches à faire ..................................................................................................... 15
Conclusion ......................................................................................................................................... 16
2e Partie: CAHIER DES CHARGES ....................................................................................................... 17
INTRODUCTION ................................................................................................................................. 18
I. ETUDE DE L’EXISTANT ............................................................................................................... 18
a. Recueil de l’existant .............................................................................................................. 18
b. Analyse et critique de l’existant ............................................................................................ 18
c. Proposition de la nouvelle solution ...................................................................................... 19
II. SCHEMATISATION DE LA NOUVELLE SOLUTION VALIDEE ........................................................ 21
a. Découpage en processus ...................................................................................................... 21
b. Identification des Acteurs et des Cas d’Utilisation ............................................................... 22
c. Diagrammes des cas d’utilisation ......................................................................................... 23
III. DIAGRAMME DE REALISATION DU PROJET........................................................................... 27
IV. COUT ESTIMATIF DU PROJET ................................................................................................ 27
3e Partie: DOSSIER DE CONCEPTION ................................................................................................. 28
INTRODUCTION ................................................................................................................................. 29
I. ETUDE DES SPECIFICATIONS FONCTIONNELLES........................................................................ 29
a. Rappel des objectifs à atteindre ........................................................................................... 29
b. Liste des acteurs et leurs rôles .............................................................................................. 29
c. Description des cas d’utilisation ........................................................................................... 30
d. Diagramme global des cas d’utilisation ................................................................................ 35
e. Diagramme de séquence de quelque cas d’utilisation ......................................................... 36
f. Diagramme de communication............................................................................................. 36
g. Diagramme de classe ............................................................................................................ 37
II. CONCEPTION DETAILLEE ........................................................................................................... 38
a. Modèle relationnel associé aux différentes Classes ............................................................. 38
b. Modèle physique de donnée et volumétrie de la DB ........................................................... 39
CONCLUSION..................................................................................................................................... 39
4e Partie: DOSSIER DE REALISATION ................................................................................................. 40
INTRODUCTION ................................................................................................................................. 41
I. DESCRIPTION DE L’ENVIRONNEMENT TECHNIQUE .................................................................. 41
a. Configuration matérielle ....................................................................................................... 41

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 56
Conception d’un site web e-commerce multi vendor 2022

b. Outils logiciel ......................................................................................................................... 41


II. DESCRIPTION DE L’ARCHITECTURE DE L’APPLICATION............................................................. 45
a. Architecture générale de l’application.................................................................................. 45
b. Présentation des écrans (ou) états ....................................................................................... 46
III. CODAGE REALISE ................................................................................................................... 48
CONCLUSION..................................................................................................................................... 49
5e Partie: GUIDE D’UTILISATION ....................................................................................................... 50
INTRODUCTION ................................................................................................................................. 51
I. FONCTIONNALITES DE L’APPLICATION ..................................................................................... 51
II. INSTALLATION D’APPLICATION ................................................................................................. 51
a. Configuration nécessaire ...................................................................................................... 51
b. Déploiement ......................................................................................................................... 52
CONCLUSION......................................................................................................................................... 52
CONCLUSION GENERALE ....................................................................................................................... 53
BIBLIOGRAPHIE ..................................................................................................................................... 54
WEBOGRAPHIE...................................................................................................................................... 54
TABLE DES MATIERES ............................................................................................................................ 55

Rapport de stage Redige et Soutenu à IUSTY par Youa Emeran


P a g e | 57

Vous aimerez peut-être aussi