ScaleRocket/Mobile
ENFR

AI-Assisted Development Setup

Set up your development environment for AI-assisted mobile app coding with Claude Code, Cursor, Windsurf, or Codex.

AI-Assisted Development Setup

ScaleRocket Mobile is designed to work with AI coding assistants. The project includes context files that help your AI understand the mobile codebase.

How It Works

ScaleRocket Mobile includes two files at the root of the project that AI assistants read automatically:

  • CLAUDE.md — Read by Claude Code and Cursor. Contains the full project guide, architecture, conventions, and dangerous commands to avoid.
  • AGENTS.md — Read by Codex, Windsurf, and other tools. Contains a condensed version with the same safety rules.

You don't need to configure anything for basic usage. Just open your project and start prompting.

Choose Your AI Tool

Best for: Terminal-based development, full codebase understanding, MCP integrations.

Claude Code runs in your terminal and reads CLAUDE.md automatically on launch.

cd scalerocket-mobile
claude

First prompt to use:

Read CLAUDE.md first. Then give me an overview of this mobile app boilerplate
and what I need to set up to start developing.

Best for: Visual IDE experience, inline editing, Composer for multi-file changes.

Cursor reads CLAUDE.md automatically when you open the project folder.

  1. Open the project folder in Cursor
  2. Open Composer (Cmd+K / Ctrl+K) for multi-file changes
  3. Open Chat (Cmd+L / Ctrl+L) for questions

First prompt to use (in Composer):

@CLAUDE.md Read this file first. Then give me an overview of this mobile app
boilerplate and what I need to set up.

Best for: IDE experience with Cascade flow for step-by-step guidance.

Windsurf reads AGENTS.md automatically.

  1. Open the project folder in Windsurf
  2. Open Cascade (the AI panel) on the right
  3. Start prompting

First prompt to use:

Read AGENTS.md and CLAUDE.md in this project. Then give me an overview
of this mobile app boilerplate and what I need to set up.

Best for: Terminal-based development with OpenAI models.

Codex reads AGENTS.md automatically.

cd scalerocket-mobile
codex

First prompt to use:

Read AGENTS.md and CLAUDE.md. Then give me an overview of this mobile app
boilerplate and what I need to set up to start developing.

Setting Up MCP Servers

MCP (Model Context Protocol) lets your AI assistant connect directly to services like your database, Stripe, and GitHub. Instead of copying and pasting keys and schemas, the AI can read and modify things directly.

ScaleRocket Mobile includes a .mcp.json at the project root, pre-configured for all the services you need.

Claude Code reads .mcp.json natively. Just configure the tokens:

Supabase MCP

  1. Go to supabase.com/dashboard → avatar (top right) → Account → Access Tokens
  2. Click Generate new token, name it "Claude Code"
  3. Open .mcp.json and replace YOUR_SUPABASE_ACCESS_TOKEN with your token

Convex MCP

  1. Run npx convex dev to start your Convex project
  2. Your deployment name is shown in the terminal (e.g. your-app-123)
  3. Open .mcp.json and replace YOUR_DEPLOYMENT_NAME with your deployment name

GitHub MCP

  1. Go to github.com/settings/tokens → Fine-grained tokens → Generate new token
  2. Select your repos, grant Contents + Pull Requests read/write
  3. Open .mcp.json and replace YOUR_GITHUB_TOKEN with your token

Stripe MCP

  1. Go to dashboard.stripe.com/apikeys
  2. Copy your Secret key (starts with sk_test_ in test mode or sk_live_ in production)
  3. Open .mcp.json and replace YOUR_STRIPE_SECRET_KEY with your key

Security: Use your test mode key during development. Never share or commit your secret key.

Restart Claude Code after saving .mcp.json.

Cursor supports MCP via its settings:

  1. Open Cursor Settings → MCP
  2. Add each server manually:

Supabase:

  • Command: npx
  • Args: -y @supabase/mcp-server-supabase@latest --access-token YOUR_TOKEN
  • Get your token: supabase.com/dashboard → Account → Access Tokens

