# Mes Budgets Participatifs

Une application web moderne pour gérer des campagnes de budgets participatifs, permettant aux collectifs de décider collectivement de leurs dépenses budgétaires.

## 🚀 Technologies utilisées

- **Frontend**: Next.js 14 avec TypeScript et App Router
- **Styling**: Tailwind CSS + Headless UI
- **Base de données**: PostgreSQL via Supabase
- **Authentification**: Supabase Auth (prévu pour les futures versions)
- **Icons**: Heroicons

## 📋 Fonctionnalités

### ✅ Implémentées
- Page d'accueil avec présentation de l'application
- Interface d'administration pour gérer les campagnes
- Création de nouvelles campagnes avec tous les paramètres
- Ajout de propositions à une campagne
- Ajout de participants à une campagne
- Gestion des états de campagne (dépôt, vote, fermé)
- Interface moderne et responsive

### 🔄 À venir
- Authentification des utilisateurs
- Interface de vote pour les participants
- Résultats et statistiques des votes
- Notifications par email
- Gestion des permissions

## 🛠️ Installation

### Prérequis
- Node.js 18+ 
- npm ou yarn
- Compte Supabase

### 1. Cloner le projet
```bash
git clone <votre-repo>
cd mes-budgets-participatifs
```

### 2. Installer les dépendances
```bash
npm install
```

### 3. Configuration Supabase

#### Créer un projet Supabase
1. Allez sur [supabase.com](https://supabase.com)
2. Créez un nouveau projet
3. Notez votre URL et votre clé anon

#### Configurer la base de données
1. Dans votre projet Supabase, allez dans l'éditeur SQL
2. Copiez et exécutez le contenu du fichier `supabase-schema.sql`

#### Configurer les variables d'environnement
Créez un fichier `.env.local` à la racine du projet :

```env
NEXT_PUBLIC_SUPABASE_URL=votre_url_supabase
NEXT_PUBLIC_SUPABASE_ANON_KEY=votre_cle_anon_supabase
```

### 4. Lancer l'application
```bash
npm run dev
```

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

## 📊 Structure de la base de données

### Table `campaigns`
- `id`: Identifiant unique (UUID)
- `title`: Titre de la campagne
- `description`: Description détaillée
- `status`: État de la campagne (`deposit`, `voting`, `closed`)
- `budget_per_user`: Budget alloué par participant (en euros)
- `spending_tiers`: Paliers de dépenses disponibles (séparés par des virgules)
- `created_at`: Date de création
- `updated_at`: Date de dernière modification

### Table `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

### Table `participants`
- `id`: Identifiant unique (UUID)
- `campaign_id`: Référence vers la campagne
- `first_name`: Prénom du participant
- `last_name`: Nom du participant
- `email`: Adresse email
- `created_at`: Date de création

## 🎨 Interface utilisateur

### Page d'accueil
- Présentation de l'application
- Bouton d'accès à l'administration
- Design moderne avec gradient et cartes informatives

### Page d'administration
- Liste des campagnes existantes
- Bouton pour créer une nouvelle campagne
- Actions rapides pour chaque campagne :
  - Ajouter une proposition
  - Ajouter un participant
- Indicateurs visuels pour les états des campagnes

### Modals
- **Création de campagne** : Formulaire complet avec validation
- **Ajout de proposition** : Titre et description
- **Ajout de participant** : Informations personnelles

## 🔧 Développement

### Structure des fichiers
```
src/
├── app/                    # Pages Next.js (App Router)
│   ├── page.tsx           # Page d'accueil
│   └── admin/             # Pages d'administration
├── components/            # Composants React réutilisables
├── lib/                   # Services et configuration
│   ├── supabase.ts       # Configuration Supabase
│   └── services.ts       # Services de données
└── types/                # Types TypeScript
    └── index.ts          # Définitions des types
```

### Scripts disponibles
```bash
npm run dev          # Lancer en mode développement
npm run build        # Construire pour la production
npm run start        # Lancer en mode production
npm run lint         # Vérifier le code avec ESLint
```

## 🚀 Déploiement

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

### Autres plateformes
L'application peut être déployée sur n'importe quelle plateforme supportant Next.js :
- Netlify
- Railway
- DigitalOcean App Platform
- AWS Amplify

## 🤝 Contribution

1. Fork le projet
2. Créez une branche pour votre fonctionnalité
3. Committez vos changements
4. Poussez vers la branche
5. Ouvrez une Pull Request

## 📝 Licence

Ce projet est sous licence MIT. Voir le fichier `LICENSE` pour plus de détails.

## 🆘 Support

Pour toute question ou problème :
1. Vérifiez la documentation Supabase
2. Consultez les issues GitHub
3. Créez une nouvelle issue si nécessaire

---

**Développé avec ❤️ pour faciliter la démocratie participative**