Kathecat4 - Boutique E-commerce & Commissions

Projet complet de site e-commerce pour l'illustratrice Kathecat4, incluant la vente de produits, la gestion des commissions artistiques, un système de tickets, et un tableau de bord administrateur complet.

🚀 Architecture Technique

Backend (API REST)

• Langage : Rust 2021
• Framework : Actix-web 4
• Base de données : MongoDB 7+ (NoSQL)
• Authentification : JWT avec hachage bcrypt
• Upload de fichiers : Multipart avec stockage local
• Intégration Stripe : Payment Intents et Stripe Connect
• Email : Lettre (SMTP)
• Compression ZIP : Zip-rs

Frontend (Application Web)

• Framework : Nuxt 4 (Vue 3)
• Gestion d'état : Pinia
• Design System : Couleurs mauve/rose/violet/peach
• Typographie : Nunito
• Responsive : Mobile-first

📦 Fonctionnalités Principales

1. Boutique E-commerce

• Catalogue produits avec filtres par catégorie
• Panier persistant avec ajout/suppression/quantité
• Passage commande avec statuts (pending, paid, shipped)
• Paiement simulé (prêt pour Stripe)
• Tracking de livraison

2. Système de Commissions (Complet)

• Création de commission par le client
• Chat intégré par commission (messages + pièces jointes)
• Devis détaillé avec calculs TVA (HT/TTC)
• Acceptation/refus de devis par le client
• Demande de paiement (acompte ou total)
• Statuts personnalisables (ex: En production, Contrôle qualité)
• Upload de fichiers par l'admin
• Liens de téléchargement avec expiration (24h)
• Archives ZIP pour téléchargement multiple
• Notifications email automatiques

3. Tickets Support

• Ouverture de ticket par client
• Réponses client/admin
• Suivi des échanges

4. Administration

• Dashboard complet (produits, commandes, tickets, commissions)
• Gestion multi-vendeurs
• Catégories (CRUD)
• Upload d'images pour produits
• Configuration globale des commissions

5. Profil Utilisateur

• Compte client avec historique
• Rôles : customer / admin
• Dashboard personnel

🎨 Design System

Palette de Couleurs

• Fond : Pêche clair #F6D9BB
• Mauve : #650A45 (principal)
• Rose : #C33C89 (accent)
• Rose vif : #FF78E9
• Rose clair : #E597E7
• Violet foncé : #35045D
• Violet clair : #6B09C2
• Periwinkle : #BDC3FF
• Jaune : #FAEC71 (accentuation)
• Pêche : #E7AF97

Style

• Border-radius : 16px (arrondi moderne)
• Typographie : Nunito (400/600/700/800)
• Ombres : Douces et profondes

🚦 Prérequis

Logiciels Nécessaires

• MongoDB 7+ (Docker recommandé)
• Rust (stable, edition 2021) - https://rustup.rs
• Node.js 18+ et npm/bun
• Bun (recommandé pour le frontend)

🚀 Démarrage Rapide

1. Cloner le projet

git clone <repository-url>
cd kathecat4

2. Lancer tout d'un coup

./run.sh start

Ce script lance :

• MongoDB (sur port 27017)
• Backend Rust (sur port 8080)
• Frontend Nuxt (sur port 3000)

3. Accéder à l'application

• Frontend : http://localhost:3000
• API : http://localhost:8080
• Compte admin : admin@kathecat4.local / admin123

4. Créer le compte admin (si besoin)

./run.sh setup-admin

📂 Structure du Projet

kathecat4/
├── backend/                 # API Rust
│   ├── Cargo.toml
│   ├── src/
│   │   ├── main.rs         # Point d'entrée
│   │   ├── config.rs       # Configuration
│   │   ├── db.rs           # Connexion MongoDB
│   │   ├── models/         # Modèles de données
│   │   ├── handlers/       # Routes API
│   │   └── middleware/     # Auth middleware
│   └── uploads/            # Fichiers uploadés
│
├── frontend/               # Application Nuxt
│   ├── app.vue
│   ├── nuxt.config.ts
│   ├── assets/main.css     # Design System
│   ├── layouts/
│   ├── pages/              # Routes
│   ├── stores/             # Pinia (auth, cart)
│   ├── composables/        # Composables Vue
│   └── components/         # Composables UI
│
├── mongo_data/             # Données MongoDB
├── .pids/                  # PIDs des processus
├── run.sh                  # Script de lancement
└── README.md

🛣️ Routes API Principales

Authentification

• POST /api/auth/register - Créer compte
• POST /api/auth/login - Connexion
• GET /api/auth/me - Profil

Produits

• GET /api/products - Liste
• GET /api/products/:id - Détail
• POST /api/admin/products - Créer (admin)
• PUT /api/admin/products/:id - Modifier (admin)
• DELETE /api/admin/products/:id - Supprimer (admin)

Panier

• POST /api/cart - Créer/récupérer
• POST /api/cart/items - Ajouter article
• PUT /api/cart/items/:id - Modifier quantité
• DELETE /api/cart/items/:id - Supprimer

