Crash Analytics and Feedback for ReactNative Apps

As I am starting to use ReactNative to write non-trivial, production facing apps, I realized that I needed solutions that would help me share beta versions of my app, get user feedback and analyze crash reports. For native apps, I had used HockeyApp and loved it for its simple API and multi-platform support.
My workflow with HockeyApp for native apps was pretty simple.
  1. Build the native app on a continuous server like Jenkins or Visual Studio Online.
  2. Upload the generated APK or iPA file using curl to the HockeyApp url.
  3. Beta testers use the HockeyApp for iOS or Android to download this beta app, and test it.
  4. HockeyApp SDK was integrated into my app for getting feedback, analyzing crashes, or notifying any changes that I make. 
I wanted similar capabilities for the ReactNative apps that I build. In my last post, I had written about the Cordova Plugin Adapter for React Native, and I was able to use that to integrate the HockeyApp SDK in app. I used this cordova plugin.

Given that the cordova plugin adapter did most of the setup work, I did not have to manually add permissions or modify my activity as specified in the docs. I just had to do  

$ npm install react-native-cordova-plugin 
$ node_modules/.bin/cordova-plugin add cordova-plugin-hockeyapp.

Then I simply require('react-native-cordova-plugin'); and started using the API as below
  1. Initialize the plugins using cordova.hockeyapp.start(success, fail, token) on componentDidMount.
  2. cordova.hockeyapp.checkForUpdate(success, failure); to check if there are new versions. I ran this on startup of the app, and also had a button to refresh the app.
  3. cordova.hockeyapp.feedback(success, failure); opened the screen for users to provide feedback about the app and was hooked to a button. 
  4. For testing, I also used the cordova.hockeyapp.forceCrash(); API to simulate crashes. There was a bug in the app that made the app crash on a beta tester's phone and I did get the crash reports. 
The entire code showing each of this functions is available in this gist. I also created a demo video showing the APIs in action.



I was only able to get the HockeyApp working on the AndroidSDK since the react-native-plugin-adapter only works on Android for now. If you would like a version for iOS too, or would like to try integrating the HockeyApp into your ReactNative app, please do ping me and I will be happy to help.