Back to blog

Development

How to Ship a Production-Grade App to the App Stores Without Writing a Single Line of Code

Using Claude and Codex to go from idea to published, even if you’ve never coded a day in your life.

Date9 June 2026
Read11 min
ByPM
Ship with AI.png
Ship with AI.png

There’s a category of apps on the App Store and Google Play that almost nobody talks about. They’re not flashy. They don’t go viral on Twitter. But they rack up hundreds of thousands of downloads, charge a simple subscription, and quietly generate real revenue every month. They solve one boring, specific problem, and they solve it just well enough.

This article is about how to build one of those apps. Not by learning to code. Not by hiring a team. But by using AI, specifically Claude and Codex, to take you from a raw idea to a live, published app on both stores. I’m going to walk you through the entire process, step by step.

If you get stuck at any point, feel free to reach out to me on LinkedIn or via email. I’m happy to help.

Step 1: Find the Right App to Build

Skip the passion projects for now. The goal here is execution speed and market validation. Here’s how to find an app worth building:

Go browsing on the App Store. Navigate through the top charts in categories like Utilities, Health & Fitness, Productivity, or Lifestyle. You’re looking for apps that:

  • Do one thing, not twenty.

  • Have a high number of downloads or ratings.

  • Have a simple, obvious monetization model (usually a subscription or one-time purchase)

  • Are visually boring or clearly outdated

Download a few of the most promising ones. Use them for a day or two. Pay attention to how they make money and where they put the paywall. Is it a free trial? A hard gate? A premium upgrade?

Now go read the reviews. This is the most important part. You’re not looking for apps people love; you’re looking for apps people use despite their frustrations. Look for patterns in the complaints: “The UI is confusing,” “It crashed twice this week,” “Why can’t I do X?” High downloads plus a lot of complaints is the sweet spot. That’s your opportunity.

Pick the one that feels most approachable to you, not necessarily the biggest, but the one where you genuinely feel like you could do this better.

Step 2: Document Everything About That App

Once you’ve chosen your target, take a screenshot of every single screen in the app. Navigation menus, onboarding flows, settings pages, empty states, error messages, everything. Most apps have somewhere between 15 and 40 screens. Get them all.

Now open a new ChatGPT conversation (you’ll need a version that supports image uploads, like GPT-4o). Before you start uploading, tell ChatGPT something like:

“I’m going to upload a series of screenshots. Please don’t analyse or respond to them yet; just acknowledge each upload and wait until I tell you I’m done.”

This prevents ChatGPT from cutting you off or summarising prematurely. Upload all your screenshots. Then, once they’re all in, prompt it:

“Now that you have all the screenshots, please give me a thorough breakdown of this app. Describe every screen, every UI pattern, the overall design language, the user flow from onboarding to core features, the monetisation placement, and any patterns in functionality you can identify.”

ChatGPT will produce a detailed, structured breakdown of the entire app. Copy that entire response; you’ll use it in the next step.

Step 3: Create Your Product Specification with Claude

Open Claude and paste in the full breakdown you got from ChatGPT. Now you’re going to use it as the foundation for your product spec. Prompt Claude like this:

“Based on this app breakdown, I want you to create a detailed product.md file. This should be a complete product specification that includes: full feature requirements, user flows, a design system, tech stack recommendations, and architecture decisions. Make everything production-grade and optimised for cost and scalability. The design should follow [your preference e.g. ‘a clean monochromatic black and white aesthetic’]. I want this to serve as the single source of truth for building the entire app.”

Claude will generate a comprehensive product specification document. Download this file. It’s the blueprint everything else is built from.

Why Claude for this step? Claude’s current version is particularly strong at structured thinking, document generation, and scaffolding decisions. It produces cleaner, more coherent specs than most alternatives.

Step 4: Set Up Your Development Environment

If you’ve never set up a coding environment before, this part sounds scary. It isn’t. It’s mostly just installing things.

Open Claude and ask it:

“I want to set up a mobile app development environment on my [Mac / Windows PC]. I’m a complete beginner. Please give me step-by-step instructions, and explain what each tool is for.”

Follow the instructions. If anything is unclear, ask Claude to explain it further; that’s what it’s there for. You’ll be installing things like Node.js, a package manager, and a code editor. None of it requires you to understand how it works deeply.

Install VS Code (Visual Studio Code) if you haven’t already. It’s free, and that is where you’ll do most of your work. Once it’s installed, open the Extensions panel on the left sidebar and install:

  • Claude Code (Anthropic’s official VS Code extension)

  • Codex (OpenAI’s coding assistant)

Alternatively, ask ChatGPT or Claude: “How do I set up Claude Code and Codex in VS Code?” and follow their instructions.

Step 5: Set Up Your Project Structure

Create a new folder on your computer for your project. Give it a simple, clean name. Open that folder in VS Code.

Take the product.md file you downloaded earlier and drop it into this folder. This is your north star; everything the AI builds will reference it.

Now, inside VS Code, open the Codex chat and tell it:

“Set up a monorepo using Turborepo for a mobile app project. The project details are in the product.md file in this folder.”

What’s a monorepo? It’s a way of organising your code so that all parts of your project the mobile app, the backend, shared utilities live in one place and can be managed together. Turborepo is a tool that makes this easier. The main reason to do it this way is that it gives the AI a clean, predictable structure to work within, which leads to better results.

Step 6: Let Claude Build the First Draft

Once the project structure is in place, switch to Claude Code and tell it:

“Please read the product.md file in this project and begin building everything in it. Start with the core architecture and work through the features systematically.”

Then let it run. Claude will start generating files, setting up the project, and building components. Whenever it asks you for confirmation or approval, just say yes. You don’t need to understand every decision it’s making at this stage; that comes later.

