How to Use This Guide with AI Coding Assistants
This guide is designed to work seamlessly with AI coding assistants like Claude, ChatGPT, Cursor, GitHub Copilot, and others. Here's how to get the most out of it.
Why This Guide + AI = Superpower
Traditional tutorials give you code. This guide gives you context.
When you feed this guide to an LLM, it understands:
- The architecture patterns you're using
- The specific libraries and versions
- Best practices for React Native + Expo
- Common pitfalls to avoid
Result: The AI generates code that actually fits your project, not generic examples.
Quick Start: Feed This to Your AI
Option 1: Full Context (Recommended)
Copy and paste the entire guide into your AI assistant's context window, then start asking questions:
[Paste the entire guide here]
---
I'm building a [describe your app]. Help me implement [specific feature] following the patterns in this guide.Option 2: Section-Specific Context
For focused help, paste only the relevant sections:
[Paste Part 1: Tech Stack + Appendix C: Essential Features]
---
Help me set up dark mode with the theme system described above.Option 3: Use as System Prompt
For ongoing sessions, set this as your system prompt:
You are a React Native expert helping me build an app using:
- Expo SDK 55 with Expo Router
- Convex for backend and auth
- RevenueCat for payments
- Zustand for state management
- TanStack Query for server state
- TypeScript in strict mode
Follow these patterns:
- Use functional components with hooks
- Prefer Zustand stores over Context
- Always use document-level access control in Convex
- Never expose API keys in client code
- Use Edge Functions for sensitive operations
When generating code, match the style and patterns from this guide.Effective Prompts for Each Phase
Day 1-2: Project Setup
Using the Expo + Convex setup from this guide, create:
1. The complete app/_layout.tsx with proper providers
2. A Convex client with AsyncStorage persistence
3. The folder structure for a [type] app
Follow the patterns exactly as shown in the guide.Day 3: Core Feature Development
I'm building [describe feature]. Based on the guide's patterns:
1. Create the Convex table schema with access control rules
2. Create a Zustand store for the feature state
3. Create the main screen component
4. Create an Edge Function if API calls are needed
Use the exact patterns from Part 1 and Appendix A.Day 4: Payments
Following the RevenueCat setup in this guide:
1. Create the usePremium hook as shown
2. Create a paywall screen with package selection
3. Create a useCredits hook for a freemium model with [X] free daily uses
Match the code style exactly.Day 5-6: Polish
Based on Appendix C, implement these features for my app:
1. Dark mode with ThemeContext
2. Push notifications with the patterns shown
3. Onboarding flow (3 screens about [topics])
4. Form validation for [form type]
Use the exact component patterns from the guide.Prompt Templates
Generate a New Screen
Create a new screen for [purpose] following this guide's patterns:
- Use SafeAreaView and proper insets
- Use the theme colors from ThemeContext
- Add keyboard handling for any inputs
- Include loading and error states
- Match the Button and styling patterns shown
The screen should [describe functionality].Generate a Convex Table + CRUD
For a [feature] in my app, create:
1. SQL table schema with appropriate columns
2. access control rules (users can only access their own data)
3. TypeScript type matching the schema
4. CRUD functions using Convex client
5. TanStack Query hooks for the operations
Follow the database patterns from Appendix D.Generate an Edge Function
Create a Convex Function that:
- [Describe what it does]
- Includes rate limiting (max X requests per minute)
- Validates the user is authenticated
- Handles errors gracefully
- Returns proper JSON responses
Follow the Edge Function patterns from Appendix A.Debug an Issue
I'm getting this error in my React Native app:
[Paste error]
My setup follows this guide:
- Expo SDK 55
- Convex for backend
- [Other relevant details]
Here's my code:
[Paste relevant code]
What's wrong and how do I fix it following the patterns in this guide?Best Practices for AI-Assisted Development
DO:
- Provide context - Always mention you're using the patterns from this guide
- Be specific - "Create a login screen" vs "Create a button"
- Ask for explanations - "Explain why this pattern is used"
- Iterate - "Now add error handling" → "Now add loading state"
- Verify - Always review generated code before using
DON'T:
- Don't blindly copy - Understand what the code does
- Don't skip types - Ask for TypeScript types if missing
- Don't ignore security - Always check for exposed keys, missing RLS
- Don't forget tests - Ask for test cases for critical logic
Section-by-Section AI Usage
| Section | Best Used For |
|---|---|
| Part 1: Tech Stack | Initial project setup, architecture decisions |
| Part 2: 7-Day Roadmap | Day-by-day implementation guidance |
| Part 3: Checklist | Pre-submission verification |
| Part 4: AI Assets | App Store content creation |
| Part 5: 7 Mistakes | Debugging common issues |
| Part 6: Quick Reference | Quick lookups, code snippets |
| Appendix A: Edge Functions | API integrations, AI features |
| Appendix B: Store Setup | App Store/Play Store configuration |
| Appendix C: Features | Adding specific features |
| Appendix D: Database | Schema design for different app types |
Troubleshooting AI Responses
AI generates code that doesn't match the guide
That doesn't match the patterns from this guide. Please regenerate using:
- Zustand (not Redux or Context)
- Convex (not Firebase)
- Expo Router (not React Navigation)
- The exact styling patterns shown (StyleSheet, theme colors)AI is missing security considerations
Please update this code to:
1. Add access control rules as shown in the guide
2. Move API keys to Edge Functions
3. Add proper error handling
4. Validate user authenticationAI generates outdated code
Please update to use:
- Expo SDK 55 patterns
- expo-router v4 syntax
- TanStack Query v5 syntax
- Current Convex JS v2 patternsPro Tip: The more context you give your AI, the better the output. This guide provides that context. Save this page as a reference for your AI prompts!
AI-Ready Codebase
Clean code that AI tools understand
Well-structured, documented code that works great with Cursor, Copilot, and ChatGPT.
TypeScript throughout
Clear architecture
Documented patterns
Get ShipReactNative
Save 40+ hours of setup