EEnnccaaddrréé ppaarr MMmmee:: 
RRaahhiimmii HHaassnnaaaa 
RRééaalliisséé ppaarr :: 
KKaarrbbaacchh OOtthhmmaann
Plan 
Introduction: 
I: Conception à la base de donnée : 
 UML (langage de modélisation unifié): 
 Les acteurs 
 Les ...
IInnttrroodduuccttiioonn 
 Le commerce électronique ou e-commerce 
désigne l’échange de biens et de services entre deux 
...
1 2 3 
l’enregistrement des 
clients se fait 
manuellement sur 
papier. 
les documents sont 
nombreux et mal 
organisés. 
...
Les motivations Les motivations ddee ll’’aacchhaatt eenn lliiggnnee
Partie I: Conception de la base de 
données
Les Acteurs 
: a des droits limités sur l’application 
: a des droits limités sur l’application 
: a des droits limités su...
Les Cas d’utilisation: 
Ce diagramme est destiné à représenter un ensemble de séquences d'actions 
qui sont réalisées par ...
Les Diagrammes de séquences: 
1-consulter le catalogue:
Consulter Les Annonces:
consulter les Commentaires
Déposer une annonce:
gérer le panier
effectuer une commande
gérer les annonces:
gérer les commentaires:
gérer le compte:
gérer les profils:
gérer les promotions:
Le Diagramme de Classe:
Partie II: les Moyens Techniques:
Les langages informatiques
Partie III: Implémentation de l’application :
L’environnement du développement
Dans ce qui suit, on va présenter quelques captures 
d’ interfaces de notre application web E-commerce et 
annonces .
Formulaire 
d’authentification 
Grâce à cette option l’utilisateur peut créer 
son propre compte ou bien récupérer son 
Mo...
Formulaire d’inscription: 
 cette page permet au internaute de créer son propre compte client, il contient un 
formulaire...
Page d’accueil 
dans cette page, des produits de plusieurs catégories sont affichés ainsi qu’un menu qui 
permet de facili...
Les détails d’un produit 
Dans cette page le 
client peut consulter 
les détails d’un produit 
quelconque Et 
l’ajouter a...
Formulaire de panier 
cette fenêtre affiche le nombre d’articles ainsi 
que le montant total . 
A partir de cette page l’i...
Récupérer le mot de passe 
Dans ce formulaire, le client saisit les informations 
demandés pour lui envoyer son mot de pa...
PASSER UNE ANNONCE 
Pour déposer une annonce, le client doit être authentifié, 
après il remplit le formulaire
Consulter les annonces 
Cette page permet d’afficher les annonces publiés par les 
clients et validées par l ’administrat...
Détails d’une annonce et l’ajout 
d’un commentaire 
Cette page permet de consulter les détails des annonces 
savoir les i...
L’affichage des commentaires 
Ce contrôle permet d’afficher les commentaires 
publiés dans une annonce
Les catégories des produits 
Ce menu présente la liste de toutes les catégories et au click sur une catégorie, 
l’internau...
Gestion de Compte 
1/Modification des information : 
Ce formulaire a pour fonction la modification des informations de cl...
2/Modification de photo: 
Cette image présente la photo de client authentifié et il peut la modifier en cliquant sur le 
...
3/Modification de mot de passe 
Ce petit formulaire permet au client authentifié de modifier son mot de passe en 
entrant...
Formulaire de Contact 
Pour contacter l’administrateur du site, l’internaute ou client doit remplir ce 
formulaire
Gestion administrative 
1-Les Annonces: 
Cette image présente la page d’administration et effectivement la gestion des 
a...
2-Les Promotions: 
Cette image présente la page d’administration et effectivement la gestion des 
promotions, c’est l’adm...
3-Les commentaires: 
Cette image présente la page d’administration(la même principe que les deux 
images précédentes) et ...
4-Les Produits: 
Cette image présente la page d’administration et effectivement la gestion des 
produits, c’est administr...
5-Les Profils: 
Cette image présente la page d’administration et effectivement la gestion des profils 
d’utilisateurs, c’...
Conclusion 
 Finalement Ce projet nous a donné une chance de nous 
sensibiliser en méthodes de travail adéquates et appro...
Merci pour votre Attention!
Presentation
Prochain SlideShare
Chargement dans…5
×

Presentation

287 vues

Publié le

presentation

