Scribd
Importer
12 vues2 pages

E-Store Ennoncé

Le projet e-store consiste à créer un site e-commerce affichant des produits à partir d'un fichier JSON et gérant un panier d'achat via le localStorage. Il comprend deux pages HTML : index.html pour afficher les produits et cart.html pour gérer le panier, avec des fonctionnalités d'ajout, de suppression et de modification des quantités. Les produits doivent rester dans le panier même après le rechargement de la page, et le projet doit être réalisé en groupe avec une date limite fixée au 10/01/2025.

Transféré par

jomnisafa4
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
12 vues2 pages

E-Store Ennoncé

Le projet e-store consiste à créer un site e-commerce affichant des produits à partir d'un fichier JSON et gérant un panier d'achat via le localStorage. Il comprend deux pages HTML : index.html pour afficher les produits et cart.html pour gérer le panier, avec des fonctionnalités d'ajout, de suppression et de modification des quantités. Les produits doivent rester dans le panier même après le rechargement de la page, et le projet doit être réalisé en groupe avec une date limite fixée au 10/01/2025.

Transféré par

jomnisafa4
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Projet e-store

Objectif : Créer un site e-commerce qui affiche une liste de produits à partir d'un fichier JSON et
permet de gérer un panier d'achat en utilisant le localStorage.

Instructions :

1. Page index.html :

• Créez une page HTML qui affiche une liste de produits.

• Les produits doivent être chargés à partir d'un fichier JSON=>il faut effectuer la
recherche

• Chaque produit doit afficher son image, son nom, son prix et un bouton "Ajouter
au panier".

• Dans la page il faut le nombre d’article total dans le panier comme ca

2. Page cart.html :

• Créez une page HTML pour afficher les produits ajoutés au panier.

• Affichez le nom, le prix et la quantité de chaque produit dans le panier.

• Avoir la possibilité d’incrémenter et de décrémenter cette quantité

• Ajoutez un bouton pour supprimer des produits du panier.

3. Utilisation de localStorage :

• Utilisez le localStorage pour enregistrer les produits ajoutés au panier =>il faut
effectuer la recherche

• Assurez-vous que les produits restent dans le panier même après le


rechargement de la page.

Vous aller suivre la structure du projet comme vous la trouverez dans le repo github

Vous allez cloner ce repo github sur vos pc et créer vos propres repositories sur vos compte
github

Voici le lien : https://github.com/houssemRouabeh/e-store-sherbrook.git


Le fichier data.js contient la liste des produits vous pouvez l’utiliser tels quel est ou bien utiliser
vos propres produits tout en gardant la même structure

export const products = [

name: "Pull Bleu", ➔ nom du produit

tag: "Pull Bleu", ➔ tag du produit

price: 15, ➔ prix du produit

incart: 0, ➔ combien de cet article existe dans le panier

Astuce :

Pour importer des donner depuis un fichier json nous avons deux methode :

- Utiliser la methode fetch de javascript


- Utiliser l’import de javascript

Vous prouvez effectuer la recherche pour trouver le moyen d’importer les données depuis un
fichier json vers votre fichier main.js

NB : le projet doit être fait par groupes (2 minimum)

Date limite : 10/01/2025

En cas de problème vous pouvez me contacter sur mon


email :[email protected]

Vous aimerez peut-être aussi