React Native In App Update Feature
What is the in app update feature ?
In app update feature is a best way to update the application without full navigation on play store or app store. This feature updates the application. without interruption of your running application. This feature provides a different level of user experience .
Need an in app update feature ?
Whenever we upgrade the version of our application we have problems informing all users to update the application and sometimes we have only one option to take backend help. But this feature will compare the existing app version and it will compare from the application store if it is less than or doest equal then the popup of update application will come.
How can we integrate this feature in our React Native application ?
In React Native, you can use an npm (Node Package Manager) library or a native method to achieve this feature.
Today, in this article, I will explain how to use the React Native library : sp-react-native-in-app-updates.
Step 1 : Install the library in project using below cmd
npm i sp-react-native-in-app-updates
After successfully installation you have to use the method of this library on that screen where you want to check the updates of your application
Step 2 :The code of checking updates of your application is as follows .
For Immediate Update Code :
const updateResponse: NeedsUpdateResponse = await inAppUpdates.checkNeedsUpdate({ curVersion: currentVersion });
const checkForUpdates = async () => {
try { const currentVersion = '3.1.0'; // optional field
const updateResponse: NeedsUpdateResponse = await inAppUpdates.checkNeedsUpdate({ curVersion: currentVersion });
if (Platform.OS === 'android') {
const updateOptions: StartUpdateOptions = { updateType: IAUUpdateKind.Immediate };
if (updateResponse.shouldUpdate) {
console.log("Update available, starting update."); }
else {
console.log("No update required, starting update anyway.");
}
await inAppUpdates.startUpdate(updateOptions);
}
}
catch (error) {
console.error("Error checking for updates: ", error);
}
};
For Flexible Update Code :
const checkForUpdates = async () => {
try {
const currentVersion = '3.1.0'; // optional field
const updateResponse = await inAppUpdates.checkNeedsUpdate({ curVersion: currentVersion });
if (Platform.OS === 'android') {
const updateOptions = { updateType: IAUUpdateKind.FLEXIBLE }; // Flexible update
if (updateResponse.shouldUpdate) {
console.log("Update available, starting update.");
} else {
console.log("No update required, starting update anyway.");
}
await inAppUpdates.startUpdate(updateOptions);
// Add status update listener for flexible updates
inAppUpdates.addStatusUpdateListener(downloadStatus => {
console.log('Download status', downloadStatus);
if (downloadStatus.status === IAUInstallStatus.DOWNLOADED) {
console.log('Downloaded');
inAppUpdates.installUpdate();
// Remove the status update listener after installation
inAppUpdates.removeStatusUpdateListener(finalStatus => {
console.log('Final status', finalStatus);
});
}
});
}
} catch (error) {
console.error("Error checking for updates: ", error);
}
};
How will things work in the backend ?
When you upload an APK (Android Package Kit) or an AAB (Android App Bundle) file to the Google Play Console for an update, the console checks the version number of the uploaded file against the version number of the currently published app on the Play Store.
Each app version you upload to the Play Console must have a version code and a version name specified in your build.gradle file. The version code is a unique integer that represents each version of your app, while the version name is a string used to identify the release to users.
When you upload a new version of your app to the Play Console, it compares the version code of the new version with the version code of the currently published version on the Play Store. If the version code of the uploaded file is greater than the version code of the currently published version, the Play Console considers it an update.
Now, regarding the library functionality mentioned:
- Comparing Version Numbers: The library you’re referring to likely provides a way to compare the version number of the installed app with the version number of the app currently available on the Play Store. This comparison helps determine if there’s a newer version available.
- Flagging for Update: If the version number of the installed app is lower than the version number of the app on the Play Store, the library can provide a flag or some indicator. This flag indicates to your app that an update is available.
Types of Updates :
Using this library, you can implement two types of updates: flexible updates and immediate updates. Here is a detailed explanation of each:
Flexible Update
- Description: The flexible update process allows the app to update in the background without disrupting the user’s experience.
- User Experience:
- The user can continue using the app while the update is being downloaded.
- The update is installed automatically once the download is complete.
- The app prompts the user to restart the app after the installation is complete, but the prompt can be postponed if the user chooses to do so.
- Ideal Use Case: This type of update is ideal for non-critical updates where user experience should not be interrupted, such as minor bug fixes or feature enhancements.
Immediate Update
- Description: The immediate update process ensures that the user cannot access the app until the update is fully installed.
- User Experience:
- As soon as the update is available, the user is prompted to update the app.
- The app restricts access to its functionality until the update is downloaded and installed.
- The update process must be completed before the user can continue using the app.
- Ideal Use Case: This type of update is suitable for critical updates that need to be applied immediately to ensure security, fix major bugs, or introduce essential features.
By using these update methods, you can ensure that your app stays up-to-date while balancing user experience and the necessity of immediate updates.
How to debug this feature:
Testing and debugging in-app updates can be challenging, so here’s a step-by-step guide to help you ensure everything is working correctly:
1.Preparation:
Use a Real Device: Testing should be done on a physical Android device.
Enable Internal App Sharing:
Enable internal app sharing on your Android device. This allows you to share APKs/AABs internally for testing purposes.
2.Testing Steps:
Create Release APK (or AAB) for Lower Version:
Build a release APK or AAB for your app with a lower version number (e.g., version 100).
Create Release APK (or AAB) for Higher Version:
Build another release APK or AAB for your app with a higher version number (e.g., version 101). This will be the version you’ll update to.
Upload Both Versions to Internal App Sharing:
Upload both the lower version (100) and higher version (101) APKs or AABs to your internal app sharing platform (e.g., Google Play Console’s internal app sharing).
Install Lower Version (100):
Install the lower version (100) on your device using the APK/AAB.
Access Internal App Sharing Link for Higher Version (101):
Open the internal app sharing link for the higher version (101) on your device. Ensure the button says UPDATE and not Install. This indicates that Google Play recognizes an available update.
Test Update Functionality:
Open the installed lower version (100) of your app.
Verify that your update code triggers and displays an update prompt or notification indicating that a new version (101) is available.
3.Debugging Tips:
Enable Debug Logs: If your in-app update library supports it, enable debug logs by passing true to the library constructor. This helps in debugging any issues related to the update process.
Use Logging Tools: For release builds, use tools like react-native log-android or react-native log-ios to view console logs and debug output directly on your device.
Conclusion:
Testing in-app updates thoroughly with these steps ensures that your update mechanism works as expected before releasing updates to users through the app stores. It’s a bit involved, but necessary to verify that the update process functions correctly across different app versions and scenarios.
For installation and more information visit the official document of npm.