Deploying React Native Apps to App Store and Play Market : Step-by-Step Guide

Deploying React Native Apps to App Store and Play Market : Step-by-Step Guide

 

Finally comes a moment when you have gone through “hell and high water” of development stage and now are ready to take your product into the light.

I have prepared a list of rules you should follow to deploy React Native app to the App Store or Play Market without ruffle or excitement. Most of the tips we provide can be used for deploying not only React Native app but a native one as well.

Before starting, ensure that you have developer's account for Android and iOS.

If everything is settled, let's see what you need to do before React Native app deployment.

Gather a required information for both Apps Store and Play Market

Here is the main information you need to deploy React Native app.

  • Name of the app
  • Short description

This description will be shown near the app's name in the store or when you share the app with others. (should have maximum 30 characters)

  • Long description with app's features and functionality
  • “What is new” text (optional)
  • URL with support information about your app (can be a website or email).
  • Rating

Itunes has an option to set the rating for the app your are going to deploy. You need to answer several questions about your project and, based on your answers, the rating will be set.

  • Bundle identifier

The standard of the name is “com.yourcompanyname.yourappname”, for example “com.facebook.facebookapp". This is a unique identifier for your app in the store.

  • Profile (brand, organization, customer) name for a store. For example: "Facebook","Google LLC" etc.
  • Some information about the publisher (see "Required information about the publisher")
  • Information about the app's version

Information required for the App Store

  • Keywords (need to be separated by commas).
  • List of countries your app will be available in— the entire world or some specific countries (optional)
  • 5 screenshots from the real 5.5 Iphone
  • Сategory of your activity
  • 1024x1024px square app icon without transparency
  • Copyright in the format YYYY Company Name
  • Demo account (If the app requires login)

Necessary information for Play Market

  • Сategory of your app
  • 512x512px app icon of any shape (can be transparent)
  • Several screenshots

Required information about the publisher

For this, you need to answer the following questions:

  • What is your first and last name?
  • What is the name of your organizational unit?
  • What is the name of your organization? (may be the same as Profile Name)
  • What is the name of your City or Locality?
  • What is the name of your State or Province?
  • What is the two-letter country code for this unit?
  • What is your (support) phone number?
  • What is your email? (may be the same as Dev Apple Id you used for deployment or Play Market Console account email)

 

Gain clarity with your project!

Remove any software development uncertainties through a qualified IT consultation.
Michel Rokosh
 

Keys and certificates

Creating app's sign key for Android

Follow this instruction. Use information from "Required information about the publisher". Note and store all the passwords you've used and, of course, generated a key.

Creating certificate and provision files (iOS)

Create a Bundle Identifier

The bundle identifier is the name of your app, that is shown on both App Store and iOS devices.

  • Navigate to the Apple's developer portal in your browser
  • Log in
  • Click Identifiers
  • Click the “+” in the top right of the screen
  • Name the App ID the same as your app
  • Make sure the Bundle ID follows the standard naming convention: com.yourcompanyname.yourappname
  • Check any App Services the app needs, click Continue
  • Verify the services and click Submit

Deploying Mobile App to Google Play: Bundle identifier

Create a certificate signing request

Certificate signing requests are used to link your computer to your Apple developer account.

  • Open a program called KeyChain Access
  • In the top left menu, click Certificate Assistant
  • Click Request a Certificate From a Certificate Authority
  • User email: Enter your email address (use the email from "Required information about publisher")
  • Common Name: We recommend using the name of the app
  • CA email is not actually required
  • Check Saved to Disk, click Continue
  • Save the Certificate Signing Request for later

Create an app store production certificate

Code Signing Certificates are used to link iOS apps to your Apple developer account.

  • Navigate to Apple's developer portal in your browser
  • Click Certificates
  • Click the “+” in the top right of the screen
  • Look at Production part
  • Choose currently named “App Store and Ad Hoc” option.
  • Click Continue
  • Upload the Certificate Signing Request created earlier
  • Download the Certificate
    Install the certificate on your computer by double-clicking
  • Keep this file in safety

