🦊 FoxRitual

Персональное wellness-приложение для 30-дневной программы пилатеса, ежедневных ритуалов и дневника настроения.

Создано на React + TypeScript + Vite. Работает без бэкенда — все данные хранятся локально в браузере.

---

Функциональность

Раздел	Описание
Главная	Сводка дня: прогресс ритуалов, следующая тренировка, быстрые ссылки
Тренировка	30-дневная программа пилатеса с видео, таймером и сеткой прогресса
Планер	Ежедневные ритуалы с чекбоксами и календарём выполнения
Дневник	Запись настроения с эмодзи, оценкой дня и заметками до/после
Рецепты	Рецепты в стиле clean eating с фильтрами по категориям
Профиль	Статистика, система рангов, плейлист, сброс прогресса

Дополнительно

• Онбординг — приветственный экран с вводом имени при первом запуске
• «Что нового» — шторка с обновлениями при каждом крупном релизе
• Система рангов — 6 уровней от «Новичок» до «Лисичка Фокс» (30 дней)
• PWA — устанавливается на главный экран телефона как приложение
• Сброс прогресса — начать программу заново прямо из профиля

---

Стек

• React 19 + TypeScript
• Vite 8
• Tailwind CSS с кастомной палитрой (cream, chocolate, gold, latte, khaki)
• React Router v7
• lucide-react — иконки
• localStorage — хранение данных без бэкенда (префикс foxritual_)

---

Структура проекта

src/
├── components/        # Переиспользуемые компоненты
│   ├── GlassCard.tsx
│   ├── TabBar.tsx
│   ├── StatCard.tsx
│   ├── RankSection.tsx
│   ├── WhatsNew.tsx
│   ├── ResetConfirm.tsx
│   └── ...
├── pages/             # Страницы приложения
│   ├── Home.tsx
│   ├── Workout.tsx
│   ├── Planner.tsx
│   ├── Diary.tsx
│   ├── Recipes.tsx
│   ├── Profile.tsx
│   └── Onboarding.tsx
├── hooks/             # Кастомные хуки
│   ├── useStreak.ts
│   ├── useHabits.ts
│   ├── useDiary.ts
│   ├── useWorkoutLogs.ts
│   └── useProfileStats.ts
├── lib/               # Утилиты
│   ├── storage.ts     # localStorage API
│   ├── ranks.ts       # Система рангов
│   └── calendarUtils.ts
└── data/              # Контент (тренировки, рецепты, ритуалы)

---

Запуск локально

# Установить зависимости
npm install

# Запустить dev-сервер
npm run dev

# Проверить соблюдение стандартов кода
npm run check

Приложение откроется на http://localhost:5000.

---

Хранилище данных

Все данные хранятся в localStorage браузера. Бэкенд и база данных не нужны.

Ключ	Содержимое
foxritual_profile	Имя и дата начала программы
foxritual_workouts	Завершённые тренировки
foxritual_habits	Отметки ритуалов по датам
foxritual_diary	Записи дневника настроения
foxritual_streak	Текущая серия дней подряд
foxritual_whats_new_seen_v	Версия последнего просмотренного «Что нового»

---

Система рангов

Новичок  →  Начинающая (3 дня)  →  Любительница (7)  →
Девушка дисциплины (14)  →  Богиня ритуалов (21)  →  Лисичка Фокс (30)

---

Стандарты кода

Проект следует правилам из AGENTS.md — документа для AI-ассистентов (Claude, Cursor и др.).

Автоматическая проверка 7 правил:

npm run check

Правила:

1. Файл ≤ 150 строк
2. Пропсы компонента ≤ 5
3. Нет импортов storage в components/ и pages/
4. Не более 1 useEffect на файл
5. Не-JSX функции ≤ 20 строк
6. Нейминг: компоненты → PascalCase.tsx, хуки → usePascalCase.ts, lib → camelCase.ts
7. Нет типа any

---

Деплой

Приложение статическое — подходит любой хостинг.

Vercel (рекомендуется):

1. Подключи GitHub-репозиторий на vercel.com
2. Framework preset: Vite
3. Нажми Deploy

Replit Deploy — одна кнопка прямо из редактора.

---

История изменений

Подробный лог всех версий — в CHANGELOG.md.