Обзор архитектуры

Высокоуровневая структура

┌─────────────────────────────────────────────────────────┐
│                   ROOT LAYOUT                           │
│  Providers: Query, Session, Subscription, Theme, i18n   │
└───────────────────────┬─────────────────────────────────┘
                        │
        ┌───────────────┼───────────────┐
        │               │               │
    (auth)         (onboarding)     (app)
  ├─ login           └─ index        ├─ (tabs)/
  ├─ register                        │  ├─ courses (index)
  ├─ forgot-pwd                      │  ├─ games
  └─ callback                        │  └─ profile
                                     ├─ course/[id]
                                     ├─ course/[id]/generating
                                     ├─ course-creation/*
                                     ├─ lesson/[id]
                                     ├─ games/*
                                     ├─ settings/*
                                     └─ subscription/*

Feature-Based Architecture

Каждая фича — самостоятельный модуль со своей структурой:

src/features/{feature}/
├── api/
│   ├── queries.ts      # GET запросы (TanStack Query)
│   └── mutations.ts    # POST/PUT/DELETE (TanStack Query)
├── hooks/
│   └── use-*.ts        # React hooks
├── components/
│   └── *.tsx           # UI компоненты фичи
├── types.ts            # TypeScript типы
└── index.ts            # Публичные экспорты

Правила:

1. Фича инкапсулирована — всё что нужно находится внутри папки
2. Чёткие экспорты — только через index.ts
3. API слой отдельно — queries и mutations в api/
4. Hooks для логики — бизнес-логика в хуках, не в компонентах

Слои приложения

┌──────────────────────────────────────┐
│              UI Layer                │
│  (app/, components/, features/*.tsx) │
├──────────────────────────────────────┤
│            Hooks Layer               │
│     (features/*/hooks/use-*.ts)      │
├──────────────────────────────────────┤
│            State Layer               │
│   (stores/, TanStack Query cache)    │
├──────────────────────────────────────┤
│             API Layer                │
│       (features/*/api/*.ts)          │
├──────────────────────────────────────┤
│           Core Layer                 │
│    (core/theme, i18n, monitoring)    │
└──────────────────────────────────────┘

Провайдеры

Root layout (app/_layout.tsx) оборачивает приложение провайдерами:

<QueryClientProvider>      {/* TanStack Query */}
  <SessionProvider>        {/* Supabase Auth */}
    <SubscriptionProvider> {/* RevenueCat */}
      <ThemeProvider>      {/* Light/Dark mode */}
        <I18nProvider>     {/* Локализация */}
          <App />
        </I18nProvider>
      </ThemeProvider>
    </SubscriptionProvider>
  </SessionProvider>
</QueryClientProvider>

Доменные модели

User
 └── Course
      └── Module
           └── Lesson
                ├── Video
                └── Resource

User
 ├── LessonProgress (отслеживание прогресса)
 ├── ChatMessage (история AI чата)
 ├── GameResult (результаты игр)
 └── UserGamification (XP, streaks)

Внешние интеграции

Сервис	Назначение
Supabase	Auth + PostgREST API
RevenueCat	In-App Purchases
Expo Notifications	Push уведомления
Sentry	Error tracking
Firebase Analytics	Аналитика
Vexo	Session replay