How to publish an Expo App to the Stores with Release Channels

Let's demystify the release channels!

In 2017 when I started developing apps for myself using Expo, all I wanted was to have an app live on the App Store & the Play Store.

What I thought was the quickest way to do it back then was Git push master 😮, no branch, no pull request, no staging ENV... When the app was ready, I had to build it for Apple & Android using the Expo CLI. Finally, with my .apk and .ipa in my hands, I could publish it by going through the very long and stressful review process of the App Store and the Play Store (this is a whole other topic). And it worked...

A few days later, let's say I have a bug to fix or a feature I want to add. How was I doing it? I had to repeat the same process all over again... So I was doing the changes, pushing on master, building the standalone app and submitting it to the Stores so that the users could see the new version a few days later (provided that the App Store review is accepted). Oh, and they could only see the changes if they had updated my app on their phone!

But wait a moment... That is not what was happening. The users had access to the new version instantly. How was that possible?

I did some googling and I came across OTA updates (OTA stands for Over The Air). What is that?

So here is what Expo says about it:

OTA updates allow you to publish a new version of your app JavaScript and assets without building a new version of your standalone app and re-submitting to app stores

Wow, ok, that was something new for me back then! So Expo is telling me that to make changes on my app I can just write a command and people will see it instantly? That seems like a dream when you usually have to wait a few days to (maybe) get an approval!

How does OTA works? To put it short, you can do any change you want in your javascript app and just write the expo publish command. Then your app will be minified and 2 versions of your code (iOS & Android) will be uploaded to the Expo CDN.

Ok, but what does it have to do with my users' app on their phone? Good question! What Expo wrote in the documentation is:

By default, Expo will check for updates automatically when your app is launched and will try to fetch the latest published version. If a new bundle is available, Expo will attempt to download it before launching the experience.

That's it! Each time your user opens the app, Expo will check and fetch the latest version of your code that you uploaded with the command expo publish (more details here)! So there is no need to upload a new standalone build of your app and to go again through the process of review for each Store! (however, there are a few exceptions that you can find here)

This discovery for me was mind blowing! I started using it right away! What a pleasure to fix something and see it available directly on my users' phones!

Ok Julien, but what about release channels?!

Let's get back to them! How did I come across release channels and why OTA updates were not enough by themselves for me? A year ago, I had a freelance project for a client. It was an app which was already live on the Stores and needed to be improved by adding some features/design & bugs fixes. They also needed a way to see the version I was working on, like a staging ENV (they didn't have one at the moment).

I couldn't write expo publish to show them the WIP because it would have impacted the users. And that is when I came across release channels! You can think of them like different servers where you can upload your app, each with a specific name. So for example, when you write expo publish, you can also add the flag --release-channel <your-channel> (eg: expo publish --release-channel staging) and this way, your app is published to this specific channel. You can add as many channels as you want.

Imagine this simple workflow:

• A production version of your app which is available on --release-channel production
• A staging version which is available on --release-channel staging

But how will the users get the right version on their phone?

Let's say you want to build an app and upload it to the Stores, you do expo build:android or expo build:ios, right? By default, Expo will automatically add a channel for you which is the default one.
Remember OTA updates? So the freshly new produced binary will only pull updates published over the default channel. This way, each time you publish your app with expo publish (without specifying a channel), expo will publish it on the default channel and your user will have access to the new version.

We can also improve this workflow by adding different channels! From now on, instead of publishing without specifying a channel, you can publish a production version of your app with the command expo publish --release-channel production. This new build will subscribe to the production channel and listen for new updates.
You just need to upload it to the Stores the first time.

Now, imagine you want to work on a new version of your app and show it to some test users without messing with the live production version.
You simply need to create another channel, let's say expo publish --release-channel staging and build a new binary that will subscribe to this specific staging channel (you can upload this build on Testflight for example and each time you will publish new changes on this channel, your Testflight users will be able to see the Work In Progress! For Android, you can upload this binary on a test release).

When you are happy with your staging app, there is no need to create a new built. You can deploy your changes on the production app by promoting the release to a new channel.

What!? Each time you publish your app, 2 things are created:

a release, identified by a publicationId for Android and iOS platforms. A release refers to your bundled source code and assets at the time of publication.

a link to the release in the staging channel, identified by a channelId. This is like a commit on a git branch.

In order to see everything that you’ve published, just do expo publish:history. You will see something like this:

Let's get back to the promotion! If you want to promote your staging app to the production one, you just have to identified the publicationId you want to promote and do expo publish:set --publish-id <publicationId> --release-channel production.

That's it, your changes are now live in production! You can do expo publish:history again to see that the channel has changed!

What if you added a big regression to your users doing that?
No need to worry, just rollback the promotion channel doing expo publish:rollback --channel-id <channelId> (Be careful, you rollback the channelId, not the publicationId 😉)!
This is as simple as that, your release will be back to the staging channel :)

You can imagine any workflow that suits your needs, for example the one with multiple production channels corresponding to different versions of your app where you can maintain each version separately!

One more thing!

Now that you know pretty much everything there is to know about release channels, how about accessing channels directly in the code?

For example, this could serve to set ENV variables based on the channel. You can access this info in the releaseChannel field in the manifest object.

Here is the Expo example:

You can create a function that looks for the specific release and sets the correct variable.

function getApiUrl(releaseChannel) {
  if (releaseChannel === undefined) return App.apiUrl.dev // since releaseChannels are undefined in dev, return your default.
  if (releaseChannel.indexOf('prod') !== -1) return App.apiUrl.prod // this would pick up prod-v1, prod-v2, prod-v3
  if (releaseChannel.indexOf('staging') !== -1) return App.apiUrl.staging // return staging environment variables
}

If you are curious to know more about release channels, I invite you to look at the Expo documentation: Release channels & Advanced release channels.

By the way, if you have any question or if I missed something, please don't hesitate to let me know in the comments below!

If you are interested about my next articles, don't forget to follow me here ;)