Learn to build a mobile app from scratch by directing AI coding agents — Cursor, Claude Code, Codex and prompt-to-app builders — with a stack that works: Expo, React Native, Tailwind (NativeWind), Expo Router, Zustand and TanStack Query, SQLite, and Supabase, PostgreSQL, Firebase or Turso.
Every chapter explains the concept in plain language, shows the smallest working example, and ends with copy-paste prompts for Cursor, Claude Code and Codex, a Claude Code skill for the step, and links to our Cursor rules database, AI style prompts and blogs. You stay in charge of the plan, the data and the review; the agent does the typing.
Roadmap (Things to Learn)
- Vibe Coding Foundations & the Agentic Workflow
- Mobile App Fundamentals for Vibe Coders
- Expo Setup & Project Structure
- UI with Tailwind (NativeWind) & Design Systems
- Pages, Routing & Navigation
- State Management
- Mobile Storage & Memory
- Databases & Backends: Supabase, PostgreSQL, Firebase & Turso
- Auth, Security & Secrets
- AI Features, APIs & Payments
- Testing Mobile Apps (Jest, Testing Library, Maestro & AI QA)
- Debugging & Reviewing AI-Generated Code
- Build, Release & Over-the-Air Updates
- AI App Builders & Other Vibe Coding Tools
- Prompt, Rules & Skills Library
- Capstone Projects & Launch Plan
- FAQ & Troubleshooting for Expo Vibe Coders
Who this is for
- Vibe coders who can describe an app but want to understand what the agent builds
- Web developers moving to mobile with Expo and React Native
- Founders and designers shipping a first app without a large team
- Developers who want a repeatable, reviewed workflow for AI-assisted mobile builds
The stack at a glance
| Layer | Pick | Chapter |
|---|---|---|
| AI tools | Cursor, Claude Code, Codex, app builders | Vibe Coding Foundations, AI App Builders |
| Framework | Expo + React Native + TypeScript | Mobile Fundamentals, Expo Setup |
| UI | NativeWind (Tailwind), Reanimated, Rive | UI with Tailwind |
| Navigation | Expo Router | Pages, Routing & Navigation |
| State | Zustand, TanStack Query | State Management |
| Device storage | SecureStore, MMKV, SQLite | Mobile Storage & Memory |
| Backend | Supabase, PostgreSQL, Firebase, Turso | Databases & Backends |
| Quality | Jest, Testing Library, Maestro, Sentry | Testing, Debugging |
| Release | EAS Build, Submit, Update | Build, Release & Updates |
How to use this roadmap with an AI agent
- Read the chapter's story and core concepts so you know the vocabulary.
- Copy the chapter's prompts into your agent in plan mode and review the plan.
- Install the chapter's skill or rules so the agent repeats the procedure.
- Build the mini project on a real device, then commit.
- Move to the next chapter.
Databases on iHateReading that support this roadmap
- Cursor rules: 250+ rules with their own pages, by category and technology
- AI style prompts: visual style prompts for icons, splash screens and store art
- Top mobile apps: study rankings, categories and developers
- SaaS directories: launch lists for your finished app
- Universo: curated tools and websites
- All databases: the full index
Concept videos
YouTube channels and searches for these topics. On a large screen they open in the reading panel next to the roadmap.
- Expo and React Native — Expo channel
- Cursor — Cursor channel
- Claude Code — Anthropic channel
- Mobile app projects — notJust.dev channel
What Is It?
This roadmap is a step-by-step path for building iOS and Android apps with AI coding agents, using Expo and Tailwind as the foundation.
It is organised like our other roadmaps: ordered chapters with core concepts, videos, explanations, examples, mini projects and interview questions, plus prompts, skills and rules specific to vibe coding.
Why Should I Care?
AI agents make building fast, but speed without understanding produces apps you cannot debug, secure or ship. This path teaches the concepts behind each prompt.
By the end you have a repeatable workflow and a finished app on the stores.
Real World Analogy
This roadmap is a driving school for a self-driving workshop: you learn the road rules and the controls, and you stay in the driver's seat even when the AI does the steering.
Visual Mental Model
Foundations -> Mobile basics -> Expo -> UI -> Screens -> State
-> Storage -> Databases -> Auth -> AI + Payments
-> Testing -> Debugging -> Release -> Prompt library -> CapstoneBeginner Explanation
Start with Vibe Coding Foundations, then follow the chapters in order while building one small app. Use the prompts and skills as you go.
Key Takeaways
- You direct, the agent builds, and you review every change.
- Expo, NativeWind and a small set of libraries keep generated code consistent.
- Match data to storage, put secrets on the server and enforce access rules where the data lives.
- Test critical paths and test on real devices before every release.
Resources
The 60-second story
Learning to build apps with AI is like learning to drive a car that can steer itself. You still need to know the road rules, read the dashboard and decide where to go, because the car will confidently drive into a wall if you point it there.
This roadmap is the driving school. First you learn the controls (vibe coding foundations), then how roads work (mobile fundamentals), then you build the route one stretch at a time, checking mirrors (tests and reviews) before every turn. At the end you drive the whole trip yourself, with the AI doing the steering and you doing the thinking.
Mental model: you decide where to go, the agent drives, and you check the road.
