Jan 12, 2021
Testing React Native apps with zero effort
> cli-rn remote:prod
Hi folks,
I am going to introduce a cool and convenient CLI that is aiming to make the React Native app developing experience as smooth as possible. It is not a replacer for react-native CLI but a good addition to it.
The project is currently in the very alpha stage and under heavy testing.
Quickstart
In this section, we are going to start using cli-rn and see it in action!
Note: I assume that you have some development experience with React Native.
Install cli-rn globally and generate new app
> npm i -g cli-rn
> cli-rn new AppNameIt will start generating an app that is bootstrapped from rnn-starter. The process is going to take some time.
Once the process is finished, you will have a production-ready app on your local machine. If you’d like to read more about the app structure and related things, please follow the rnn-starter page.
Testing
Let’s assume that you have coded a feature in your app and would like to test it in release mode on a real device to feel the experience of an end-user. We have 2 options here:
- Open XCode and run the project in Release mode (takes ~4–5 minutes).
- Use
cli-rnandcli-rn-app(takes < 1 minute).
As you may have guessed, we are going to stick with the second option 🙂
In order to start testing your app remotely, you will need to download cli-rn-app from the App Store. As an alternative, you can install the most recent version from Github (with a single command > cli-rn app) and also modify it for your needs.
As was mentioned before, we want to test the app in release mode. In order to achieve it, run the following command:
> cli-rn remote:prod
This command will generate an App Code that has to be put in cli-rn-app as shown on the video below.
After hitting the Run button, you will see the black screen which means that your app started loading.
Note: seeing the black screen is totally okay as I haven’t found a way to manage it yet 🙂
Voila! You should be able to see your app! Happy testing 🤙
cli-rn-app can be reused for testing any of your RN apps. The only thing to keep in mind is that libraries that are installed in cli-rn-app might be not enough for your needs. You can always add it by yourself or open an issue.
Summary
Working on this project made me learn a lot of things such as writing a CLI for the first time and connecting all parts of the project together, like backend, server for tunneling, mobile app, etc.
💚 Thanks to React Native
💙 Thanks to Expo for inspiration
❤️ Thanks to Wix team for initiating react-native-navigation and all contributors for maintaining it
cli-rn and cli-rn-app saved me a lot of time, I hope they will do the same for you! I will keep working on these tools as they have become essential attributes of my daily developer life. There are some cool features which I’d like to add and, of course, fixing existing issues and improving the codebase will need some time 😇
I appreciate your time in reading this article. I wish you a great day and Happy Coding 🤙
