DIJBSOUQ

DJIB SOUQ - E-Commerce Website

Site officiel : www.djibsouq.com

Description

Site e-commerce moderne construit avec Next.js 14, TypeScript et Tailwind CSS. Le site suit la structure de navigation définie dans le sitemap.

Fonctionnalités ajoutées

• Données produits + base SQLite via Prisma (prisma/schema.prisma)
• Authentification NextAuth (credentials) + route d’inscription (/api/auth/register)
• Panier avec API REST (/api/cart) et page /panier
• Paiement Stripe (Checkout) avec mode démo si clé manquante (/api/checkout)
• CMS léger pour blocs de contenu (/api/content, page /admin pour admins)

Structure du site

• PAGE D’ACCUEIL - Page principale
• À PROPOS - Blog, Contact, Nos services
• COMMANDEZ - Livraison, Retour, Paiement, Suivi
• NOS PRODUITS - Catégories, En vedette, Collection, Détails
• MON COMPTE - Inscription, Mon compte, Profil
• SERVICES - Abonnements, Impression, Étudiants, Entreprise

Pré-requis

• Node.js 18+
• NEXTAUTH_SECRET
• (Optionnel) STRIPE_SECRET_KEY + NEXT_PUBLIC_APP_URL

Installation & Base de données

Développement local (SQLite)

npm install
# Configurer .env avec DATABASE_URL="file:./prisma/dev.db"
npm run db:push     # crée prisma/dev.db
npm run db:seed     # données de démo + compte admin (admin@djibsouq.com / admin123)
npm run dev

Ouvrez http://localhost:3000 dans votre navigateur.

Production (PostgreSQL)

Pour le déploiement sur Render, utiliser PostgreSQL au lieu de SQLite.

Déploiement sur Render

Déploiement rapide

1. Créer un compte Render et connecter votre repository GitHub/GitLab/Bitbucket

2. Déployer via Blueprint (recommandé)
   • Dans Render Dashboard, cliquez sur “New +” → “Blueprint”
   • Sélectionnez votre repository
   • Render détectera automatiquement le fichier render.yaml
   • Cliquez sur “Apply”
3. Configurer les variables d’environnement
   • NEXTAUTH_SECRET : Générez avec openssl rand -base64 32
   • DATABASE_URL et NEXTAUTH_URL sont configurés automatiquement
4. Migrer la base de données
   • Dans le Shell du service web, exécutez :

     npx prisma migrate deploy
     # Ou : npx prisma db push && npx prisma db seed
     

Consultez DEPLOYMENT.md pour un guide détaillé.

Variables d’environnement requises

Variable	Description	Exemple
DATABASE_URL	URL de connexion PostgreSQL	postgresql://user:pass@host:5432/db
NEXTAUTH_SECRET	Secret pour NextAuth	Générer avec openssl rand -base64 32
NEXTAUTH_URL	URL de l’application	https://your-app.vercel.app

Variables optionnelles

• STRIPE_SECRET_KEY - Clé secrète Stripe
• NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY - Clé publique Stripe

Build

npm run build
npm start

Technologies

• Next.js 14
• React 18
• TypeScript
• Tailwind CSS
• Prisma (SQLite)
• NextAuth
• Stripe (Checkout)