How to publish React Native App with App Center

Application creation

First, you need to create a new React Native project and add it to git. Create two separate branches for Android and IOS builds and push them to your repository. Then you need to add post-clone scripts for Android and IOS to install all needed dependencies. To do that for IOS, in the IOS branch, you need to add appcenter-post-clone.sh file to the project’s root with the following code

for Android (in Android branch) — create a appcenter-post-clone.sh file in the project’s root with the following code

Push all changes to the repository.

IOS preparations

For IOS you need to create Distribution Certificate and provision profile. To do that, you need to go to Apple Developer Program => press Account => sign in with your credentials => select Certificates Create and download distribution certificate and provision profile. Double-click on the downloaded distribution certificate. Open your keychain and find this certificate (it should include your private key). Press with right mouse key on it and select Export... . Select file format Personal information exchange (.p12) and export it to the selected path.

Note: to be able to see analytics in AppCenter, go through these steps:

Android preparations

Open your project with any editor. Create your release keystore with (replace my-upload-key and my-key-alias with your values and set all requested data) and put it to the path android/app .

keytool -genkeypair -v -storetype PKCS12 -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

Add to your android/app/build.gradle under signingConfigs new config

release {
          storeFile rootProject.file("app/appcenterpublish.keystore")
          storePassword System.getProperty("APPCENTER_KEYSTORE_PASSWORD")
          keyAlias System.getProperty("APPCENTER_KEY_ALIAS")
          keyPassword System.getProperty("APPCENTER_KEY_PASSWORD")
        }

and add to your android/app/build.gradle under buildTypes => release

signingConfig signingConfigs.release

Now push these changes to your repository.

App Center integration process

If you don’t have an account in AppCenter, then you need to Sign up to App Center. In AppCenter dashboard create a new IOS application. To do this, go through these steps:

• press button Add new app

• enter App name
• select Release Type Store
• select OS IOS
• select Platform ReactNative

Now go to your newly created IOS application on App Center dashboard and select Build on the left menu. Connect your repository by selecting one of the provided services.

Select branch for IOS build and click on Config (5 column in the table)

The build configuration form will open. Fill in this form:

• change Xcode version to your version code
• select Node.js version
• in Build scripts you should see Post-clone build script
• on Build frequency select Build this branch on every push
• turn on Automatically increment build number

• set Build number format to Build ID
• tun on Environment variables and add env variable APPCENTER_BUILD_ID with your bundle id
• add the previously exported certificate and downloaded provisioning profile to Sign builds section of App Center build configuration
• press Save to save all information

• turn on Distribute builds and select Store radio button
• from dropdown select Connect to stores.... You will be redirected to a page, where you should select a store to connect

• connect your app to the store and start build

Note: you need to manually update your distribution certificate and provisioning profile once it has been expired.

Now Android. Go to AppCenter dashboard and create an application for Android. To do this, go through these steps:

• press button Add new app
• enter App name
• select Release Type Store
• select OS Android
• select Platform ReactNative

Open this newly created Android application and select Build on the left menu. Connect your repository. Then select a branch for Android build and click on config (5 column in the table). The build configuration form will open. Fill in this form:

• select Build Variant
• select Node.js version
• in Build scripts you should see Post-clone build script
• on Build frequency select Build this branch on every push
• turn on Automatically increment build number
• set Build number format to Build ID

• tun on Environment variables and add env variable APPCENTER_BUILD_ID with your bundle id and JAVA_HOME with value $(JAVA_HOME_11_X64) or another java version All available java home variables are listed here:
• turn on Sign builds

• add Keystore password, Key alias and Key password.

• save the changes and connect your app to the store and start build

That is it! All sources are open and available on my GitHub repository.