mes-budgets-participatifs/SETUP.md

Guide de Configuration - Mes Budgets Participatifs

🚀 Configuration Rapide

1. Installation des dépendances

npm install

2. Configuration Supabase

Étape 1 : Créer un projet Supabase

1. Allez sur supabase.com
2. Créez un nouveau projet
3. Notez votre URL et votre clé anon dans les paramètres du projet

Étape 2 : Configurer la base de données

1. Dans votre projet Supabase, allez dans SQL Editor
2. Copiez et exécutez le contenu du fichier supabase-schema.sql
3. Vérifiez que les tables sont créées dans Table Editor

Étape 3 : Configurer les variables d'environnement

1. Copiez le fichier env.example vers .env.local
2. Remplacez les valeurs par vos vraies informations Supabase :

NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here

3. Lancer l'application

npm run dev

L'application sera accessible sur http://localhost:3000

📊 Structure de la Base de Données

Tables créées automatiquement :

campaigns

• id : Identifiant unique (UUID)
• title : Titre de la campagne
• description : Description détaillée
• status : État (deposit, voting, closed)
• budget_per_user : Budget par participant (€)
• spending_tiers : Paliers de dépenses (ex: "10,25,50,100")
• created_at : Date de création
• updated_at : Date de modification

propositions

• id : Identifiant unique (UUID)
• campaign_id : Référence vers la campagne
• title : Titre de la proposition
• description : Description détaillée
• created_at : Date de création

participants

• id : Identifiant unique (UUID)
• campaign_id : Référence vers la campagne
• first_name : Prénom
• last_name : Nom
• email : Adresse email
• created_at : Date de création

🔧 Fonctionnalités Disponibles

Page d'accueil (/)

• Présentation de l'application
• Bouton d'accès à l'administration
• Design moderne et responsive

Page d'administration (/admin)

• Liste des campagnes : Affichage de toutes les campagnes avec leur statut
• Créer une campagne : Formulaire complet avec validation
• Ajouter des propositions : Par campagne
• Ajouter des participants : Par campagne
• Indicateurs visuels : Statuts colorés pour chaque campagne

Modals interactifs

• Création de campagne : Titre, description, budget, paliers, statut
• Ajout de proposition : Titre et description
• Ajout de participant : Prénom, nom, email

🎨 Interface Utilisateur

Design System

• Framework CSS : Tailwind CSS
• Composants : Headless UI pour les modals
• Icônes : Heroicons
• Couleurs : Palette moderne avec indigo comme couleur principale

Responsive Design

• Mobile-first approach
• Adaptation automatique sur tous les écrans
• Navigation intuitive

🚀 Déploiement

Vercel (Recommandé)

1. Connectez votre repo GitHub à Vercel
2. Configurez les variables d'environnement dans Vercel
3. Déployez automatiquement

Variables d'environnement pour la production

NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key

🔍 Dépannage

Erreurs courantes

"supabaseUrl is required"

• Vérifiez que vos variables d'environnement sont correctement définies
• Redémarrez le serveur de développement

Erreurs de build

• Vérifiez que tous les composants sont correctement importés
• Assurez-vous que les types TypeScript sont corrects

Problèmes de base de données

• Vérifiez que le script SQL a été exécuté correctement
• Contrôlez les politiques RLS dans Supabase

Logs de développement

# Voir les logs en temps réel
npm run dev

# Build de production
npm run build

# Lancer en production
npm run start

📈 Prochaines Étapes

Fonctionnalités prévues

• Authentification des utilisateurs
• Interface de vote pour les participants
• Résultats et statistiques
• Notifications par email
• Gestion des permissions

Améliorations techniques

• Types TypeScript stricts pour Supabase
• Tests unitaires et d'intégration
• Optimisation des performances
• PWA (Progressive Web App)

🤝 Support

Pour toute question ou problème :

1. Vérifiez ce guide de configuration
2. Consultez la documentation Supabase
3. Vérifiez les logs de développement
4. Créez une issue sur GitHub si nécessaire

---

Application prête à l'emploi pour la démocratie participative ! 🗳️