Commandes

• POST /api/orders - Passer commande
• GET /api/orders - Mes commandes
• GET /api/admin/orders - Toutes (admin)
• PUT /api/admin/orders/:id/status - Changer statut (admin)

Tickets

• POST /api/tickets - Ouvrir ticket
• GET /api/tickets - Mes tickets
• POST /api/tickets/:id/messages - Répondre
• GET /api/admin/tickets - Tous (admin)

Commissions

• POST /api/commissions - Créer
• GET /api/commissions - Mes commissions
• GET /api/commissions/:id - Détail
• POST /api/commissions/:id/quote - Créer devis (admin)
• PUT /api/commissions/:id/respond-quote - Accepter/refuser
• POST /api/commissions/:id/request-payment - Demander paiement (admin)
• POST /api/commissions/:id/messages - Envoyer message
• GET /api/commissions/:id/messages - Lister messages
• POST /api/commissions/:id/upload - Uploader fichier (admin)
• GET /api/commissions/:id/files - Lister fichiers
• GET /api/commissions/:id/download/* - Télécharger

🔧 Configuration

Variables d'Environnement (Backend)

MONGODB_URI=mongodb://localhost:27017
DATABASE_NAME=kathecat4
JWT_SECRET=dev-secret-change-in-production
SERVER_HOST=127.0.0.1
SERVER_PORT=8080
ADMIN_EMAIL=admin@kathecat4.local
ADMIN_PASSWORD=admin123

MongoDB Atlas

Pour utiliser MongoDB Atlas (cloud), modifiez MONGODB_URI :

export MONGODB_URI="mongodb+srv://<user>:<password>@cluster.xxxxx.mongodb.net/?retryWrites=true&w=majority"

🎯 Utilisation

Pour les Clients

1. Créer un compte ou se connecter
2. Parcourir le catalogue
3. Ajouter au panier
4. Passer commande
5. Suivre les commandes dans le dashboard
6. Ouvrir des tickets si besoin
7. Commander des commissions personnalisées

Pour les Vendeurs

1. Créer un compte
2. Demander l'approbation vendeur
3. Ajouter des produits
4. Gérer les commandes

Pour l'Admin

1. Se connecter avec le compte admin
2. Gérer les produits, catégories, vendeurs
3. Suivre les commandes et statuts
4. Gérer les tickets support
5. Traiter les commissions (devis, paiements, fichiers)
6. Configurer les options globales

📄 Statut Légal

Loi Facturation Électronique 2026

À partir du 1er septembre 2026, les fournisseurs devront envoyer des factures électroniques. Recommandé : utiliser Indy, Abby ou Tiime pour la gestion.

Documents Requis

• Mentions légales
• CGU (Conditions Générales d'Utilisation)
• CGV (Conditions Générales de Vente)
• Politique de confidentialité
• Page "À propos"

🔄 Déploiement Production

Options

1. Backend : Railway, Fly.io, Render, ou serveur dédié
2. Frontend : Vercel, Netlify, ou avec Nuxt Nitro
3. Base de données : MongoDB Atlas
4. Stockage fichiers : S3, Cloudinary (recommandé pour production)

Étapes

1. Configurer les variables d'environnement production
2. Builder le frontend : bun run build
3. Builder le backend : cargo build --release
4. Déployer sur les plateformes choisies
5. Configurer le nom de domaine et SSL

🐛 Débogage

Commandes Utiles

# Vérifier les logs
./run.sh status

# Redémarrer tout
./run.sh restart

# Arrêter tout
./run.sh stop

# Reconstruire le frontend
./run.sh build

Problèmes Courants

• Port déjà utilisé : Changer SERVER_PORT ou devServer.port
• MongoDB ne démarre pas : Vérifier que le dossier mongo_data existe
• Build frontend échoue : Supprimer .nuxt et node_modules, réinstaller

📈 Évolutions Futures

Améliorations Prévues

• Intégration Stripe complète
• Système de reviews/notes
• Programme fidélité
• Multi-langues
• Mode sombre
• Upload vers Cloudinary/S3
• API livraison (Colissimo, Mondial Relay)
• Emails transactionnels
• Analytics
• SEO amélioré

Fonctionnalités Suggérées

• Wishlist
• Comparateur de produits
• Ventes flash
• Codes promo
• Parrainage
• Abonnements

🤝 Contribuer

1. Fork le projet
2. Créer une branche (git checkout -b feature/amazing-feature)
3. Commit les changements (git commit -m 'Add amazing feature')
4. Push sur la branche (git push origin feature/amazing-feature)
5. Ouvrir une Pull Request

📄 License

Propriété de Kathecat4 - Tous droits réservés.

🙏 Remerciements

• Merci à tous les contributeurs et testeurs
• Merci à la communauté Rust et Nuxt
• Merci aux artistes et créateurs qui font vivre cette plateforme

---

Dernière mise à jour : 2024

Contact : support@kathecat4.com