While the CodePush CLI provides a simple experience for managing your account, it could become pretty tedious doing manual deployments every time you need to release an update, particularly if you want to keep your dev/staging/etc. deployments always current. To better enable scripting a custom continuous delivery solution from your CI environment (e.g. Travis), we enhanced the CLI in the 1.1 release with the ability to create access keys and authenticate with them “headlessly”, but we wanted to make it even simpler to automated this process E2E.

To take advantage of the new marketplace for Visual Studio Team Services (formally “Visual Studio Online”), we created a CodePush extension which makes adding a deployment step to your CI build pipeline pretty easy, and composes really well with the Cordova Build extension and existing core support for JavaScript apps (e.g. Running Gulp scripts, installing NPM dependencies). If you’re already using VSTS/VSO, then install the extension now and give it a shot! Otherwise, we encourage you to check it out if you’re in the market for a simple and great CI/ALM solution.

Deploy Task

The CodePush task itself is pretty simple, and if you’re already familiar with the CLI, it provides all of the same input options as the release command. Addtitionally, in order to make it simple to authenticate with the service from CI, it provides an Access Key input that accepts a key value which you can generate using the existing code-push access-key add command (NOTE: Give your key a recognizeable name). The task will automatically handle logging-in, performing the release, and then logging-out so that your session information isn’t left around on the machine.

That’s it! Nothing too magical, but hopefully it makes the barrier of entry even simpler to perform these kind of automated deployments. For more info about the task inputs and/or how to get started with it, refer to the GitHub repo.

Cordova

While most of the task’s options are platform agnostic, in order to specify a valid value for the Package Path field, you need to be able to easily build your app’s release assets from a CI environment. For Cordova, that means running either cordova build <platformName> or cordova prepare <platformName> (either is sufficient for a CodePush, but we recommend the later since it’s simpler), or the equivalent using a superset CLI (e.g. Ionic, PhoneGap, Tarifa, TACO).

While you could script this yourself, the Cordova Build extension makes this easy to do, since it provides tasks for running either a build (using the Cordova Build task) or a prepare (using the Cordova Command task or Ionic Command, with the Command input set to prepare <platformName>).

Using these tasks, along with the CodePush deploy task, you can easily configure a build + deploy workflow. Additionally, if your app needs to acquire NPM/Bower dependencies and/or run any Gulp scripts, there are built-in tasks in VSTS for that (no extension needed!). For more info on the Cordova Build extension, including how to get started with it, refer to the GitHub repo.

NOTE: There are plans to introduce additional tasks for other Cordova-based CLIs such as PhoneGap and TACO, so stay tuned for updates on that front.

React Native

Generating your release assets for a React Native app consists of calling the react-native bundle CLI command, which produces the JS bundle you can subsequently pass to the Package Path field of the CodePush task. The React Native CLI requires Node 4+, which isn’t installed by default on the VSTS hosted build machines, so your build script needs to “prime” the environment first, before being able to create the bundle (*).

Currently, there isn’t a React Native extension for VSTS that handles the Node/React Native CLI acquisition for you (yet!), however, there are core VSTS tasks for running shell scripts, which enables you to achieve just about anything when needed. To that end, we created some setup scripts (use the Windows or OS X ones depending on your environment), that you can add to your repo for now, and run as part of your build setup.

With these scripts in hand, your CI pipeline can be composed of the following three tasks/steps:

1. Shell script or Batch Script (depending on if you’re using a Windows or OSX build machine)–that points at either the setup-react-native.sh or setup-react-native.bat file respectively–which handles installing the right Node version as well as the React Native CLI globally

2. Command Line task, which can be used to run the react-native bundle command, passing the neccessary parameters for your app (e.g. platform, entry file name)

3. CodePush deploy task, which points at the JS bundle created in #2

Beyond automating your CodePush deployments, if you want to setup an automated build for generating your ipa and/or apk files, you can use the Xcode Build and Gradle tasks that are already built into VSTS.

Additionally, while VSTS provides Windows-based build machines, MacinCloud released first-class support today for running your VSTS builds on OSX machines, so that is definitely worth checking out once you need to run your automated iOS builds.

(NOTE: Besides using the cloud-hosted build machines, VSTS also lets you setup and run your own build machine using their cross-platform build agent, which lets you install any additional dependecies your builds may require)

Send us feedback

We’re pretty excited about this experience, and there’s lot of cool stuff happening for “mobile DevOps”, but we definitely want to continue making it simpler (including first-class support for React Native), so stay tuned!

In the meantime, if you have any feedback/comments/etc. please don’t hesitate to ping us. We need your help with ensuring we fully accomodate the CI/CD workflow for CodePush for any unique scenarios you may have. Thanks!