Convex:

  • Command: npx
  • Args: -y @anthropic-ai/convex-mcp-server@latest
  • Env: CONVEX_DEPLOYMENT=YOUR_DEPLOYMENT_NAME
  • Get your deployment name from npx convex dev output

GitHub:

  • Command: npx
  • Args: -y @modelcontextprotocol/server-github
  • Env: GITHUB_PERSONAL_ACCESS_TOKEN=YOUR_TOKEN
  • Get your token: github.com/settings/tokens → Fine-grained tokens

Stripe:

Windsurf supports MCP via its settings:

  1. Open Windsurf Settings → AI → MCP Servers
  2. Add each server with the same configuration as the .mcp.json file
  3. Get your tokens from:

Codex can read .mcp.json if supported by your version. Otherwise, configure MCP via the Codex settings or environment.

Get your tokens from:

What MCP enables

Once configured, your AI can:

  • Supabase MCP: Read your database schema, create tables, manage RLS policies, run queries
  • Convex MCP: Read your schema, manage functions, query data, debug deployments
  • GitHub MCP: Create repos, push code, create pull requests, manage issues
  • Stripe MCP: Create products and prices, manage subscriptions, check webhook events

Starter Prompts

Copy-paste these prompts directly into your AI tool. Replace [BRACKETS] with your own details.

Initial Setup

Read CLAUDE.md first. Then help me set up this ScaleRocket Mobile boilerplate:
1. Configure the .env file with my Supabase/Convex credentials
2. Run npm install
3. Start the dev server with npx expo start
4. Help me create a development build with EAS
Walk me through each step. Ask me before running any dangerous commands.

Building Your First Screen

I want to add a [DESCRIBE YOUR SCREEN] screen to my mobile app.
Read CLAUDE.md first for the project structure.
- Create a new route in app/(tabs)/ or a new route group
- Use the existing StyleSheet patterns for consistency
- If I need backend data, show me how to fetch it
- Show me the complete code for each file.

Customizing the App

Read CLAUDE.md to understand the project structure.
I want to customize this app for my [DESCRIBE YOUR PRODUCT]:
- Update the tab navigator with my own tabs
- Update the home screen with my own content
- Change the color palette in the StyleSheet
Keep the same auth flow and navigation structure.

Git Basics (for Beginners)

Git tracks changes in your code. Think of it as an "undo history" that also lets you upload your code to GitHub.

First-Time Setup

Run these once on your computer:

git config --global user.name "Your Name"
git config --global user.email "your@email.com"

Daily Workflow

# See what changed
git status

# Save your progress
git add .
git commit -m "added user dashboard"

# Upload to GitHub
git push

Emergency: Undo mistakes

# Undo uncommitted changes (careful — this discards your work!)
git stash                # Saves changes, can recover later with "git stash pop"

# Go back to last commit (WARNING: loses all uncommitted changes)
git checkout .           # Only use if you committed recently

# See your commit history
git log --oneline

Important: Always git commit before asking your AI to make big changes. If something goes wrong, you can always go back.

Tips for AI-Assisted Mobile Development

  1. Always start with "Read CLAUDE.md first." This gives the AI full project context.
  2. Be specific. "Add a screen at /(tabs)/analytics showing daily signups" beats "add analytics."
  3. Paste error messages. Copy the full error — the AI can usually fix it immediately.
  4. Commit before big changes. Run git add . && git commit -m "before AI changes" first.
  5. Test on a real device. Simulators miss issues with push notifications, biometrics, and performance.
  6. Mention the platform. Tell your AI if the issue is iOS-only, Android-only, or both.

Push Notifications

Set up Expo push notifications with permission handling, token management, and backend integration.

Mobile Payments

In-app purchases with RevenueCat for iOS and Android subscriptions, and why Stripe direct doesn't work on mobile.

On this page

AI-Assisted Development SetupHow It WorksChoose Your AI ToolSetting Up MCP ServersSupabase MCPConvex MCPGitHub MCPStripe MCPWhat MCP enablesStarter PromptsInitial SetupBuilding Your First ScreenCustomizing the AppGit Basics (for Beginners)First-Time SetupDaily WorkflowEmergency: Undo mistakesTips for AI-Assisted Mobile Development