nextjs ecommerce

L'application est en ligne et fonctionne à

https://nextjs-ecommerce-typescript.vercel.app/

• n'oubliez pas de laisser une étoile ! :)

Auteurs

• Abdallah Moiz

Caractéristiques

NOTE

• Le tableau de bord administrateur ne vous est accessible que si vous le clonez, vous ne pouvez pas vous inscrire au compte administrateur. J'ai ajouté des produits et des catégories factices.

Système de connexion multi-utilisateurs

• Connexion / Inscription ✔
• Mot de passe oublié ✔
• Validation JWT sur chaque demande autorisée ✔
• Validation des autorisations pour l'accès administrateur et l'accès client ✔

PANNEAU D'ADMINISTRATION

• Ajouter un produit ✔
• voir le produit ✔
• Supprimer un produit ✔
• mettre à jour le produit ✔
• Ajouter une catégorie ✔
• afficher la catégorie (tableaux de données) ✔
• mettre à jour la catégorie ✔
• Supprimer la catégorie ✔
• catégorie de recherche Par nom ✔
• rechercher un produit par catégorie Nom ✔
• Gérer la livraison des commandes ✔
• Liste des commandes en attente ✔
• Liste de commandes complétée ✔

Client

• Voir le produit et la catégorie ✔
• voir le produit lié à une catégorie spécifique ✔
• afficher le détail des pages dynamiques avec breadcamp ✔
• Ajouter le produit au panier ✔
• Supprimer le produit du panier ✔
• Augmenter Diminuer la quantité d'articles du panier ✔ (SI la quantité en stock du produit est inférieure à la quantité de votre panier, vous ne pouvez pas augmenter cette quantité de produit)
• Alerter si la quantité en stock n'est pas disponible ✔
• Ajouter votre produit préféré à vos favoris ✔
• supprimer le produit des favoris ✔
• Commander un produit ✔
• Après avoir créé une commande, le produit existant dans le panier pour l'utilisateur actuel sera effacé ✔
• suivre l'état de la commande ✔
• Afficher les détails de la commande ✔

Note

Plus de fonctionnalités seront ajoutées avec le temps

Technologie

• Suivantjs 13
• Manuscrit
• CSS vent arrière
• Boîte à outils Redux
• validation joi
• mongoDB
• Hooks SWR pour récupérer l’API

Variables d'environnement

Pour exécuter ce projet, vous devrez ajouter les variables d'environnement suivantes à votre fichier .env

DB_URI = Votre URL mongoDB

JWT_SECREAT = Votre clé JWT_SECREAT personnalisée

NEXT_PUBLIC_API_BASE_URL = URL de base pour localhost => http://localhost:3000

Installation

Installer mon projet avec npm

  npm install
  npm run dev (for development server)
  npm run build (for Production)
  npm run preview (To View Production Server )

Captures d'écran

Tableau de bord d'administration

Administrateur Ajouter un produit

Administrateur Ajouter une catégorie

Catégorie de vue administrateur

Produit d'affichage administrateur

Produit de recherche d'administrateur avec nom de catégorie

Catégorie de recherche d'administrateur avec le nom de la catégorie

Liste des commandes en attente

Liste de commandes complétée

Page de destination

voir le produit d'une catégorie spécifique avec Dynamic Breadcamp

voir le produit de détail avec Dynamic Breadcamp

Page du panier

Alerter SI la quantité d'article n'est pas disponible en stock

Produits préférés

Supprimer les produits favoris

Rechercher des produits favoris avec le nom du produit

Commander un produit

Suivre les commandes

Vérifier les détails de la commande