# ⚡ QuickStart V2.1 - Nouvelles Fonctionnalités

**Temps de lecture:** 5 minutes  
**Temps de setup:** 15 minutes

---

## 🎯 Objectif

Configurer et tester les 4 nouveaux modules en 15 minutes.

---

## 📋 Checklist Rapide

### 1. Installation (2 min)

```bash
cd MyRoadTrip
pnpm install
```

### 2. Configuration APIs (5 min)

```bash
# Copier .env
cp apps/api/.env.example apps/api/.env

# Éditer avec vos clés
nano apps/api/.env
```

**Minimum requis:**
```bash
# Existant (déjà configuré)
FIREBASE_PROJECT_ID=your-project
OPENAI_API_KEY=sk-...
STRIPE_SECRET_KEY=sk_test_...
REDIS_HOST=localhost

# Nouveaux (gratuit, 5 min setup)
OPENWEATHER_API_KEY=your_weather_key      # https://openweathermap.org/api
# Les autres sont optionnels pour démarrer
```

### 3. Démarrer Services (2 min)

```bash
# Terminal 1: Backend
cd apps/api
pnpm dev

# Terminal 2: Frontend
cd apps/web
pnpm dev

# Terminal 3: Redis (si local)
redis-server
```

### 4. Tests Rapides (5 min)

#### A. Weather API ☁️

```bash
# Test météo Paris
curl "http://localhost:3000/api/weather?lat=48.8566&lng=2.3522"
```

**Résultat attendu:**
```json
{
  "location": {"name": "Paris", "lat": 48.8566, "lng": 2.3522},
  "current": {
    "temperature": 15,
    "condition": "clouds",
    "windSpeed": 20
  },
  "daily": [...]
}
```

#### B. Budget API 💰

```bash
# Créer budget test
curl -X POST http://localhost:3000/api/budget/create \
  -H "Content-Type: application/json" \
  -d '{
    "planId": "test-plan",
    "totalBudget": 1000,
    "currency": "EUR",
    "categories": [
      {"id":"1","name":"Transport","allocated":400}
    ]
  }'
```

#### C. Analytics API 📊

```bash
# Track event test
curl -X POST http://localhost:3000/api/analytics/track \
  -H "Content-Type: application/json" \
  -d '{
    "userId": "test-user",
    "sessionId": "test-session",
    "event": "test_event",
    "source": "web",
    "version": "2.1.0"
  }'
```

#### D. Currency API 🌍

```bash
# Test conversion
curl "https://api.exchangerate.host/convert?from=USD&to=EUR&amount=100"
```

---

## 🚀 Utilisation Rapide

### Weather Module

```typescript
// Frontend usage
import { weatherService } from '@/services/weather'

// Météo pour une étape
const weather = await weatherService.getLocationWeather(48.8566, 2.3522)
console.log(`Temp: ${weather.current.temperature}°C`)

// Analyse complète route
const analysis = await weatherService.analyzeRouteWeather(planId, stages)
if (analysis.overallRisk === 'high') {
  alert('⚠️ Conditions météo difficiles prévues!')
}
```

### Budget Module

```typescript
// Frontend usage
import { budgetService } from '@/services/budget'

// Créer budget
const budget = await budgetService.create({
  planId: 'plan-123',
  totalBudget: 2000,
  currency: 'EUR'
})

// Ajouter dépense partagée
const expense = await budgetService.addExpense(budget.id, {
  amount: 120,
  title: 'Restaurant',
  splitType: 'equal',
  splits: [
    { userId: 'user-1', userName: 'Alice' },
    { userId: 'user-2', userName: 'Bob' }
  ]
})
// → Chacun doit 60€

// Voir qui doit combien
const balances = await budgetService.getBalance(budget.id)
```

### Analytics Module

```typescript
// Frontend usage
import { analyticsService } from '@/services/analytics'

// Track custom event
analyticsService.track('plan_created', {
  planId: plan.id,
  stageCount: plan.stages.length,
  isPublic: plan.isPublic
})

// Track page view
analyticsService.trackPageView('/plans/create')

// Track conversion
analyticsService.trackConversion('subscription', {
  plan: 'pro',
  amount: 9.99
})
```

### Social Module

```typescript
// Frontend usage
import { socialService } from '@/services/social'

// Follow user
await socialService.follow(userId)

// Get feed
const feed = await socialService.getFeed()

// Add comment
await socialService.comment(planId, 'Great trip! 🚀')

// React to plan
await socialService.react(planId, 'love')
```

---

## 📱 Frontend Components

### Weather Widget (À créer)

```vue
<template>
  <div class="weather-widget">
    <div v-if="loading">Loading weather...</div>
    <div v-else-if="weather">
      <h3>{{ weather.location.name }}</h3>
      <div class="current">
        <span class="temp">{{ weather.current.temperature }}°C</span>
        <span class="condition">{{ weather.current.condition }}</span>
      </div>
      <div v-if="weather.current.alerts" class="alerts">
        <div v-for="alert in weather.current.alerts" :key="alert.id">
          ⚠️ {{ alert.event }}
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { weatherService } from '@/services/weather'

const weather = ref(null)
const loading = ref(true)

onMounted(async () => {
  weather.value = await weatherService.getLocationWeather(48.8566, 2.3522)
  loading.value = false
})
</script>
```

