Categories
Technically Speaking

TestFlight from ReactNative: How do you do it?

Motivation

You have finally completed your awesome React Native app after the initial setup following our Technically Speaking article, Using GitHub with Expo and Vanilla React Native. Your next logical step is to test your app on your friends’ and family’s mobiles. On Android this is relatively straightforward. You can simply generate an APK and distribute using your website. But for iOS, you have to use the TestFlight platform to install the app on iPhones and iPads.

Before you get started, make sure you have an Apple Developer account, a MacOS device and a iPhone or iPad.

Firstly, we need to create an IPA build.

Setting up the developer account

Make sure you have signed in at least once to iTunes Connect using the same account you will be using to upload the app to the App Store.

To upload your app to the App Store, we will be using a macOS app called Transporter. After that, make sure you enrol to the Apple Developer Program.

Creating an IPA build

We need specifically an archive build to deploy on TestFlight. For this, we can run the Expo command;

expo build:ios -t archive

Then, Expo will then create an IPA file – you can upload this either to the App Store or TestFlight.

The CLI will prompt you to provide other information as well:

  • Will you provide your own Apple Distribution Certificate?
  • Will you provide your own Apple Push Notifications service key?
  • Will you provide your own Apple Provisioning Profile?

For all these questions you can opt to let Expo handle these for you.

If you receive an error like this, just re-install Expo by running

npm i -g exp
Expo terminal window showing a common gotcha

If the problem still exists, make sure you are on the latest version of expo by running:

npm install -g expo-cli

Examples of other errors that occurred and their how to resolve them:

To resolve this, simply delete the .fastlane folder at the path given in the error message.

Uploading IPA to Transporter APP

Firstly, you need to create an App Store listing for the app. To do this, visit https://appstoreconnect.apple.com/ and choose to add a “New App”. Specify the name and other details. Select the bundle ID that has the bundle ID you specified during the IPA creation process.

Finally! This is the final step before you can get to see the app on your iOS home screen. This step is simple. You simply drag the IPA file and drop it on the Transporter app.

If everything went well, you can see a nice blue deliver button. Press this!

Press the 'Deliver' button to submit the IPA to the App Store an TestFlight
Press the ‘Deliver’ button to submit the IPA to the App Store an TestFlight

Setting up external testing on TestFlight

You can now view the app on App Store Connect. Open your app listing on App Store connect. This page will have a tab named “TestFlight”. Before you can deploy the app to external testers, you need to fill in some required information.

Fill in the required TestFlight information
Fill in the required TestFlight information

Then, the Builds section will show that your app is being processed. Afterwards, you can start internal testing by supplying the Apple account addresses.