Expo (React Native) recipe

Drop-in setup for a native app. design is optional here. Its canvas-first loop targets HTML/JSX. For Expo, design typically lives upstream in Figma. Flow's agent-device skill handles native verification.

Starting point: existing Expo SDK 51+ app, pnpm / npm / yarn, TypeScript.

0. Install the CLI

npm i -g @1agh/maude              # or pnpm add -g

Required, not optional. Skills shell out to maude.

1. Add the marketplace and install flow

In Claude Code:

/plugin marketplace add 1aGh/maude
/plugin install flow@maude

The design plugin is optional for native. Its canvas-first loop targets HTML/JSX in the browser. For Expo, design typically lives upstream in Figma plus flow's agent-device automation for native verification.

2. Init the workspace

In your project root, inside Claude Code:

/flow:init

For an Expo app you'll typically end up with:

{
  "name": "my-rn-app",
  "language": "en",
  "platforms": ["ios-phone", "ios-tablet", "android-phone"],
  "bundleIdPrefix": "com.acme.myrnapp",
  "stack": {
    "language": "typescript",
    "framework": "expo",
    "packageManager": "pnpm",
    "monorepo": false,
    "ci": "github-actions",
    "tests": "jest",
    "router": "expo-router"
  },
  "responsive": {
    "approach": "mobile-first",
    "densityMap": {
      "ios-phone": "palm-friendly",
      "ios-tablet": "cozy",
      "android-phone": "palm-friendly"
    }
  }
}

bundleIdPrefix is required for native scenarios. /flow:utils-verify and /flow:scenario use it to launch builds on the simulator.

3. Scenarios on a simulator

Scenarios are scripted user flows that run across your declared platforms. For native variants, flow uses the agent-device automation skill (XCUITest under the hood for iOS, UIAutomator for Android).

Author a new scenario:

/flow:scenario new review-first-3-flashcards

Run it:

/flow:scenario review-first-3-flashcards

Output: a markdown report under .ai/scenarios/<name>/report.md with per-step screenshots from each platform.

4. Try the loop

/flow:setup-prd          # one-time. draft the PRD
/flow:plan "<feature>"   # per-feature. draft a phase plan
/flow:execute            # implement it
/flow:done               # validate, commit, PR, archive

/flow:utils-verify (called inside /flow:execute's Edit-Verify loop) will spawn an agent-device smoke against the current simulator for UI tasks, in addition to running your Jest tests.

Gotchas

• Metro hot reload. Flow doesn't manage Metro. Start it yourself (npx expo start). The agent-device skill connects to whatever's running.
• EAS Build / release. /flow:release walks releaseGuide. For Expo, your runbook will reference eas build --platform all and the EAS dashboard. Auto-detected during init when an eas.json is found.
• Design plugin still useful for things like in-app web views, settings screens that are also web pages, or landing-page mocks of the marketing site that fronts the app.

Next

• Flow commands
• workflows.config.json reference