Build a mobile app with Claude Code + Expo, running on your phone (Day 25 code lane, 30-Day Challenge)

The task

Use Claude Code to build a real mobile app with Expo (React Native) and run it on your own phone — spec → plan → build → preview on device → verify. This is the Day 25 "Ship a prototype" code-lane build from the 30-Day AI-Native Challenge, the mobile sibling of the website build.

Before AI

Mobile is where "I'll just try it" usually dies — native toolchains, simulators, build config. Expo removes most of that, and Claude Code drives Expo for you: you describe screens, it writes the app, and you watch it run on your actual phone through the free Expo Go app.

What you'll need

• Claude Code — paid Claude plan or API key (tool is paid; the Day 24 course is free). Codex free-tier works too; same loop.
• Node.js and the Expo Go app on your phone (free, iOS/Android) — it renders your app live over wifi via a QR code; no Xcode/Android Studio needed to start
• A one-screen-at-a-time spec
• Note: Expo Go + local dev is free. Building a store-installable binary uses EAS Build, which has free and paid tiers — VERIFY current limits before you plan a store release. For the challenge, Expo Go on your own phone is the finish line.

The workflow

1. Spec the app as screens and data — before Claude Code:

APP: A daily habit tracker (personal, no accounts in v1).
SCREENS:
  1. Today — list my habits with a check circle each; tap to mark done
  2. Add habit — name + emoji + how many times/week
  3. Progress — simple weekly grid: which habits I hit each day
DATA (on-device only for v1): habits [name, emoji, timesPerWeek], checkins [habitId, date]
LOOK: big tap targets, calm colors, works one-handed.
NOT in v1: reminders/notifications, cloud sync, streaks math beyond the grid.

2. Scaffold with Expo, then start Claude Code:

npx create-expo-app@latest habit-app
cd habit-app
claude

First message — plan first, always:

This is a fresh Expo (React Native) app. Read the spec I'll paste and propose a
plan: navigation approach, the components/screens you'll create, and how you'll
store data on-device (use AsyncStorage for v1). Don't write code yet — show me
the plan.

[paste your spec]

3. Approve the plan, build screen by screen:

Build it screen by screen. After each screen, tell me to reload Expo Go so I can
try it on my phone before you move on. Match the spec's look — big tap targets,
one-handed use. Store data on-device only; no backend.

4. Run it on your phone as it's built. Start the dev server (npx expo start), scan the QR with Expo Go, and the app appears on your phone. Every screen Claude Code finishes, you reload and tap through it for real — the tightest feedback loop mobile has ever had.

5. Test like a thumb, not a mouse. On the actual device: are tap targets big enough? Does it work one-handed? Add a habit, check it off, close and reopen the app — did the data persist (that's your AsyncStorage check)? Feed it the edge cases: no habits yet, a very long habit name.

6. Decide your finish line. For the challenge, "runs on my phone via Expo Go" is a complete Day 25 artifact — screenshot it for your portfolio. If you want it installable/shareable beyond your device, ask Claude Code to walk you through an EAS build (and re-check current free-tier limits first).

Verify it worked

On your phone: all three screens work, you can add and check off a habit, and the data survives an app restart. One-handed, big targets, no crash on the empty state. If a friend can use it without instructions, you've shipped.

Troubleshooting

• QR won't connect? Phone and computer must be on the same wifi; try npx expo start --tunnel if the network blocks it.
• Data vanishes on restart? AsyncStorage isn't wired to a screen's load — tell Claude Code exactly which screen loses state; it's usually a missing load-on-mount.
• Agent reaches for a backend/database? Re-anchor to "on-device only for v1" — it loves to over-engineer persistence.
• Layout looks off on your phone but fine in the web preview? Test on the device, not the browser — React Native and web diverge; the phone is the truth.

Reality check

Expo Go running your app is real and genuinely impressive — and it's still a v1 prototype, not an App Store product. Store distribution, real auth, and cloud sync are their own projects with their own review bars. What you've proven is that you can direct an agent to build something that runs in your hand, which is the whole Day 25 point.

Data & security

v1 is on-device, which keeps it simple and private. The instant an app syncs to a server or handles accounts, the challenge's responsible-AI rule applies at full force — no AI-generated auth/data code without human review, and never commit API keys the agent scaffolds.

Going further

Pair it with the website build for the same product on two surfaces, and package your Expo conventions as a SKILL.md so your next app skips the setup conversation entirely.

Your takeaway

A real mobile app running on your own phone, spec'd by you and built by an agent you supervised — the Day 25 artifact that makes "I can build with AI" concrete in a way a screenshot of a chat never will.