Create a Production Provisioning Profile

Provisioning profiles are packaged with iOS apps so user’s devices can install them.

  • Navigate to the Apple's developer portal in your browser
  • Log in
  • Click Provisioning Profiles
  • Click the “+” in the top right of the screen
  • Click the App Store Distribution option, click Continue
  • Select the Bundle ID created earlier, click Continue
  • Select the Certificate created earlier, click Continue
  • Make sure the Profile Name follows the standard naming convention: App Name
  • App Store Distribution
  • Click Generate
  • Download it
  • Install the provisioning profile on your computer by double-clicking
  • Keep this file somewhere in safety

Create App Store Listing

Reserve a slot in the App Store for your app for users to see.

  • Open iTunes Connect in your browser
  • Log in
  • Click My Apps
  • Click “+” in the top left of the screen
  • Click “New iOS App”
  • Bundle ID: choose the one created on Developer Portal
  • Make the SKU match the Bundle ID created earlier
  • Click Create to create the first version listing

Deploying React Native app

Instructions for deploying Expo applications

- Set up all the stuff in the app.json 

  • Create a separate account for the app/customer/organization.
  • Publish your app
  • Create push notification sertificate [iOS, see How to create push notification certificate].
  • Get your privacy policy link for Play Market ready (Expo uses many permissions as Expo client has it all build in. For this reason, Play Market also requires link to your privacy policy).
  • Create all the keys and certificates and p12 files (see How to create p12 files)
  • Create builds via exp build:ios or exp build:android. Use custom keys/certificates.

Submit the ipa file via Application Loader (Xcode menu -> developer tools -> application loader). [it is compulsory in iOS]

iOS

  • Start Xcode
  • Open the project or workspace
  • Update the version and build numbers
  • Open Build Settings
  • Make sure All settings is selected
  • Scroll to Code Signing
  • Use the provisioning profile created earlier
  • Use the code signing identity created earlier
  • In the top menu, select Generic iOS Device as the build destination if no actual device is connected
  • Menu, Project, Archive
  • Click Distribute
  • Sign in to your apple developer account
  • Submit to the App Store
  • Wait for the confirmation
  • Navigate to iTunes Connect
  • Select the build you wish to tie to the version (Note: This usually appears 10-15 minutes after sending from Xcode)
  • Fill in pricing information
  • Click Save
  • Fix any errors based on the messages that appear and save changes
  • Select the release type. Manual release – after the app is accepted, a Release button will appear. Automatic release – as soon as the app is accepted, it will be released.
  • Read this if it asks you about Advertising Identifier,
  • Wait for approval. (This process usually takes from several days to one month).
  • If your app was not approved, review the notes in the Resolution Center and make the necessary changes to the app or its information and then resubmit.

Android

Google Play: React Native App Release

  • Sign in
  • Press "Create new app" in “All apps”
  • Fill all the required information
  • Upload your application
  • Submit for the review
  • Wait for approval. (This process usually takes from one to several days).

Optional

How to create p12 files

  • Install certificate you want to export in .p12 format by double-clicking on it.
  • Open Keychain Access app
  • Choose the certificate you need.
  • After right mouse click choose export.
  • Use .p12 file format.
  • Enter a protection password and save it
  • Enter your profile password
  • Use the file in the directory you've just saved it.

How to create push notification certificate

  • Navigate to Apple's Developer Portal in your browser
  • Click Certificates
  • Click the “+” in the top right of the screen
  • Look at Production part
  • Choose currently named “Apple Push Notification service SSL (Sandbox & Production)” option
  • Click Continue
  • Upload the Certificate Signing Request created earlier
  • Download the Certificate
  • Install the certificate on your computer by double-clicking
  • Save this file

We hope that these tips have simplified your process of deploying React Native apps to App Store and Play Market. Please look at Mobile Application Development and Consulting Services. If you have any questions, leave a comment below and we will kindly help you!