Bienvenue dans ce second projet, après vos exploits chez Junior Conseil Triper, un chasseur de tête vous a repéré et engagé dans une start-up très prometteuse: KDF !
Vous êtes à présent le lead et le seul dev front de la boîte !
En réalité, vous n'êtes que 2 ici, vous et un développeur senior backend. Il a terminé son travail il y a de cela longtemps et attend votre travail pour intégrer visuellement toute sa logique serveur !
Vous allez devoir réaliser le rêve de cette entreprise : créer un site de e-commerce un peu spécial...
Voici la documentation de l'API : API Documentation
Stéphane, le dev backend, vous explique avec ses mots les différentes pages demandées:
"Il faudrait avoir une page d'accueil là, un truc pour voir tous les articles qu'on vend et leur prix mais pas trop d'info là non plus en fait. Parce qu'il y a aussi une autre page, tu vois là, genre si tu cliques sur un article sur la page d'accueil, bah en gros ça te redirige sur la page de l'article et là tu peux voir plein d'infos dessus comme son lieu de fabrication, sa photo en plus gros, sa description et bien sûr, de nouveau son prix! Depuis cette page ce qui serait grave cool, c'est qu'on pourra ajouter cet article au panier!"
"AH ouais je t'ai pas dit, le panier. Il faut aussi une page pour que tu puisses voir ton panier, là-dessus mon serveur t'aidera pas, utilise le local storage, mais je t'apprends rien ! Depuis cette page, tu pourras rajouter des articles, genre tu vois si tu as déjà un article, bah tu peux augmenter ou diminuer son nombre, mais pas rajouter de VRAIS nouveaux articles, bref tu as compris haha. Et aussi bien sûr, pouvoir enlever un article de ton panier!"
"Bref ! C'est pas tout, mais après tu auras aussi un bouton "valider ma commande". Bien sûr, avant ça, tu devras faire remplir à l'utilisateur un formulaire de contact, email, adresse, nom de rue, et nom + prénom, la classique ! Tu envoies ensuite ta commande sous la forme indiquée dans ma documentation à mon API ! Moi je te renverrai un id de commande et la date estimée d'arrivée des produits!"
"Oh et aussi ! On n'est pas des sauvages, donc cet id là, tu vas l'afficher à l'utilisateur dans un pop-up, afin de lui confirmer la bonne reception de sa commande"
"Voili, voilou, je te laisse t'occuper de l'UI/UX et des maquettes. En vrai, c'est un gros POC, on n'attend pas un truc de fou, tant que ça marche et que ce n'est pas trop moche c'est good !"
- Libre à vous de choisir le design de votre site ! Vous pouvez vous inspirer de sites existants, ou bien créer votre propre design.
- Affichage de la liste des produits
- Affichage d'un produit
- Ajout d'un produit au panier
- Suppression d'un produit du panier
- Modification de la quantité d'un produit dans le panier
- Envoi des informations du formulaire au serveur
- Affichage d'un pop-up de confirmation de commande
- Affichage de la page de confirmation de commande
- Le code devra être indenté et commenté.
- Le code devra être responsive.
- Le code devra être séparé en plusieurs fichiers.
- Le code devra être versionné avec git.
- Le code devra être hébergé sur une Github Page.
- Interdiction d'utiliser des librairies externes. (sauf Axios)
- Utilisation de SASS.
- Utilisation de Tailwind.
- Atteindre un score de 95+ de SEO/Performance/Accessibilité sur Lighthouse.
- Utilisation de Docker.
- Votre repository avec le code source.
- Un lien vers votre Github Page.
Vous avez jusqu'au 10 Mars 2024, 23h42 pour rendre votre projet.