When it’s done (or pauses), ask it:

“What have you built so far, and what still needs to be done? Grade the overall completion against the product.md file and give me a percentage breakdown by section.”

This gives you a clear picture of where things stand.

Why Claude for the first build? Claude currently does better work than Codex when it comes to initial scaffolding, setting up the architecture, creating the file structure, and establishing patterns. Think of it as the architect.

Step 7: Hand It to Codex to Refine and Complete

Now switch to Codex and run the same kind of audit:

“Go through the entire project and compare it to the product.md file. What has been built? What’s missing? Show me a percentage breakdown of production readiness.”

Then start working through what’s left. Tell Codex:

“I want to push this to production-ready. Please complete the next batch of missing features and improvements, then give me an updated production readiness percentage.”

Keep doing this. The loop is simple: ask what’s done, ask it to do more, ask again. Each cycle moves the percentage closer to 100%.

Why Codex for this stage? Codex generally writes cleaner, more precise code than Claude for complex implementation work. It’s the builder.

Step 8: Handle Your Environment Variables and Third-Party Services

At some point, Codex will tell you it needs certain values to proceed, things like API keys, database URLs, or service credentials. Don’t panic. This is normal.

Ask Codex (or Claude):

“You mentioned you need [X]. Where do I get this, and how do I set it up?”

It will walk you through creating accounts with services for your database, payments, and other stuff, depending on what your app needs. Follow the instructions, create the accounts, and get the keys.

Important: Create a file in your project called .env (just that, no extension). This is where all your secret keys and credentials go. Never paste them directly into the AI chat; keep them in this file. The AI already knows how to read from .env; you just have to fill it in.

Continue the production readiness loop until Codex tells you the app is production-grade.

Step 9: Preview the App on Your Phone

You should be seeing your app take shape, but you need to actually use it on a real device. For this, you’ll use Expo. It's a platform that lets you run your React Native app directly on your phone without any need to build a full binary.

Ask Codex:

“Is Expo set up in this project? If not, please set it up and tell me what I need to do on my end to preview the app on my phone.”

Go to expo.dev and create a free account. Download the Expo Go app on your iPhone or Android. Follow whatever instructions Codex gives you to connect them.

Once you can see your app running on your phone, start testing properly. Tap everything. Go through every flow. Anything that looks wrong, doesn’t work, or feels off, tell Codex:

“When I tap [X], [Y] happens. That’s not right. Please fix it.”

It will fix it. Repeat until the app feels solid.

Step 10: Apply Proper Design Principles

This is where you take the app from functional to polished. Apple and Google have official design guidelines:

  • Apple: Human Interface Guidelines, focused on clarity, depth, and intuitive gesture-driven navigation.

  • Google: Material Design, focused on layered surfaces, adaptive color, and consistent component behaviour

You don’t need to read all of it. Let the AI do the heavy lifting:

Open a Claude chat and ask:

“Please do a deep research on Apple’s Human Interface Guidelines and Google’s Material Design 3. Then create a design.md file that summarises the key best practices for both platforms, focused on mobile app UI, component design, navigation patterns, and typography.”

Download the design.md file, drop it into your project folder, and then tell Claude Code:

“Please review the design.md file and apply the relevant best practices to the app’s UI. Follow the Apple HIG for the iOS version and Material Design for the Android version where they differ.”

Claude will work through the UI and make adjustments. The result won’t be pixel-perfect, but it will be significantly more polished and aligned with what each store’s reviewers expect.

Step 11: Set Up Your Developer Accounts

To publish on the App Store and Google Play, you need developer accounts with Apple and Google.

Set these up before you need them. The Apple account in particular can take a few days to be approved.

Step 12: Submit to the Stores

Once your app is production-ready and you’re happy with the design, ask Codex:

“Walk me through the full process of submitting this app to the Apple App Store and Google Play Store. Include what I need to prepare, screenshots, descriptions, icons, build files, and how to generate them.”

Follow the instructions step by step. Both platforms have a review process: Google’s usually takes a few days, Apple’s can take up to a week. If anything gets rejected, the reviewer will tell you why, and you can just take that feedback back to Codex and ask it to fix the issue.

A Few Things Worth Knowing

This approach works best for focused, single-feature apps. The more complex the app, the more user types, real-time data, and complex permissions, the more you’ll need to understand what’s being built. But for a clean, well-scoped utility app, this process holds up well.

The AI will not always get it right the first time. That’s fine. Your job is to test, observe, describe what’s wrong, and send it back. Think of yourself as the product manager, not the developer.

Your .env file is sensitive. Never commit it to GitHub. Never share it. If you’re not sure what that means, ask Claude to explain how to add it to your .gitignore file.

Keep your product.md updated. As your app evolves, update the spec. It becomes the single source of truth for every future build session.

Summary: The Full Loop

  1. Find a boring, high-download app with lots of complaints.

  2. Take screenshots of every screen; get ChatGPT to describe the full product.

  3. Use Claude to generate a production-grade product.md

  4. Set up your dev environment and VS Code extensions.

  5. Use Claude Code to scaffold the architecture.

  6. Use Codex to build, iterate, and hit production readiness.

  7. Handle .env credentials as you go.

  8. Preview on your phone via Expo and test everything.

  9. Apply HIG and Material Design principles via design.md

  10. Create your developer accounts.

  11. Submit, respond to feedback, and publish

If you’re stuck at any point in this process, reach out to me on LinkedIn or by email. This stuff is more accessible than it looks; you just need the right loop.

Newsletter

Get the next note in your inbox.

Short updates on what I am building, learning, and thinking through. You will confirm your email before joining.