Publié dans : Business
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
287
Sur SlideShare
0
Issues des intégrations
0
Intégrations
4
Actions
Partages
0
Téléchargements
7
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Presentation

  1. 1. EEnnccaaddrréé ppaarr MMmmee:: RRaahhiimmii HHaassnnaaaa RRééaalliisséé ppaarr :: KKaarrbbaacchh OOtthhmmaann
  2. 2. Plan Introduction: I: Conception à la base de donnée :  UML (langage de modélisation unifié):  Les acteurs  Les cas d’utilisation  Les Scénarios  Les diagrammes de séquence  Le Diagramme de classe II: Moyens Techniques:  Les langages utilisés: III: Implémentation de l’application :  L’environnement de développement  Création de la bases de données  Les interfaces graphiques  Conclusion :
  3. 3. IInnttrroodduuccttiioonn  Le commerce électronique ou e-commerce désigne l’échange de biens et de services entre deux entités sur le réseau Internet. Les petites annonces concernent généralement des déclaration écrites dans un journal de petites annonces ou sur des sites internet, par des particuliers ou des professionnels, en vue d'être lues par le plus grand nombre. Cette annonce sert à vendre un bien d'occasion ou neuf, un animal (voire même le donner), un immeuble..un service...
  4. 4. 1 2 3 l’enregistrement des clients se fait manuellement sur papier. les documents sont nombreux et mal organisés. les produits sont classés par catégorie non liées et non Hiérarchisées, ce qui rend la recherche plus pénible. le règlement des factures se fait en espèce ou par chèque, sur place
  5. 5. Les motivations Les motivations ddee ll’’aacchhaatt eenn lliiggnnee
  6. 6. Partie I: Conception de la base de données
  7. 7. Les Acteurs : a des droits limités sur l’application : a des droits limités sur l’application : a des droits limités sur l’application : a des droits limités sur l’application :Il a tous les droits sur le système
  8. 8. Les Cas d’utilisation: Ce diagramme est destiné à représenter un ensemble de séquences d'actions qui sont réalisées par le système et qui produisent un résultat observable intéressant pour un acteur particulier.
  9. 9. Les Diagrammes de séquences: 1-consulter le catalogue:
  10. 10. Consulter Les Annonces:
  11. 11. consulter les Commentaires
  12. 12. Déposer une annonce:
  13. 13. gérer le panier
  14. 14. effectuer une commande
  15. 15. gérer les annonces:
  16. 16. gérer les commentaires:
  17. 17. gérer le compte:
  18. 18. gérer les profils:
  19. 19. gérer les promotions:
  20. 20. Le Diagramme de Classe:
  21. 21. Partie II: les Moyens Techniques:
  22. 22. Les langages informatiques
  23. 23. Partie III: Implémentation de l’application :
  24. 24. L’environnement du développement
  25. 25. Dans ce qui suit, on va présenter quelques captures d’ interfaces de notre application web E-commerce et annonces .
  26. 26. Formulaire d’authentification Grâce à cette option l’utilisateur peut créer son propre compte ou bien récupérer son Mot de Passe !
  27. 27. Formulaire d’inscription:  cette page permet au internaute de créer son propre compte client, il contient un formulaire qui permet de saisir les cordonnées, il contient aussi des contrôles de validation et en click sur le bouton valider, on vérifie si le login existe déjà dans la table client de la base de données
  28. 28. Page d’accueil dans cette page, des produits de plusieurs catégories sont affichés ainsi qu’un menu qui permet de faciliter la navigation en site, plus un formulaire de connexion Dont le client peut s’authentifier avec son login et son mot de passe
  29. 29. Les détails d’un produit Dans cette page le client peut consulter les détails d’un produit quelconque Et l’ajouter au panier en cliquant sur le bouton Ajouter au panier
  30. 30. Formulaire de panier cette fenêtre affiche le nombre d’articles ainsi que le montant total . A partir de cette page l’internaute peut gérer les produits qu’il a ajouté au panier ; Il peut modifier la quantité, supprimer un produit, réduire la quantité d’un produit, valider son panier et passer la commande.
  31. 31. Récupérer le mot de passe Dans ce formulaire, le client saisit les informations demandés pour lui envoyer son mot de passe à sa boite
  32. 32. PASSER UNE ANNONCE Pour déposer une annonce, le client doit être authentifié, après il remplit le formulaire
  33. 33. Consulter les annonces Cette page permet d’afficher les annonces publiés par les clients et validées par l ’administrateur
  34. 34. Détails d’une annonce et l’ajout d’un commentaire Cette page permet de consulter les détails des annonces savoir les informations de client ainsi qu’un formulaire pour commenter cette annonce mais à condition que la personne qui commente soit authentifiée.
  35. 35. L’affichage des commentaires Ce contrôle permet d’afficher les commentaires publiés dans une annonce
  36. 36. Les catégories des produits Ce menu présente la liste de toutes les catégories et au click sur une catégorie, l’internaute se redirige vers la page des produits de la catégorie sélectionnée.
  37. 37. Gestion de Compte 1/Modification des information : Ce formulaire a pour fonction la modification des informations de client authentifié en cours
  38. 38. 2/Modification de photo: Cette image présente la photo de client authentifié et il peut la modifier en cliquant sur le bouton de fileUpload « choose File » après une fenêtre va être affichée et il choisit sa nouvelle photo
  39. 39. 3/Modification de mot de passe Ce petit formulaire permet au client authentifié de modifier son mot de passe en entrant l’ancien et après il valide
  40. 40. Formulaire de Contact Pour contacter l’administrateur du site, l’internaute ou client doit remplir ce formulaire
  41. 41. Gestion administrative 1-Les Annonces: Cette image présente la page d’administration et effectivement la gestion des annonces, c’est à administrateur maintenant de gérer les annonces comme c’est marqué dans la photo
  42. 42. 2-Les Promotions: Cette image présente la page d’administration et effectivement la gestion des promotions, c’est l’administrateur qui gère les promotions comme c’est marqué dans la photo
  43. 43. 3-Les commentaires: Cette image présente la page d’administration(la même principe que les deux images précédentes) et effectivement la gestion des commentaires, c’est à administrateur maintenant de gérer les commentaires comme c’est marqué dans la photo
  44. 44. 4-Les Produits: Cette image présente la page d’administration et effectivement la gestion des produits, c’est administrateur qui gère les produits comme c’est marqué dans la photo
  45. 45. 5-Les Profils: Cette image présente la page d’administration et effectivement la gestion des profils d’utilisateurs, c’est l’administrateur qui gère les profils des utilisateurs de l’application comme c’est marqué dans la photo
  46. 46. Conclusion  Finalement Ce projet nous a donné une chance de nous sensibiliser en méthodes de travail adéquates et appropriées pour aboutir à un résultat à la hauteur de nos aspirations et celle de nos formateurs. Certes, on a été confronté à quelques obstacles, mais grâce à notre volonté et au travail de groupe on a pu surmonter ces obstacles et aboutir à ce travail.  En outre Ce travail nous a permis de mettre en oeuvre et de consolider nos acquis et de remédier à nos lacunes.
  47. 47. Merci pour votre Attention!

×