Dynamic Delivery in React Native(CodePush)

Gowtham P
reportbee
Published in
4 min readDec 19, 2018

Significances of Release management

Once the app is released in the store, updating either the JavaScript code (e.g. making bug fixes, adding new features) or image assets,

  • requires you to rebuild and redistribute the entire binary through respective stores.
  • a time taking process to upload a new app to stores and painful app review process.

What CodePush Solves ?

A React Native app is composed of JavaScript files and any accompanying images, which are bundled together by the packager and distributed as part of a platform-specific binary (i.e. an .ipa or .apk file).

Once the app is released, updating either the JavaScript code (e.g. making bug fixes, adding new features) or image assets, requires you to recompile and redistribute the entire binary, which of course, includes review time associated with the store(s) you are publishing to.

CodePush allowing you to easily add a dynamic update experience to your React Native app(s).

How it works ?

App Center cloud service from Microsoft
  • It is acting as a central repository that developer can publish updates and that apps can query and downloads from it — with help of their respective SDK.
  • This plugin helps end users to get app improvements/bug fixes instantly, by keeping our JavaScript and images synchronized with updates that we release to the CodePush server.
  • As it maintains a copy of the previous update, we can automatically revert back to previous state if we released new update with bug/crash.

What Next?

I hope you got some ideas about CodePush.

In this blog, we only see about releasing your deployments(changes) using CodePush, for set-up and configure refer official CodePush github page.

Follow the below steps to releasing your deployment.

1. Register a new Mobile Center account

Skip this step if you already registered in CodePush. Use code-push login to create your session.

The below command will help you to create a new account in CodePush.

For android & iOS:

code-push register

Execute this command in your terminal/cmd prompt, CodePush registration page will open in your default browser. In that you need to enter your details and register your account. After successful registration you will get access-key for your account. You need to paste the access-key in terminal/cmd prompt to login your session.

After creation of successful session, ensure your session by using,

code-push whoami

You can link your account with your organization users, by using that your entire team have ability to access the project.

2. View and manage your CodePush apps

These are some commands will help you to manage your applications.

add — Add a new app to your account
remove — Remove an app from your account
rm — Remove an app from your account
rename — Rename an existing app
list — Lists the apps associated with your account
ls — Lists the apps associated with your account

code-push ls will display all the applications, which are all you have access.

3. Releasing Update :-)

We’ll now make some change in our app and release a build using code push.

Once app has been configured and published to your users, and we’ve made some JS and/or asset changes, it’s time to instantly release them!

Command:

code-push release <appName> <updateContents> <targetBinaryVersion> [--deploymentName <deploymentName>] [--description <description>] [--disabled <disabled>] [--mandatory] --rollout <rolloutPercentage>]

Example:

This is the command to push updates to CodePush server for an android app called “ParentApp” only staging environment. It should be run from the root directory of the project and it would build the js bundle automatically.

code-push release-react ParentApp android --targetBinaryVersion "*" --description "CodePush testing"

This process will take some time for bundling and releasing.

4. Promoting staging application to Production

Promote the tested release from Staging to Production using the code-push promotecommand.

For android & iOS:

code-push promote ParentApp Staging Production

5. Rolling Back Updates:

We can’t delete or remove an update once it has been released. But we can easily roll back to prior version if current update contains bug or crash.

For android & iOS:

code-push rollback ParentApp Production --targetRelease v3

6. Debugging the application

You can view the logs in the terminal if the app is using the codepush.

For iOS:

code-push debug ios

For android:

code-push debug android

Important !

CodePush support from iOS (7+) and Android (4.1+) only.

--

--