Fitness & Wellness Kit
Expo SDK 54 + Hono full-stack mobile fitness template. $149.
The OTF Fitness & Wellness Kit is a complete cross-platform fitness app starter. Expo SDK 54 + Hono backend + Postgres + Better Auth + Stripe. Live web demo at fitness-preview.otf-kit.dev.
Stack
| Layer | Choice |
|---|---|
| Framework | Expo SDK 54 + React 19 + Expo Router 6 (iOS · Android · Web) |
| Routing | Expo Router (file-based) |
| Data | TanStack Query |
| Server | Hono 4 + Bun 1.3 |
| DB | Postgres + Drizzle ORM 1.0-beta |
| Auth | Better Auth 1.6 + @better-auth/expo — email + Google + bearer (native) + cookies (web) + demo login |
| UI | Plain RN + react-native-svg + kit-local primitives, with @otfdashkit/ui-native for shared blocks |
| Payments | Stripe Checkout (one-time $149) |
| Deploy | Railway via scripts/deploy-railway.sh (web demo)EAS Build for native binaries |
Pre-built screens
The kit ships with 12 screens modelled after Apple Fitness:
- Auth: login, signup
- Onboarding: welcome (first launch)
- Summary (LANDING): Activity Rings hero + 2x2 metric grid + recent workouts
- Ring detail: week strip + giant ring + intraday calorie bars
- Metric detail: D/W/M/Y SegmentedControl + 2 metric cards
- Workout: type chips + Start CTA + recent log
- Workout start: live timer + calorie/distance counters + End CTA
- Workout detail: completed-workout summary + delete
- Sharing (sub-screen of Profile): awards + friends activity feed
- Goal: StepperBig for daily move goal
- Profile (5th tab): avatar + all-time stats + settings + Sign out
The 5 bottom tabs: Summary · Workout · Nutrition · Programs · Profile.
Reusable blocks
| Block | Used for |
|---|---|
<ActivityRings /> | 3 concentric SVG rings (hero or week-strip mini) |
<WeekStrip /> | 7 mini rings + day-letter labels |
<StepperBig /> | Big number with ⊖/⊕ circular buttons (goal screens) |
<MetricCard /> | Label + big-number value + unit + optional trend |
<SegmentedControl /> | D/W/M/Y capsule with sliding active pill |
<MiniBarChart /> | Inline 7- or 24-bucket bar chart |
Database
- 5 Better-Auth tables:
user,account,session,jwks,verification - 6 app tables:
userPublic,dailyGoal,workoutType,workout,award,friendship
Demo + QR preview
fitness-preview.otf-kit.dev shows the kit in an iPhone phone-frame plus an Expo Go QR card. Scan with Expo Go (Android) or Camera (iOS) to run the preview channel build on your own phone instantly.
Native builds
Native iOS / Android binaries are produced via EAS Build:
eas build --profile preview --platform ios
eas build --profile preview --platform androidThe eas.json ships with development, preview, and production profiles. Submit to
TestFlight + Play Internal Testing via eas submit.
Web safe-area shim — important
app/_layout.tsx wraps the kit in <WebSafeAreaShim> — a SafeAreaInsetsContext.Provider
that injects top: 56 ONLY when iframed (the marketing preview at fitness-preview.otf-kit.dev
shows the kit inside a phone frame). On standalone web, this returns 0 so the kit reads
edge-to-edge. Don't add layout-level paddingTop — go through useSafeAreaInsets() instead.
Deploy
bash scripts/deploy-railway.shThis kit uses the local-build pattern: the script runs bun run build locally (Expo web
export + 1 KB Bun server bundle) before railway up. Building Expo + RN inside Docker takes
~15 minutes and pushes Railway's build cap; doing it locally takes ~1-2 minutes against the
warm monorepo cache.
Required env
| Variable | Purpose |
|---|---|
DATABASE_URL | Postgres connection string |
BETTER_AUTH_SECRET | 32+ chars — signs sessions/JWTs |
BETTER_AUTH_URL | Public origin |
STRIPE_SECRET_KEY | Stripe secret |
STRIPE_WEBHOOK_SECRET | Stripe webhook signing secret |
RAILWAY_API_TOKEN | Read by deploy script |
EXPO_PUBLIC_API_URL | (native builds only) Public API URL the iOS/Android binary points at |
Optional: GOOGLE_CLIENT_ID + GOOGLE_CLIENT_SECRET. DEMO_LOGIN_DISABLED=1.
Buy
$149 on otf-kit.dev — or Starter Bundle ($249 = both kits + future kits).