Le but de ce projet est de réaliser un petit ecommerce sur le thème que vous souhaitez. Votre projet devra permettre la gestion simple de produit, l'achat de ces derniers ainsi que la gestion des commandes réalisées sur celui par le/les administrateur du site.
Vous devrez tout d'abord réaliser une API en symfony permettant de réaliser un certain nombre d'action sur votre ecommerce.
Voici les spécifications de l'API:
- Un système de connexion (l'ajout d'utilisateur est libre mais doit se faire de façon cachée étant donnée que nous ne voulons pas que n'importe qui puisse s'inscrire et être administrateur du site)
- Un back office accessible uniquement lorsque l'on on est connecté
- Le back office devra permettre:
- la création/édition/suppression d'un produit depuis le back office
- Permettre le listing des produits depuis le back office
- Avoir le listing des commandes réalisée sur le site
- Voir le détail d'une commande (informations client, produits achetés, montant du paiement,etc...)
- Permettre à un utlisateur de passer une commande:
- Listings de produits (avec une possiblité de filtrer les produits par différent critère)
- Ajout des produits dans le panier
- Ajout des infomations du client (nom/prénom/email par exemple)
- Payer et valider la commande(le paiement sera simulé dans votre cas)
Bonus: Permettre depuis le back office pour chaque commande de télécharger une facture en format PDF.
Vous devez reproduire la maquette ci-dessous le plus fidèlement possible en HTML/CSS. Votre code devra être propre, bien indenté et valide W3C. Le client ne vous ayant pas fourni de maquette responsive, c'est à vous d'adapter correctement les éléments pour un affichage optimal et cohérent sur toutes les tailles d'écran.
Maquette: https://www.figma.com/file/P5bnnWy0m3b6F5d12jiXhH/E-commerce-rattrapage-2022?node-id=1%3A5045
En utilisant l’API Symfony et l’intégration que vous avez produit au préalable, vous devez y ajouter une couche ReactJS. Pour ce faire l’ensemble du projet doit être fonctionnel et connecté à l’API Symfony en gérant ces différents cas:
- L’ensemble des routes doit être géré par react-router
- Avoir des routes restreintes en fonction de l’état de l’utilisateur (S’il est connecté, s’il est admin…)
- Stocker l’ensemble des données de l’API dans redux (les produits, le compte courant)
- Stocker les données du panier dans redux afin de faire transiter les données plus aisément
Si vous avez des questions sur le sujet n'hésitez pas à contacter les intervenants directement sur discord.
Symfony: @Manapyzz
HTML/CSS: @Medrupaloscil
ReactJS: @Emir
Bon courage !