Deploying to App Stores
1. Preparing for iOS Release
| Step | Description | Action |
|---|---|---|
| 1. Setup Apple Developer Account | Must have a paid Apple Developer account ($99/year) | Create account at developer.apple.com |
| 2. Create App ID | Unique identifier for your app in Apple ecosystem | Go to Certificates, Identifiers & Profiles → Identifiers → + |
| 3. Create Distribution Certificate | Used to sign apps for distribution (App Store or Ad-Hoc) | Go to Certificates → + → iOS Distribution |
| 4. Create Distribution Provisioning Profile | Links your app ID and certificate for distribution | Go to Profiles → + → iOS App Store |
| 5. Configure Xcode Project | Set correct bundle ID and signing settings | In Xcode, select target → Signing & Capabilities |
Example: Xcode Signing Configuration
<!-- In Xcode project settings -->
Bundle Identifier: com.yourcompany.yourapp
Development Team ID: ABC123DEF456
Provisioning Profile: Distribution
Code Signing Identity: iPhone Distribution
Note: Ensure all required capabilities (Push Notifications, In-App Purchase) are enabled in the App ID and Provisioning Profile.
Warning: Distribution certificates expire annually. Set a calendar reminder to renew before expiration.
| Feature | Status | Notes |
|---|---|---|
| App Store Connect API Access | NEW | Required for automated deployment via Fastlane or App Center |
| App Store Connect API Key | DEPRECATED | Legacy method; use App Store Connect API instead |
| Xcode Archive | NEW | Use Xcode 15+ for best iOS 17 support |
2. Creating App Store Connect Listing
Example: App Store Connect Setup
#!/bin/bash
# Create App Store Connect listing using fastlane
fastlane produce \
--app_name "MyReactNativeApp" \
--app_identifier com.example.myapp \
--company_name "Example Inc." \
--language English \
--sku myapp_123456 \
--team_name "Example Inc." \
--team_id "ABC123DEF456"
| Field | Description | Required | Notes |
|---|---|---|---|
| app_name | Name of the app as it appears in the App Store | Yes | Must be unique across all apps in the store |
| app_identifier | Bundle identifier for the app (reverse domain notation) | Yes | Must match the identifier in your Xcode project |
| company_name | Company or developer name | Yes | Must match the team name in Apple Developer account |
| language | Primary language for the app listing | No | Defaults to English if not specified |
| sku | Unique identifier for the app in App Store Connect | No | Auto-generated if not provided |
| team_name | Team name in Apple Developer account | Yes | Must match the team name in Apple Developer account |
| team_id | Team ID in Apple Developer account | Yes | Required for authentication with App Store Connect API |
Note: The app name and identifier must exactly match the values in your Xcode project to avoid build errors.
Warning: App Store Connect listings cannot be deleted once created. Ensure all details are correct before finalizing.
3. Generating iOS Certificates and Profiles
Before deploying a React Native app to the App Store, you must generate the necessary iOS certificates and provisioning profiles. These are required for code signing and app distribution.
| Step | Description | Action |
|---|---|---|
| 1. Create Apple Developer Account | Sign up for an Apple Developer account if you don't already have one. | Visit Apple Developer Portal |
| 2. Create Certificate | Generate a distribution certificate for code signing. | Go to Certificates, IDs & Profiles → Certificates → Create Certificate |
| 3. Create Provisioning Profile | Create a distribution provisioning profile to include your app in the App Store. | Go to Provisioning Profiles → Create Profile |
| 4. Download Certificates | Download and install the certificates to your keychain. | Double-click downloaded .cer files |
Example: Code Signing Configuration
security create-keychain -p "keychain_password" build.keychain
security default-keychain -d user -s build.keychain
security unlock-keychain -p "keychain_password" build.keychain
security import /path/to/AppleWWDRCA.cer -k ~/Library/Keychains/build.keychain
security import /path/to/certificate.p12 -k ~/Library/Keychains/build.keychain -P "password"
Note: Ensure that the certificate and profile match the app's bundle ID.
Warning: Never commit sensitive certificates or passwords to version control.
| Certificate Type | Usage | Expiration |
|---|---|---|
| Distribution Certificate | Used to sign apps for App Store distribution | 3 years |
| Development Certificate | Used for development and testing | 1 year |
4. Building iOS Archive
Building an iOS archive is a critical step in preparing your React Native app for submission to the App Store. This process creates a .ipa file that contains your app's binary and resources.
| Step | Description | Action |
|---|---|---|
| 1. Configure Xcode Project | Ensure your project is properly configured for iOS deployment. | Open ios/YourApp.xcworkspace in Xcode and verify the bundle identifier matches your App Store configuration. |
| 2. Set Build Configuration | Set the build configuration to Release mode. | In Xcode, select Release from the build configuration dropdown in the toolbar. |
| 3. Archive the Project | Initiate the archive process in Xcode. | Go to Product > Archive in the menu bar. Xcode will compile and package your app. |
| 4. Validate Archive | Validate the archive before uploading to App Store Connect. | After archiving, Xcode will open the Archive window where you can validate and upload your app. |
Example: Xcode Archive Settings
export CODE_SIGN_IDENTITY="iPhone Distribution: Your Name (Team ID)"
export PROVISIONING_PROFILE="Your Provisioning Profile UUID"
export DEVELOPMENT_TEAM="Team ID"
Note: Ensure that your code signing identity and provisioning profile are correctly set up in Xcode before archiving.
Warning: The archive process can take several minutes depending on the size of your app and build configuration.
5. Uploading to App Store
Example: Upload to Apple App Store
#!/bin/bash
# Build the app for release
npx react-native run-ios --configuration Release
# Archive in Xcode
# Open Xcode & Archive the project
# Upload via Xcode Organizer
# Select archive & click "Upload to App Store"
| Step | Description | Notes |
|---|---|---|
| 1. Build Release Version | npx react-native run-ios --configuration Release |
Ensure all dependencies are installed |
| 2. Archive in Xcode | Open project in Xcode → Product → Archive | Must be done on macOS with Xcode installed |
| 3. Validate & Upload | Use Xcode Organizer to upload to App Store Connect | App Store Connect must be set up with correct credentials |
Note: Ensure your app is properly configured with the correct bundle ID, version number, and icons before uploading.
Warning: App Store reviews can take several days to complete. Make sure all metadata and screenshots are ready before submission.
6. Preparing for Android Release
| Step | Description | Action |
|---|---|---|
| 1. Generate Keystore | Creating a keystore for signing Android builds | keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000 |
| 2. Store Keystore Securely | Save keystore in a secure location and set permissions | Store in project root or CI/CD system with restricted access |
| 3. Update gradle.properties | Configure keystore path and credentials | |
| 4. Configure build.gradle | Set up release build configuration | |
Note: Ensure keystore and passwords are not committed to version control.
Example: AndroidManifest.xml Configuration
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
<application
android:name=".MainApplication"
android:label="@string/app_name"
android:icon="@mipmap/ic_launcher"
android:theme="@style/AppTheme">
<activity
android:name=".MainActivity"
android:label="@string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
android:windowSoftInputMode="adjustResize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
7. Generating Signed APK/AAB
| Step | Description | Action |
|---|---|---|
| 1. Create Keystore | Generate a keystore file to sign your app | keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000 |
| 2. Configure Gradle | Update android/app/build.gradle with keystore path and credentials |
|
| 3. Build Release APK | Generate a signed APK for distribution | cd android && ./gradlew assembleRelease |
| 4. Build Release AAB | Generate an Android App Bundle for Google Play | cd android && ./gradlew bundleRelease |
Note: Store your keystore file securely and never commit it to version control.
Example: Keystore Configuration
const fs = require('fs');
const path = require('path');
// Ensure keystore and credentials are in place
const keystorePath = path.resolve(__dirname, 'my-release-key.keystore');
if (!fs.existsSync(keystorePath)) {
console.error('Keystore not found. Please generate one.');
process.exit(1);
}
8. Creating Google Play Console Listing
Example: Basic Play Store Listing Configuration
{
"app": {
"name": "MyReactNativeApp",
"description": "A React Native app for mobile users",
"screenshots": [
"screenshot1.png",
"screenshot2.png"
],
"category": "PRODUCTIVITY",
"contactEmail": "support@example.com"
}
}
| Field | Description | Required |
|---|---|---|
| app.name | Name of the app as it will appear in the Play Store | Yes |
| app.description | Full description of the app’s features and functionality | Yes |
| app.screenshots | List of image files for the app’s showcase | Yes |
| app.category | App category (e.g., PRODUCTIVITY, GAME) | Yes |
| app.contactEmail | Email address for support inquiries | Yes |
Note: Screenshots must be in PNG or JPEG format, at least 1080x1920 pixels.
Warning: App name and description must comply with Google Play Store policies.
Key Steps to Create Play Store Listing
- Create a Google Play Developer account
- Upload app icon and screenshots
- Fill in app details (name, description, category)
- Set up contact information and privacy policy
- Review and publish the listing
9. Uploading to Google Play
Note: This guide assumes you have already built your React Native app for Android and have a signed
.apk or .aab file ready for upload.To upload your React Native app to the Google Play Store, follow these steps:
Upload Process
- Create a Google Play Developer Account (if you don't have one already). The registration fee is $25.
- Prepare your app assets:
- App icon (1024x1024 PNG)
- Screenshots (up to 8, min 320x180 pixels)
- Feature graphic (1024x500 PNG)
- Description and title
- Generate a signed APK or AAB:
cd android ./gradlew assembleRelease - Upload to Google Play Console:
- Navigate to Google Play Console
- Select your app or create a new one
- Go to App releases > Internal testing or Production
- Upload your
.aabfile
- Fill in Store Listing details:
- Title, description, category
- Privacy policy URL
- Contact email
- Review and publish
| Step | Description | Details |
|---|---|---|
| App Signing | Google Play handles app signing for you | Upload your .aab file. Google Play will sign it with a new key. |
| Release Track | Choose where to release your app | Internal testing, Closed testing, Open testing, or Production |
| APK vs AAB | Bundle format | .aab is preferred for better compression and security. NEW |
Example: App Store Listing Metadata
{
"title": "My Awesome React Native App",
"shortDescription": "A fast and responsive mobile app built with React Native.",
"fullDescription": "This is a full description of the app...",
"category": "PRODUCTIVITY",
"contactEmail": "support@example.com",
"privacyPolicyUrl": "https://example.com/privacy"
}
Key Points to Remember
- Use
.aabformat for better performance and security. - Ensure all assets meet Google Play’s requirements (e.g., image sizes, content policy).
- App signing is handled automatically by Google Play.
- Test your app thoroughly before publishing to Production.
Warning: Once an app is published to the Production track, you cannot revert to a previous version. Always test in Internal or Closed testing before promoting to Production.
10. Managing App Versioning for Updates
| Field | Value | Description |
|---|---|---|
| version | "1.0.0" |
App version string in semantic versioning format (MAJOR.MINOR.PATCH) |
| buildNumber | "1" |
Build number for store submission (iOS: CFBundleVersion, Android: versionCode) |
Example: Configuring version in package.json
{
"name": "my-react-native-app",
"version": "1.2.3",
"buildNumber": "5"
}
Example: iOS version settings in Info.plist
<key>CFBundleShortVersionString</key>
<string>1.2.3</string>
<key>CFBundleVersion</key>
<string>5</string>
Example: Android version settings in build.gradle
android {
compileSdkVersion rootProject.ext.compileSdkVersion
defaultConfig {
applicationId "com.myapp"
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode 5
versionName "1.2.3"
}
}
Note: For store updates, both version and buildNumber must be incremented to ensure the store recognizes it as a new release.
11. Handling App Review Process
Note: The app review process varies between Apple App Store and Google Play Store. This guide focuses on general best practices and common requirements.
| Step | Description | Requirements |
|---|---|---|
| Prepare App Store Metadata | Include app name, description, screenshots, and keywords. | App Store Connect dashboard |
| Build Release Version | Create a release build with optimizations and signing. | Xcode or Android Studio, valid certificates |
| Submit for Review | Upload build and metadata to the respective store. | App Store Connect or Google Play Console |
| Address Rejections | Fix issues reported by reviewers and resubmit. | Clear communication with review team |
Example: App Store Metadata Setup
// Example of setting up app metadata in Xcode
{
"CFBundleName": "MyReactNativeApp",
"CFBundleIdentifier": "com.mycompany.myreactnativeapp",
"CFBundleVersion": "1.0.0",
"CFBundleShortVersionString": "1.0.0"
}
App Review Workflow
- Prepare release build with proper signing
- Upload to App Store Connect or Google Play Console
- Fill in metadata (description, screenshots, etc.)
- Submit for review
- Monitor status and respond to feedback