### Budget Dashboard (À créer)

```vue
<template>
  <div class="budget-dashboard">
    <div class="summary">
      <div class="stat">
        <span class="label">Budget Total</span>
        <span class="value">{{ summary.totalBudget }}€</span>
      </div>
      <div class="stat">
        <span class="label">Dépensé</span>
        <span class="value">{{ summary.totalSpent }}€</span>
      </div>
      <div class="stat">
        <span class="label">Restant</span>
        <span class="value" :class="{ warning: summary.overBudget }">
          {{ summary.remaining }}€
        </span>
      </div>
    </div>
    
    <q-linear-progress 
      :value="summary.percentageSpent / 100" 
      :color="summary.overBudget ? 'negative' : 'primary'"
    />
    
    <div v-if="summary.overBudget" class="warning">
      ⚠️ Dépassement projeté: {{ summary.projectedTotal }}€
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { budgetService } from '@/services/budget'

const summary = ref(null)

onMounted(async () => {
  summary.value = await budgetService.getSummary(props.budgetId)
})
</script>
```

---

## 🔍 Vérification Santé

### Health Check Endpoints

```bash
# Check all modules
curl http://localhost:3000/api/health

# Expected response:
{
  "status": "healthy",
  "modules": {
    "weather": "ok",
    "budget": "ok", 
    "analytics": "ok",
    "social": "ok"
  },
  "apis": {
    "openweather": "connected",
    "exchangerate": "connected",
    "mixpanel": "optional",
    "redis": "connected",
    "firestore": "connected"
  }
}
```

---

## 🐛 Troubleshooting Rapide

### Weather ne fonctionne pas

**Symptôme:** `OPENWEATHER_API_KEY not configured`

**Fix:**
1. Obtenir clé gratuite: https://openweathermap.org/api
2. Ajouter dans `apps/api/.env`: `OPENWEATHER_API_KEY=your_key`
3. Redémarrer backend: `pnpm dev`

### Currency conversion échoue

**Symptôme:** Conversion retourne montant original

**Fix:** Normal avec API gratuite sans clé. Pour plus:
1. Obtenir clé Fixer.io: https://fixer.io/
2. Ajouter: `FIXER_API_KEY=your_key`

### Redis connection refused

**Fix:**
```bash
# Mac
brew services start redis

# Linux
sudo systemctl start redis

# Vérifier
redis-cli ping  # → PONG
```

### Analytics events not tracking

**Fix:**
1. Vérifier `ENABLE_ANALYTICS=true` dans `.env`
2. Check logs: `tail -f apps/api/logs/app.log | grep analytics`
3. Mixpanel est optionnel - events sont aussi dans Firestore

---

## 📚 Documentation Complète

### Guides Détaillés

| Guide | Usage |
|-------|-------|
| **`docs/GLOBAL_ENHANCEMENTS.md`** | Vue complète tous modules |
| **`docs/INNOVATIVE_FEATURES.md`** | Features détaillées avec exemples |
| **`docs/INSTALLATION_GUIDE.md`** | Setup complet, troubleshooting |
| `SESSION_SUMMARY_V2_1.md` | Résumé session, stats |

### API Documentation

```bash
# Swagger UI (quand disponible)
http://localhost:3000/docs

# Ou voir:
docs/GLOBAL_ENHANCEMENTS.md → Section "API Endpoints"
```

---

## ✅ Checklist Succès

Vous êtes prêt si:

- [x] Backend démarre sans erreurs
- [x] Frontend accessible sur http://localhost:5173
- [x] Weather API répond avec données météo
- [x] Budget API peut créer budgets
- [x] Analytics track events
- [x] Redis connecté (ping → pong)
- [x] Firestore connecté

---

## 🎯 Prochaines Étapes

### Aujourd'hui (1h)
1. Créer premier plan avec météo
2. Ajouter budget et dépenses
3. Tester conversion devises
4. Explorer analytics dashboard

### Cette Semaine
1. Créer components frontend
2. Intégrer weather widget dans plans
3. Créer budget dashboard
4. Tests utilisateurs

### Ce Mois
1. Deploy staging
2. Tests E2E
3. Launch beta
4. Collecter feedback

---

## 💡 Tips

### Performance

```bash
# Activer cache Redis
ENABLE_REDIS_CACHE=true

# Réduire logs en prod
LOG_LEVEL=error
```

### Développement

```bash
# Hot reload backend
cd apps/api
pnpm dev

# Watch mode tests
pnpm test:watch
```

### Débogage

```bash
# Logs détaillés
LOG_LEVEL=debug pnpm dev

# Check Redis keys
redis-cli keys "*weather*"
redis-cli keys "*budget*"
```

---

## 🚀 Go Live Checklist

Avant production:

- [ ] Toutes clés API configurées (prod keys)
- [ ] Tests E2E passent
- [ ] Performance testée (load testing)
- [ ] Monitoring configuré (Sentry)
- [ ] Backup database configuré
- [ ] Rate limiting activé
- [ ] HTTPS activé
- [ ] Analytics tracking opérationnel

---

**Temps total:** ~15 minutes  
**Statut:** ✅ Prêt à démarrer

**Questions?** Voir `docs/INSTALLATION_GUIDE.md` pour détails complets.
