Prerequisites
Before you start, install these tools:Node.js 20 (required)
Node.js 20 (required)
Recommended: Use Volta (automatically manages Node versions)Alternative: Use nvmVerify installation:
Yarn (required)
Yarn (required)
If you used Volta above, Yarn is already installed. Otherwise:Verify installation:
Git (required)
Git (required)
Xcode (iOS development)
Xcode (iOS development)
- Install Xcode from the Mac App Store
- Open Xcode once and accept the license agreement
- Install iOS Simulator (Xcode → Settings → Platforms → iOS)
Xcode is ~12GB and only available on macOS.
Android Studio (Android development)
Android Studio (Android development)
- Download Android Studio
- During setup, install the Android SDK
- Create an emulator: Tools → Device Manager → Create Device
Works on macOS, Windows, and Linux.
Setup
Mock mode is enabled by default. You can skip
yarn setup entirely and start building immediately. All services (auth, database, payments, analytics) work with simulated data. Configure real services when you’re ready for production.Development Workflow
For daily development, use this workflow:yarn ios when:
- Adding/removing native dependencies
- Changing
app.jsonconfiguration - Modifying native code (Swift/Kotlin)
- The app gets uninstalled from the simulator
Backend Choice
Duringyarn setup, you’ll choose between:
| Backend | Best For |
|---|---|
| Supabase | SQL apps, PostgreSQL experience, RLS-based security |
| Convex | TypeScript-first apps, reactive queries, function-level auth |
What’s Included
The app ships with working screens:- Welcome/Login/Signup - Full auth flow (Supabase or Convex)
- Home - Main app screen
- Profile - User settings and account deletion
- Paywall - Subscription UI with mock purchases
- Dev Menu -
Cmd+D(iOS) /Cmd+M(Android) for debugging
AI-Assisted Development
Open your project in Cursor or Claude Code. To build features:vibe/ context files and follows project patterns automatically.
Key Directories
| Location | Contents |
|---|---|
apps/app/app/screens/ | Screen components |
apps/app/app/components/ | Reusable UI components |
apps/app/app/stores/ | Zustand stores (auth, subscriptions) |
apps/app/app/services/ | Service clients (Supabase, Convex, RevenueCat, PostHog) |
apps/app/app/hooks/ | Auth hooks (backend-specific after setup) |
apps/app/app/theme/ | Unistyles theme tokens |
convex/ | Convex backend functions (only if using Convex) |
vibe/ | AI context files |
Dev Menu
Access viaCmd+D (iOS) / Cmd+M (Android):
- Toggle free/pro subscription
- Switch light/dark mode
- View component showcase
- Check which services are mocked
Before Production
- Configure backend credentials (Supabase or Convex)
- Generate Android release keystore
- Update bundle identifiers in
app.json

