quiccsite

How to Build a Mobile App with Claude Code (No Mobile Experience Needed)

If you are a web developer who has thought about building a mobile app but been put off by Xcode, Android Studio, or the sheer unfamiliarity of it all, Claude Code can get you surprisingly far. You will not become a mobile expert overnight, but you can ship a real app to both platforms using skills you already have.

Pick the right framework

Start with Expo. It is built on top of React Native, so if you know React and TypeScript, most of the code will feel familiar. Expo handles the painful parts — build tooling, native module linking, and device configuration — so you can focus on building screens. Claude has deep knowledge of React patterns, which means it can generate idiomatic component code, hooks, and navigation structures without much hand-holding.

If you need a native module that Expo does not support, you can eject to bare React Native later. But start with Expo. The managed workflow eliminates an entire class of problems you do not want to debug on day one.

The initial setup prompt

Once you have Expo CLI installed (npx create-expo-app), open Claude Code in the project directory and give it a prompt that establishes the foundation:

Set up a tab-based navigation structure with three screens: Home, Search,
and Profile. Use expo-router for file-based routing. Use TypeScript.
Add a basic header component shared across all screens.

Claude will scaffold the file structure, install the right dependencies, and wire up navigation. Review what it produces. For more complex apps, use plan mode to design the screen flow and data model before generating code. Make sure the project runs in the simulator before moving on. This is your checkpoint.

Build screens iteratively

Do not try to describe the entire app in one prompt. Build one screen at a time. Get it rendering, looking right, and handling basic interactions before moving to the next.

A good pattern:

  1. Describe the screen layout and purpose in a single prompt.
  2. Let Claude generate the component, styles, and any local state.
  3. Run it in the simulator and verify.
  4. Follow up with refinements — adjust spacing, fix scroll behavior, add loading states.

This iterative loop works well because Claude can see your existing code and stay consistent with the patterns it already established.

Handling navigation

Expo Router uses file-based routing similar to Next.js. If you are coming from the web, this will feel natural. Tell Claude which navigation pattern you want — tabs, stack, drawer — and it will set up the layout files accordingly. For passing data between screens, use route parameters or a lightweight state management solution like Zustand. Claude handles both well.

One thing to watch: deep linking and authentication flows can get tangled if you are not explicit about which screens require auth and which do not. Spell that out in your prompt rather than assuming Claude will infer it. A CLAUDE.md file is the best way to capture these project-specific conventions so Claude remembers them across sessions.

Connecting to an API

If you have an existing backend, point Claude at your API endpoints and ask it to build a data layer. A prompt like this works:

Create a hook called useProjects that fetches from GET /api/projects,
handles loading and error states, and returns typed data.
The response shape is { projects: Array<{ id: string, name: string, createdAt: string }> }.

Claude will generate the fetch logic, TypeScript types, and error handling. If you use React Query or SWR on the web, ask for the same here — both work fine in React Native.

Common pitfalls

Platform-specific behavior. Some components render differently on iOS and Android. Shadows, for instance, use different properties on each platform. If something looks wrong on one platform, tell Claude which platform has the issue and it can apply the correct platform-specific fix.

Permissions. Camera, location, notifications, and file access all require explicit permission requests on mobile. Claude knows the Expo APIs for these, but you need to remember to ask. If a feature needs a permission, mention it in your prompt. Also update your app.json with the correct permission descriptions — App Store review will reject you without them.

Build tooling. EAS Build (Expo Application Services) handles cloud builds for both platforms. The configuration is straightforward but has enough options to trip you up. When you are ready to build, ask Claude to help configure eas.json for development, preview, and production profiles. Do a preview build early so you are not debugging build issues the night before you want to submit.

Keyboard avoidance. Forms on mobile need KeyboardAvoidingView or a library like react-native-keyboard-aware-scroll-view. This is something web developers almost never think about. If you are building any form, mention keyboard handling in your prompt.

Testing on simulators

Run npx expo start and press i for the iOS simulator or a for Android emulator. You need Xcode installed for iOS simulation and Android Studio for the Android emulator, but you do not need to know how to use either beyond launching the simulator itself.

Test on both platforms regularly. Things that work fine on iOS can break on Android and vice versa. If you only have a Mac, prioritize iOS testing in the simulator and use Expo Go on a physical Android device for spot checks.

Getting to the App Store

The submission process is its own project. Here is the short version:

Claude can help you write the store descriptions and generate the eas.json configuration for production builds. It cannot click the buttons in App Store Connect for you, but it can walk you through what each field expects.

Where Claude Code hits its limits

Be honest with yourself about what requires real mobile expertise. Complex animations with Reanimated, custom native modules written in Swift or Kotlin, advanced offline-first architectures, and deep platform integrations like HealthKit or ARKit are all areas where Claude can help write code but where you will need to understand what is happening underneath.

Push notifications, in-app purchases, and background tasks are technically possible to set up with Claude's help, but they involve enough platform-specific configuration that debugging problems requires some understanding of how iOS and Android handle these under the hood.

The bottom line

A web developer with Claude Code can realistically build and ship a straightforward mobile app — content feeds, forms, API-driven screens, tab and stack navigation, basic camera or location features. That covers a lot of useful apps. If you want a smaller-scope project to start with, try building a Chrome extension first. Start with Expo, build iteratively, test on both platforms early, and do not treat the app store submission process as an afterthought. You will learn mobile development along the way, which is the point.