DEV Community

loading...

Simple release worflow for react native with expo

David Leuliette
Hi , Im a React Native freelance engineer working remotely. I am on a mission is to make peoples lives easier through mentoring, minimalist design, and automation.
Originally published at Medium on 5 min read

Just push a button

How much time it takes to release a React Native application to the iOS App Store and Android Play Store

Its 2pm and my delivery manager is asking me to release our React Native application to the iOS and Android stores.

Great! I am happy to release our application, just for your information, this will take an entire day.

What are you saying? Its just pushing a button.

I dont see why its so long?

I made a drawing for you. I think now you can see why its a long process

First of all, there are 2 main application stores (Apple and Google). The release process is a little bit different for each, and the testing workflow is different as well. In this article, I am going to cover a specific scenario: How to release a React Native application with a standalone build from expo.

create-react-native-app versus react-native-cli

If you are in charge of releasing your react native application, you need to understand 2 different application architectures generated with your CLI.

create-react-native-app

According to the official documentation, this solution is the simplest one. You can run your application on any OS with no build config. Xcode or Android Studio are not required. You just have to install another amazing tool called expo.

react-native-cli

If you want to use custom component for each platform or add React Native code into your existing application you are probably using this solution.

If you are looking for the workflow when you have ejected from expo, I hightly recommand theses 2 articles from the legendary Gant Laborde

Building a standalone app with expo

Its 2pm and a half because of the coffee break and you are ready to deploy. Lets do this!

Check the dependencies and run the build:

yarn
exp build:ios

This first task takesat least30 minutes. I am lucky, at the office the connection is fast.

I have an idea, maybe I can run the android build in the meantine.

Bad news rookie. At the moment with expo, you cant build for iOS and Android at the same time.

35 minutes later

Yeah! Build successful!

The application is available on expo servers, now I need to download the .ipa file. I am a developer, I cant be bothered with mouse clicks on a website. Lets open a terminal and download the build with curl .

curl -o app.ipa $(exp url:ipa)

28 minutes later

Download done!

Now I need to upload the .ipa file with Application Loader to the apple store servers (Because I dont need to use Xcode with standalone builds).

34 minutes 55 seconds later

Build uploaded!

Guess what?

I cant push the button yet, because my app is analysed by robots.

Your build is not available yet for your QA team

10 minutes 12 seconds later

My build just disappeared from Testflight!

Listen to me rookie, releasing a native application is a complex task. You have no idea how works the replication of your build accross all the CDNs in the world! Give me some time to process your build.

The good new is, you can follow the progress in the activity tab.

Still processing

Probally less than 10 minutes later

Your app is back again!

But you have small extras steps to do: Provide export compliance information. Its simple, you just need to push a button.

Push another button for the iOS release

Straight after accepting the compliance your app should be available for your testing team

But wait a minute. I am not going to repeat this workflow everytime.

My friends know me as an automation machine. I wrote this little script to half-automate the process of releasing our react native application with standalone expo build.

Create a new file and run this script from a terminal

./bin/ios

Its 5pm and your application is released for your end users!

Are you sure about that?

Rookie, you forgot the android version. You need to run the same script for your .apk

Even if the engineering team working on expo is the best in the world, you need to test on real devices. Developing with expo XDE is fine, but you cant rely on the emulator for testing.

By the way, If you dont have a release note and a testing team, there is no point to deploy.

Creating a slick testing workflow

Testing your application with the real world is hard. Expo is a great solution for developement but its not exactly the same as using the final build delivered to your users.

It reminds me this talk: A new version of Firefox is available. The mozilla team have 4 differents release channels Nightly, Aurora, Beta and Release.

The release workflow for Firefox @FOSDEM

The mozilla team have a routine: every Tuesday at 3pm its release day! Builds are deployed in release channel for millions of users.

Maybe we can follow this weekly routine? The last version is released in production every x week, and we have 2 differents channels for developement and quality insurance.

Fun part: the worflow for testing your standalone app is different on the 2 platforms.

iOS and android are 2 differents worlds

How to onboard testers for iOS

  1. Add fullname and Apple ID on https://appstoreconnect.apple.com/ Apple store connect > Users and Roles
  2. Download Testflight

How to onboard testers for Android

  1. Add fullname and Google play account on https://play.google.com/apps/publish/ Google Play Console > Manage testers > Create list

Its your lucky day rookie, you didnt have problems with updates of npm packages, screenshot issues on the app store or release notes.

Your app is deployed. Remember the lesson of the day:

Deploying an app to the store takesat leatone day

Notes: You can use Over the Air Updates to bypass the validations in the stores and speed up the deploy deploy. But you have some limitations.

I hope this motivates you to start building the perfect workflow for releasing your React Native app. Just drop me a message if you have any questionsI would be glad to help you!

Discussion (0)