Deliver Lightning Fast Updates to your Users with CodePush: A Beginner’s Guide
As app developers, we move fast, whether we’re working on code, testing, validating, shipping, or iterating.
Delivering critical bug fixes and minor features to your users quickly means the difference between a great user experience and a lackluster one, or, put more simply, the difference between a happy user and one who deletes your app. Bugs and errors are unavoidable elements of programming that we all know too well. Because of this, updates and patches serve as the crutch of development.
In mobile development, though, updates and patches aren’t immediate. You spend time re-building and re-packaging for public app stores, and then the 24–48 hour average review times feel like a lifetime, especially in cases where the update is critical to your app’s performance.
CodePush, which was integrated into Visual Studio App Center last year, solves this problem by allowing React Native (and Cordova) developers to publish and deploy app updates directly to users. CodePush simplifies the app update process, eliminating app submission and approval wait times. It acts as a central repository, making it easy to publish asset tweaks and changes that don’t require you to build a binary, such as JavaScript, HTML, CSS.
Thousands of developers use CodePush to deliver awesome apps. To help you get started, I’ll walk through one of the most common CodePush scenarios, over-the-air updates.
Configuring Pre-Requisites Before You Start
To use all of the App Center CodePush features, complete a few simple steps:
- Log in or create your free App Center account.
- Install the App Center CLI: ‘npm install -g appcenter-cli’. CodePush functionality is primarily used via the CLI, but you can also manage deploys, patch releases, view deployment keys, and more, from your App Center portal.
- “CodePush-ify” your app. Before you can use CodePush, you need to add the appropriate SDKs to your app and configure them to query for CodePush updates based on your preferences, including how you’d like to apply your updates. There are only a few steps, outlined in our docs for Cordova and React Native developers.
That’s it! You’re ready to start pushing updates to your users.
Pushing Your First Update (and Beyond)
After you finalize and commit your changes to your app’s code and/or assets, push the update to your Staging deployment environment. When getting started with CodePush, we recommend creating two deployments: Staging and Production. This allows you to visualize and test any changes before releasing the update to your users.
In order to release, use the appcenter codepush release-react commands in the App Center CLI (or appcenter codepush release-cordova, depending on how you’ve built your app). Releases distributed via CodePush are visible in the CLI, as well as the App Center portal.
Once you’ve verified that you’d like to send this update to your users, you can “promote” the update to your Production deployment environment from Staging. Use the appcenter codepush promote command in the CLI, or navigate to the App Center portal, click the release, and press the Promote button.
To verify the promotion worked, check the release history for the Production deployment environment.
Once complete, your users will instantly have access to your update.
As mentioned earlier, you determine how users receive your updates when you “CodePush-ify” your app, whether it’s configuring the app to update on start, on resume, or a custom method.
Just like that, a critical bug, UI issue, or performance problem is no more!
Pro Tip
How “over-the-air” updates are defined can vary, but it’s good to be aware that Apple’s App Store developer agreement (section 3.3.2) states that releasing bug fixes, improvements, or features that maintain the apps original presented purpose are acceptable over-the-air updates.
The Case for CodePush: When, Why, and How to Use Over-the-Air Updates
To better illustrate how CodePush works, here’s a (likely relatable) scenario.
The Situation
You have the hottest up-and-coming app on the market, and your team spent countless hours working on an enormous update that gives your users tons of added functionality. A few weeks ago, your lead developer integrated the CodePush CLI into your app as a safety net and mitigation tactic. He’s occasionally pushed small updates and fixes to your users in an attempt to get the whole team onboard.
Today is release day. You’ve submitted to the Apple App Store and Google Play, and you’re live. You’ve heavily promoted the new features, so you anticipate that many users will install the latest version in the first 48 hours.
The Problem
To your dismay, a few minutes after your new version’s live, your team discovers a critical bug. Every time a user presses a particular button, the entire app freezes and eventually crashes. Something slipped by your unit and UI tests* and it’s causing your app to crash instantly for a large set of your users.
*gasp*
In these scenarios, time is critical. After you identify what’s causing the crash and implement a solution, what do you do?
The Solution
Use CodePush to send the hotfix directly to your users with no resubmission or approval delays.
Your marketing push isn’t wasted, since the update automatically appears in the version they’ve installed on their device.
For a detailed real-world example, learn how PocketLeap uses CodePush to fix disasters ASAP.
*Automated testing on real devices and detailed crash reporting are a separate topic, but, Visual Studio App Center includes easy-to-use, cloud-hosted Test and Crash services, too.
Advanced Scenarios
I’ve highlighted the main example to get you up and running, but CodePush is highly configurable, so you get a lot of “when, where, and how” flexibility.
From manually or automatically rolling back to prior versions to providing an A/B Testing framework, CodePush is a simple, yet powerful service for app developers.
What’s next for App Center?
As a team, we’re constantly working on new features, improving existing functionality, and integrating with other App Center services to simplify app development, fit into existing workflows, and allow developers to ship better code.
Log in or create your free App Center account to get started today.
Light
Dark
0 comments