Introduction

Sometimes you make critical updates that could break the app for users on an old version. To maximize a smooth user experience, it's crucial to implement a "mandatory update" feature. This forces users to update the app on their next launch if they haven't already done so. 

In this blog, we'll guide you through creating a mandatory update system in your FlutterFlow project using remote config, an update app page, and an action for checking remote config.

Step 1: Setting up variables

To create this feature, you need to handle two variables: one stored on the cloud and one on the device. Both variables should be integers for easy comparison.

• Device Variable: We will use a constant "appVersion" (int) and set it to an initial value of 1.

• Cloud Variable: For the off-device value, we will use a Firebase Remote Config variable (you can use this even if you aren't using Firebase as your backend) with a similar name and also as an integer (set default to 1).

Step 2: Creating the on-device variable

To create this variable, simply add it to your constants:

• Add an App Constant in FlutterFlow.

Step 3: Implementing remote config

To create this variable, you need to create it in two places.Make sure you have the remote config set up in your Firebase.

Now create a variable in your FlutterFlow's remote config panel:

• Add a Remote Config variable in FlutterFlow.

And create a variable with the same name in your Firebase panel:

• Add the same variable inside Firebase's Remote Config.

Step 4: Checking for updates

Create a conditional action to check if the user's app is up to date. This is best done as an Action Block, allowing you to reuse it across multiple pages.

1.   Action Block for Version Check:

     ‚Ä¢   Compare the appVersion constant on the device with the userMinimumAppVersion from the remote config.

     ‚Ä¢   If userMinimumAppVersion is higher than appVersion, redirect the user to an update page.

• Checking whether the user has the newest update.

2.   Update Page:

• Design a page to inform users that their app version is outdated and needs updating.

• Enable "Disable Android Back Button" on this page to prevent users from navigating back without updating.

• A page in FlutterFlow that forces the users to update their app.

Step 5: Creating this "mandatory update"

To force an update, follow these steps:

1.   Increment the device constant:

• Update the appVersion constant in your app to a higher number.

2.   Push update to stores:

• Submit the updated app to the App Store and Google Play Store.

3.   Update remote config:

• Once the app updates are approved, update the userMinimumAppVersion in your remote config to match the new appVersion.

Conclusion

Implementing a mandatory update feature makes sure that your users always have the latest, most stable version of your app. By managing version variables both on the device and in the cloud, you can easily force updates and maintain a smooth user experience.

Our recommendation is to use this as little as possible, only use it when the new update has breaking changes and cannot interact with the old app version.