AIExpoClaude CodeMCPDeveloper Tools

Build Expo Apps with AI Agents: Claude Code, Cursor & Expo MCP

A practical guide to AI-assisted React Native development in 2026. Set up the Expo MCP server in Claude Code or Cursor, use local tools like screenshots and logs, write an AGENTS.md, and follow a prompt workflow that produces maintainable Expo code.

DeveloperMill4 min read

AI coding agents are now a normal part of mobile development. Tools like Claude Code and Cursor can scaffold screens, wire up APIs, and fix bugs in an Expo app in minutes. But results vary a lot, from clean, idiomatic code to a pile of outdated patterns. The difference is mostly context and workflow. This guide covers how to set up both properly for Expo.

Why agents get React Native wrong

Most bad AI output in React Native comes from stale knowledge: deprecated expo-av instead of expo-video, old React Navigation setup instead of Expo Router, estimatedItemSize on FlashList v2, or new MMKV() instead of createMMKV(). The fix is to give the agent live, versioned docs and your project's rules.

1. Connect the Expo MCP server

Expo hosts an official MCP server at https://mcp.expo.dev/mcp. In Claude Code:

claude mcp add --transport http expo https://mcp.expo.dev/mcp

Then run /mcp in the session and sign in with your Expo account. The server works with any tool that supports remote MCP (Claude, Cursor, VS Code). Team and Enterprise admins can also enable it for a whole organization.

What it gives your agent:

  • Docs: read current Expo documentation pages, so the agent stops guessing APIs. (Ranked doc search requires an EAS paid plan.)
  • EAS: trigger builds and workflows, then read build info and logs to debug failures.
  • TestFlight: read crash reports and tester feedback.

2. Turn on local app tools

With a local dev server, the agent can see and interact with your running app:

npx expo install expo-mcp --dev
EXPO_UNSTABLE_MCP_SERVER=1 npx expo start

This unlocks tools for taking screenshots, tapping views, finding elements, collecting app logs, opening DevTools, and printing your Expo Router sitemap. Now the agent can make a UI change, screenshot the result, and fix what's wrong before telling you it's done. Local capabilities require SDK 54+.

SDK 58 also adds an experimental @expo/agent-cli, which gives agents machine-readable access to Expo CLI, EAS CLI, and expo-doctor:

npx @expo/agent-cli@latest agents:setup

3. Write a project guide (AGENTS.md / CLAUDE.md)

Agents follow your conventions only if you write them down. Keep a short guide at the repo root:

# Project guide

## Stack
- Expo SDK 58, React Native 0.88, New Architecture, TypeScript strict
- Expo Router (file-based) with NativeTabs from "expo-router/native-tabs"
- NativeWind for styling (className), no StyleSheet unless required
- TanStack Query for server data, Zustand for client state, MMKV for persistence

## Rules
- Install packages with `npx expo install`, never plain npm install
- Use expo-image (not Image), expo-video/expo-audio (not expo-av)
- Lists: FlashList v2, no estimatedItemSize
- Secrets: expo-secure-store only; never put API keys in EXPO_PUBLIC_ vars
- Run `npx expo-doctor` and `npx tsc --noEmit` before finishing a task

## Structure
- app/ routes only, components/ shared UI, lib/ logic, hooks/ hooks

This one file prevents most "the AI did it wrong" moments. For folder conventions, see our Expo Router folder structure guide.

4. A prompt workflow that works

Bad prompt: "Build me a fitness app."

Good workflow:

  1. Plan first. "Read the project guide. Propose the screens, routes, and data model for a workout logger. Don't write code yet."
  2. One feature at a time. "Implement the workout list screen with FlashList and TanStack Query against /api/workouts."
  3. Verify. "Take a screenshot on iOS and Android, check dark mode, and fix any layout issues."
  4. Review. Read the diff yourself. Ask "what edge cases did you not handle?"
  5. Commit small. Small, reviewed commits make it easy to revert a bad turn.

5. Start from a strong base

Agents amplify whatever is already in the repo. A well-structured codebase with consistent components produces consistent new code. An empty folder produces a different style on every prompt.

That's the idea behind starting from a template: our Expo templates give the agent a typed, consistent TypeScript and NativeWind codebase to extend. Our free components, like the bottom sheet and animated bottom navigation, are drop-in pieces it can reuse instead of reinventing them. We compare the approaches in Expo templates vs building from scratch.

Things to keep human

  • Security decisions: auth flows, token storage, and API route authorization.
  • Payments and store compliance: see our in-app purchases guide.
  • Final UX judgment: an agent can match a design, but you decide what feels right.
  • Releases: review before running eas submit or publishing an EAS Update to production.

Upgrades: let the agent do the boring part

SDK upgrades are a great agent task: bump versions, run expo-doctor, fix breaking changes, and re-test. Point it at the changelog. Our Expo SDK 58 guide lists the breaking changes to watch, and Expo also publishes an expo-upgrade skill for Claude Code and similar tools.

Frequently asked questions

What is the Expo MCP server?

The Expo MCP server is a remote Model Context Protocol server hosted by Expo at https://mcp.expo.dev/mcp. It lets AI tools like Claude, Claude Code, Cursor, and VS Code read Expo documentation, trigger and inspect EAS builds and workflows, read TestFlight crashes and feedback, and — with the expo-mcp package — take screenshots of and interact with your running app.

How do I add the Expo MCP server to Claude Code?

Run `claude mcp add --transport http expo https://mcp.expo.dev/mcp`, then run `/mcp` inside Claude Code to sign in with your Expo account. For local capabilities (screenshots, taps, logs), also run `npx expo install expo-mcp --dev` and start your app with `EXPO_UNSTABLE_MCP_SERVER=1 npx expo start`.

Can AI build a complete React Native app?

AI agents can scaffold screens, wire up navigation, write API integrations, and fix bugs quickly, but they work best with a solid starting point and clear constraints. Starting from a well-structured template and giving the agent a project guide (AGENTS.md or CLAUDE.md) produces far more maintainable code than prompting from an empty folder.

What's the best AI coding tool for React Native?

Claude Code, Cursor, and similar agentic tools all work well with Expo. The bigger difference comes from context: connecting the Expo MCP server, keeping the project on the latest SDK, and documenting your conventions so the agent follows them.

Build it faster with a template

Production-ready Expo React Native templates with the patterns from this post already wired up.

Browse templates