Фітнес-трекер
"Кросплатформний тренувальний застосунок на New Architecture React Native — одна кодова база, iOS, Android і веб."
- 3
- RN 0.85
- FSD
Трекер тренувань на актуальному, а не безпечному стеку React Native — Expo SDK 56, RN 0.85 New Architecture, React 19. Тренування, серії, журнал ваги й метрики здоров'я з однієї кодової бази.
Мобільний розробник — архітектура, фічі, нативні інтеграції, налаштування тестів.
Проблема
Фітнес-застосунки живуть або вмирають на тертi: дані мають приходити з пристрою, який користувач і так носить, а вхід не може бути формою. Зробити це на iOS і Android без двох кодових баз — і є справжня задача.
Підхід
- 01Побудував на Expo SDK 56 і RN 0.85 з увімкненою New Architecture — свідомо, бо її API достатньо інші, щоб бути частиною дизайну.
- 02Організував код за Feature-Sliced Design, де правила імпортів тримає лінтер, а не домовленість.
- 03Взяв типізовані маршрути, тож навігація перевіряється проти дерева файлів на компіляції.
- 04Читаю HealthKit і Health Connect за однією фічею дозволів, а різниця платформ живе в одному шарі мапінгу.
- 05Автентифікація через Better Auth з нативним входом Apple і Google — перший екран це кнопка, а не форма.
- 06Увімкнув React Compiler і прибрав ручну мемоізацію, яка лише ховає справді важливі випадки.
- 07Покрив основний цикл Jest і сценарними e2e-флоу.
Результат
- →Одна кодова база на iOS, Android і статичну веб-збірку.
- →Метрики здоров'я читаються нативно на обох платформах через єдиний шар дозволів.
- →Нативний вхід Apple і Google — жодного екрана з паролем в онбордингу.
- →Межі архітектури тримає тулінг, тож структура переживає нових контриб'юторів.
- →Налаштований хмарний пайплайн збірки для повторюваних релізів.
Бізнес-вплив
Один репозиторій на два стори й веб тримає вартість фічі лінійною замість подвоєння на платформу. Нативне читання даних здоров'я робить застосунок корисним ще до першого ручного запису — а це той момент, коли більшість фітнес-застосунків видаляють.
Під капотом
Застосунок
- Expo SDK 56 · React Native 0.85
- React 19 · React Compiler
- expo-router · типізовані маршрути
- TypeScript strict
Нативні інтеграції
- HealthKit (iOS) · Health Connect (Android)
- Apple Sign-In · Google Sign-In
- Expo-модулі · dev client
- Платформні веб-варіанти
Архітектура та якість
- Feature-Sliced Design · під лінтером
- Jest · Testing Library
- Сценарні E2E-флоу
- FSD-лінтер Steiger
Доставка
- Пайплайн Cloud Build
- Статичний веб-вивід
- Нативні проєкти iOS + Android
- Deep linking
Є система, яку треба збудувати?
Платежі, інтеграції, мобільні застосунки, пайплайни даних — якщо це має працювати без нагляду і бути коректним, це моя робота. Від архітектури до запуску, і далі — підтримка.