Alternative way to update ReactNative application

Prologue

Pretty often in our technical assignment we receive task to update ReactNative version. This may be called by different reasons: actualization of versions, deprecation, security issues, new feature, etc. And sometimes, after updated of ReactNative version everything just stop working. Here, step by step, we will go through every option that we have…

Episode 1. Basis

Lets walk through how versioning work, not only in ReactNative. There are plenty of type (schemes) of versioning you application. For example, lets take an iOS application, usually it’s looks like this: major-version.minor-version.build-number (eg. 1.2.3).

Here are other example of computer software versioning:

• major.minor.build.revision
• major.minor.maintance.build

Other are related to software development stage, for instance version can be an information to identify development stage:

• 0 — alpha version
• 1 — beta version
• 2 — release candidate
• 3 — final release

For example, 1.0.0-rc3 for release candidate, or 1.0.0.-b1 for beta version, etc.

Episode 2. Official manual.

You can find it here.

Official ReactNative manual suggesting the two options for us to update ReactNative application.

1. Git based update

Update script comes with react-native-cli that you installed globally, also you need to make your project git repository. After, you need to run:

react-native upgrade

or if you want to specify version:

react-native upgrade <version>

And then resolve the conflicts, like a regular git-merge and afterwards you good to go.

2. Upgrade ReactNative dependency

You need to update ReactNative version in your package.json file, with:

npm install --save react-native@<version>

or via yarn:

yarn add react-native@<version>

Sometime it may require to update React version, so don’t forget to do it.

Now you need to do:

react-native upgrade

And you’re good to go.

Episode 3. Alternative

For start, let me explain why do you need to use this alternative.

Are options suggested by ReactNative developer are so bad that we need an alternative to them? — to be honest, suggested options are great, both, first and second. And in most cases it will work, most…

For example, if ReactNative version have breaking change, they may change something in core, and this will affect your version upgrade, especially if you did some changes to native code (ObjectiveC or Java). You will not have any issues if you know both of this languages, but not all of the ReactNative developers have experience or even familiar with Objective C or Java. So, when developers do changes in native code — they just copy-pasting the installation steps from documentation of libraries that they use.

What can we really do?

Quite easy solution — new project :)

Yup, I’m really suggestion you to create new project and reinstall native libraries. This solution will help you to solve a loooot of issues.

Let’s go step by step.

1. Initialize new project:

react-native init my-new-old-project

Specify ReactNative version if you need.

2. Copy src folder (or other folder where you have your JS code), assets, typescript config, eslint config, and package.json. For XCode project — take Info.Plist to your new project.

3. Do yarn or npm i (depending on you project), now your JS code will be up to date.

4. Now you need to walk through you package.json and take a careful look what libs required linking to your project (yes, you need to re-init your CocoaPods too, if you had them in your old project. Open documentation for this libraries and do installation steps.

5. And, you’re ready to go!

Epilogue

It’s not a call for action, it’s just and an outside perspective. If you ever will have an issue with regular way of updating ReactNative application — now you have an option.