React Native Migration Developer

12views
Updated on: September 7, 2026

Perform full-stack React Native migration with this AI prompt, including codebase analysis, feature mapping, backend integration, and complete production-ready mobile app generation.

React Native Migration Developer

## Role

You are a senior full-stack architect and React Native migration expert with deep expertise in cross-platform mobile development, API integration, state management, and production-grade application architecture.

## Task

Perform comprehensive static analysis of three codebases and deliver a complete, production-ready React Native application that faithfully recreates all functionality from the benchmark web application. Conduct thorough comparative analysis to identify discrepancies, missing features, broken user flows, backend integration gaps, state management issues, and architectural inconsistencies. Map every user-facing feature, authentication flow, data persistence mechanism, API endpoint, third-party integration, and navigation pattern from the Replit benchmark.

## Context

**Replit web app (benchmark):**  
{{replit-benchmark}}

**ChatGPT React Native version:**  
{{chatgpt-version}}

**Claude React Native version:**  
{{claude-version}}

**Critical requirements:**  
{{critical-requirements}}

## Analysis Process

Document the complete feature inventory from the Replit web app as your source of truth. Create a detailed comparison matrix identifying what exists in the benchmark versus what's missing or broken in both ChatGPT and Claude React Native versions.

Analyze:
- Authentication flows and authorization logic
- Navigation architecture and routing patterns
- State management patterns (stores, contexts, reducers)
- API integration approaches and endpoint mappings
- Data models and schemas
- UI component hierarchies and design patterns
- Business logic implementation
- Error handling and edge cases
- Backend services, database schemas, API endpoints
- External integrations and environment variables

## Application Requirements

Generate the complete React Native application with:

- Full project directory structure with all folders and files
- package.json with all dependencies, versions, and scripts
- Environment configuration files (.env templates, config files)
- Navigation setup with all screens, flows, and deep linking
- Complete component library matching all UI from benchmark
- State management implementation with proper architecture
- API service layer with all endpoints, authentication, and error handling
- Authentication and authorization logic with token management
- Data persistence and caching strategies (AsyncStorage, SQLite, etc.)
- Comprehensive error handling, validation, and user feedback
- Platform-specific configurations for iOS (Info.plist, Podfile) and Android (build.gradle, AndroidManifest.xml)
- Build configuration files and scripts
- Any required backend/serverless functions or API proxies

Ensure:
- Every user flow from the benchmark is fully functional with no missing features
- All integrations are properly connected and tested
- Responsive UI that works across phone and tablet screen sizes
- Proper error states, loading indicators, and empty states
- Optimized performance (lazy loading, memoization, efficient re-renders)
- Production-ready code quality with TypeScript typing, meaningful comments, and inline documentation

## Output

Deliver your analysis and implementation in five clearly organized markdown sections:

1. **Executive Analysis Summary** – comparison findings presented as a feature matrix showing what exists in the benchmark, what's present/missing/broken in the ChatGPT version, and what's present/missing/broken in the Claude version. Highlight critical gaps and architectural issues.

2. **Complete File Structure** – full directory tree showing every folder and file in the React Native project, organized by function (components, screens, services, navigation, state, utils, config, assets).

3. **Full Source Code** – every file's complete implementation with proper syntax highlighting (use ```typescript, ```javascript, ```json, ```xml as appropriate), meaningful comments explaining complex logic, and consistent formatting. Ensure the code is copy-paste ready.

4. **Configuration and Setup Instructions** – step-by-step guide covering dependency installation, environment variable setup, iOS/Android native dependencies (CocoaPods, Gradle), development server launch, and troubleshooting common setup issues.

5. **Build and Deployment Guide** – instructions for building release versions for both iOS and Android, including code signing, environment configurations, build commands, and submission preparation for App Store and Google Play.

Use markdown code blocks with language identifiers for all code. Ensure the entire application is immediately implementable without additional research or placeholder resolution.

Prompt Guide

What this prompt doesHere's exactly what you get when you run it.

Analyzes three app codebases to find differences and problems between web and mobile versions

Compares mobile AI prompt outputs against the original web app to spot missing features and broken parts

Creates a complete working React Native app with all code, setup files, and connections needed for iOS and Android

Tips for this prompt
  • Before running this AI promptcreate a detailed feature checklist from your Replit web app to ensure the migration captures every user flow, button, and integration point your customers depend on.
  • Use the AI prompt outputas your foundation, then immediately test each core user journey on both iOS and Android simulators to catch platform-specific issues the static analysis might miss.
  • After generating the complete codebasewith this AI prompt, have your development team review the backend API connections and authentication flows first, as these integration points typically need the most adjustment for mobile environments.
How to use the promptA simple 3-step workflow to get the best results.
  1. 1
    # How To Use The Prompt?
  2. 2
    Fill in the three ZIP files for your app

    the [REPLIT WEB APP], the [REACT NATIVE VERSION FROM CHATGPT], and the [REACT NATIVE VERSION FROM CLAUDE] by uploading them when you use this AI prompt.

  3. 3
    Example

    Upload "my-app-replit.zip" as your Replit web app benchmark, "my-app-chatgpt-mobile.zip" as the ChatGPT React Native version, and "my-app-claude-mobile.zip" as the Claude React Native version.

No Perfect Match?

Generatea Custom Prompt

Generate

Transform your web app into a fully functional mobile experience with this comprehensive AI prompt designed for senior architects and development teams. This AI prompt delivers a complete React Native migration by analyzing your existing codebase, identifying gaps, and generating production-ready mobile code that works seamlessly across iOS and Android platforms.

  • Eliminate migration risks by conducting thorough static analysis across multiple codebases to catch missing features and architectural flaws before deployment.
  • Accelerate time-to-market with automated code generation that includes full project structure, dependencies, and configuration files ready for immediate build.
  • Ensure feature parity and backend integration by systematically mapping all user-facing functionality against your original web application benchmark.

This AI prompt serves as your dedicated migration expert, comparing different implementation approaches and selecting the best architectural patterns for your mobile app. It addresses critical concerns like state management, API connectivity, and cross-platform compatibility while generating complete source code that requires minimal manual intervention.

Achieve a flawless web-to-mobile transition with this AI prompt that delivers enterprise-grade React Native applications ready for production deployment.

Get prompts like this every week

One email a week with engineered prompts, new tools, and model updates. Unsubscribe anytime.

Join 100,000+ subscribers. One email a week, real prompts, tools, and model updates. Unsubscribe anytime.