# Carrot — Dependency Decisions

> Warum welche Libraries gewählt wurden, und welche Alternativen es gibt.

---

## Mobile App (`apps/mobile`) — bereits integriert

| Package | Zweck | Warum dieses | Alternative |
|---------|-------|-------------|-------------|
| **expo** ~54 | App Framework | Vereinfacht Builds, OTA Updates, Native Module | Bare React Native (mehr Kontrolle, mehr Aufwand) |
| **expo-router** ~6 | File-based Routing | Bewährt in Hof, Deep Links out-of-the-box | React Navigation (manuell, mehr Flexibilität) |
| **react-native-reanimated** ~4 | Animationen | 60fps Animations, Worklets, Spring + Timing | Animated API (limited), Moti (wrapper) |
| **react-native-gesture-handler** ~2 | Gestures | Swipe-to-complete, Pull-to-refresh | RN Gesture API (basic) |
| **react-native-svg** 15 | SVG Rendering | Goal progress ring (animated stroke-dashoffset) | — |
| **react-native-safe-area-context** ~5 | Safe areas | Notch + home indicator awareness | — |
| **react-native-web** ~0.21 | Web export target | `expo export --platform web` produces static SPA | — |
| **@expo/metro-runtime** ~6 | Web bundler | Required for `expo export --platform web` | — |
| **@react-native-async-storage/async-storage** ^2 | Persistence | All AppData stored locally; localStorage on web | — |
| **@supabase/supabase-js** ^2 | Backend Client | Auth, DB, Storage, Realtime — ein Client | Firebase (Vendor Lock-in, US) |
| **expo-notifications** | Push + Local | Built-in Expo Support, mock scheduler today | OneSignal (mehr Features, extra SDK) |
| **expo-haptics** | Haptisches Feedback | Auf jedem Tap, Check-in, Level-Up | — |

## Landing Page (`apps/web`) — bereits integriert

| Package | Zweck | Warum |
|---------|-------|-------|
| **astro** ~5 | Static Output | Zero JS by default, schnellster LCP |

Plus Google Fonts (Bricolage Grotesque, DM Sans, JetBrains Mono) via `<link rel="stylesheet">` in Layout.

## Admin Portal (`apps/admin`) — bereits integriert

| Package | Zweck | Warum |
|---------|-------|-------|
| **astro** ^5 | Static site generator | Konsistent mit Landing, kleinere Bundle als Next.js, file-based routing |
| **@astrojs/react** ^4 | React-Island integration | Nur für recharts-Komponente nötig — alles andere ist 0 KB JS |
| **@astrojs/check** ^0.9 | Type-check Astro files | `npm run check` läuft `astro check` |
| **tailwindcss** ^4 | Styling | via `@tailwindcss/vite` Plugin in `astro.config.mjs` |
| **@tailwindcss/vite** ^4 | Tailwind 4 vite integration | Cleaner als PostCSS-Plugin |
| **recharts** ^2 | KPI Charts | Einziger React-Hydration-Teil im ganzen Admin |
| Inline SVG (lucide paths) | Icons | Kein lucide-react, einfach SVG-Strings in `lib/nav.ts` |
| Supabase (geplant) | Backend | `@supabase/supabase-js` wenn Auth aktiviert wird |

## Mobile — geplant (noch nicht installiert)

| Package | Zweck | Warum | Wann einführen |
|---------|-------|-------|---------------|
| **@tanstack/react-query** | Data Fetching + Cache | Offline Mutations, Cache Persistence, bewährt in mindecho-app | Phase 2 (Supabase Integration) |
| **@tanstack/query-async-storage-persister** | Query Persistence | Überlebt App-Kills, Offline-Queue | Phase 2 |
| **zustand** | Client State | Leichtgewichtig, bewährt in mindecho-app | Phase 2 (wenn AppDataProvider zu groß wird) |
| **react-native-purchases** (RevenueCat) | In-App Subscriptions | Abstrahiert Apple/Google Payments, Webhook-basiert | Phase 3 (Monetarisierung) |
| **react-native-purchases-ui** | Paywall UI | Vorgefertigte Paywall-Screens, A/B Testing | Phase 3 |
| **expo-sqlite** | Local Storage Polyfill | Sync localStorage für Supabase Auth (statt AsyncStorage) | Phase 2 |
| **zod** | Validation | Shared Schemas zwischen App und Edge Functions | Phase 2 |
| **sentry-expo** / **@sentry/react-native** | Error Monitoring | Crash Reports, Performance, Session Replay (GDPR-maskiert) | Phase 2 |
| **lottie-react-native** | Premium Animationen | Aufwändigere Confetti / Level-Up FX | Phase 3 (optional — aktuell tut's reines Reanimated) |

## Bewusst NICHT gewählt

| Package | Warum nicht |
|---------|-------------|
| **Firebase** | US-Company, Vendor Lock-in, GDPR-Risiko, Supabase ist besser für EU |
| **WatermelonDB** | Overkill für einfache Habit Check-ins — TanStack Query reicht |
| **Redux / MobX** | Zu viel Boilerplate — Zustand ist leichter und ausreichend |
| **SvelteKit (für Landing Page)** | Astro ist schneller (zero JS), besser für statische Seiten. SvelteKit bleibt Option für interaktive Web-Apps (Admin Portal) |
| **NativeWind / Tailwind** | StyleSheet ist ausreichend, Design Tokens über `@carrot/shared` |
| **Expo EAS Build** | Kostet Geld, lokale Builds funktionieren (bewährt in Hof) |
| **OneSignal** | Expo Notifications reicht für den Start, OneSignal bei Bedarf später |
| **i18next** | Flat Object (`de.ts`) reicht am Anfang, Framework bei Bedarf später |
| **Stripe (client-side)** | RevenueCat abstrahiert Apple/Google Payments — Stripe nur server-side wenn nötig |

---

## Phasen-Plan

### Phase 1 — Foundation ✅ erledigt (Mai 2026)
Expo, React Native, expo-router, Reanimated, Gesture Handler, react-native-svg, AsyncStorage, Design Tokens, Astro Landing + Admin (beide statisch auf CF Pages, Auto-Deploy on push) — alle 3 Apps stehen mit Mock-Daten, Mobile Plans 2-7 implementiert.

### Phase 2 — Backend + Core Features (nächst)
Supabase Projekt erstellen → Migrations applyen → TanStack Query, Zustand, expo-sqlite, Zod, Sentry. Wiring mobile AppDataProvider auf Supabase.

### Phase 3 — Monetarisierung + Gamification
RevenueCat (Solo + Squad Entitlements), Lottie für Premium-FX, echte Push Notifications, Squad Auto-Cycle, Custom Domains.

### Phase 4 — Scale
OneSignal (bei Bedarf), Analytics, A/B Testing, Performance Monitoring