Skip to main content

Prerequisites

Before you start, install these tools:
Recommended: Use Volta (automatically manages Node versions)
Alternative: Use nvm
Verify installation:
If you used Volta above, Yarn is already installed. Otherwise:
Verify installation:
macOS: Install Xcode Command Line Tools
Windows: Download from git-scm.comLinux:
  1. Install Xcode from the Mac App Store
  2. Open Xcode once and accept the license agreement
  3. Install iOS Simulator (Xcode → Settings → Platforms → iOS)
Xcode is ~12GB and only available on macOS.
  1. Download Android Studio
  2. During setup, install the Android SDK
  3. 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

Important: yarn ios / yarn android compiles native code, which takes several minutes. You only need to run this once (or when native dependencies change).
For daily development, use this workflow:
The dev server provides instant hot reload for JavaScript/TypeScript changes. You only need to rebuild with yarn ios when:
  • Adding/removing native dependencies
  • Changing app.json configuration
  • Modifying native code (Swift/Kotlin)
  • The app gets uninstalled from the simulator

Backend Choice

During yarn setup, you’ll choose between: Both work identically in mock mode. Choose based on your preference.
After you choose, setup automatically removes the other backend’s code and packages. You’ll have a clean codebase with only your chosen backend.

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:
The AI reads the vibe/ context files and follows project patterns automatically.

Key Directories


Dev Menu

Access via Cmd+D (iOS) / Cmd+M (Android):
  • Toggle free/pro subscription
  • Switch light/dark mode
  • View component showcase
  • Check which services are mocked

Before Production

  1. Configure backend credentials (Supabase or Convex)
  2. Generate Android release keystore
  3. Update bundle identifiers in app.json
See Full Setup Guide.

Next Steps

Mock Services

How mock services work

Backend & Database

Choose and configure your backend

Full Setup

Configure all services

Deploy

Ship to app stores