Application developers face the constant challenge of optimizing and improving their products on a daily basis. One of the main needs is the ability to update and customize an application in real-time, without the need to publish a new version.
In the previous article we learned how to integrate Firebase into a Flutter app. This time we will learn about Firebase Remote Config, a tool that offers this possibility, allowing developers to modify and customize the configuration of the application remotely and instantly.
What is Firebase Remote Config?
Firebase Remote Config is a cloud service that enables modifying the behavior, appearance, or language of an application without the need to publish a new update. Additionally, Firebase Remote Config provides other advantages such as the ability to create and test different configuration versions, segment users, and measure the impact of configurations on the application's performance. These changes are automatically stored in the application cache without the need to constantly load them from the server.
This cloud service is offered for free and can be used by an unlimited number of daily users. It is one of the most recommended Firebase tools to verify application updates. For more information, you can review the official documentation.
How to configure a Flutter project with Remote Config?
Within the Firebase project, access the side menu and press Remote Config in the Engage category. Then, enable it to make it functional.
The Remote Config section is divided into four main elements: parameters, conditions, A/B testing, and customizations.
By pressing the "Add Parameter" button, you can create a new parameter where you will establish its Name, Description, Default Value, Data Type, and Conditional Values.
For more details, we leave you with the following video: Remote Config personalization.
Remote Config Configuration in Flutter
To implement Remote Config in a Flutter application, you must initially have the corresponding Firebase project configured. Next, you must add the firebase_remote_config package to the dependencies of the pubspec.yaml file and create a class to establish the configuration and related implementations with Remote Config.
The two main parameters related to the configuration of this package are:
fetchTimeout: Maximum waiting time to obtain a response from the server with remote configuration. The default value is one minute.
minimumFetchInterval: Maximum age of a cached configuration before it is considered obsolete and data needs to be requested from the server again. The default value is twelve hours.
class FirebaseRemoteRepository {
final FirebaseRemoteConfig _remoteConfig = FirebaseRemoteConfig.instance;
final int _fetchTimeout = 1;
final int _minimumFetchInterval = 60;
Future<void> initialize() async {
await _remoteConfig.setConfigSettings(RemoteConfigSettings(
fetchTimeout: Duration(minutes: _fetchTimeout),
minimumFetchInterval: Duration(minutes: _minimumFetchInterval),
));
try {
await _remoteConfig.fetchAndActivate();
} catch (e) {
debugPrint(e.toString());
}
}
}The setConfigSettings method sets the Remote Config configuration, and fetchAndActivate performs the operation of obtaining and activating remote data.
In the main class of the project, you can call the initialize method to complete the Remote Config configuration in the project.
void main() async {
…
await FirebaseRemoteRepository().initialize();
…
}How to obtain a configured parameter in Remote Config?
In this simple example, we are going to obtain a list of languages that we have configured in Remote Config. To do this, we have created a parameter called langs_octa where the list is stored with Json data type.
List of languages:
[
{
"code": "es",
"flag": "https://flagicons.lipis.dev/flags/4x3/es.svg"
},
{
"code": "en",
"flag": "https://flagicons.lipis.dev/flags/4x3/gb.svg"
}
]Then, within our Flutter project, in the FirebaseRemoteRepository class that we initially presented, we create the getLanguages method to obtain remote information. In it, we execute the getAll method that returns a map of all Remote Config parameters, and we get the information from the langs_octa parameter. Then, the data is manipulated to bring it into a list of LangModel models.
class FirebaseRemoteRepository {
...
//Parameter
static const String langs = "langs_octa";
...
Future<List<LangModel>> getLanguages() async {
var remoteValue = _remoteConfig.getAll()[langs];
List<LangModel> result = [];
try {
List data = json.decode(remoteValue!.asString());
result = data
.map((lang) => LangModel.fromJson(lang))
.toList()
.cast<LangModel>();
} catch (e) {
debugPrint(e.toString());
}
return result;
}
}
class LangModel {
String code;
String flag;
LangModel({
required this.code,
required this.flag,
});
LangModel.fromJson(dynamic json)
: code = json['code'],
flag = json['flag'];
Map<String, dynamic> toJson() {
final map = <String, dynamic>{};
map['code'] = code;
map['flag'] = flag;
return map;
}
@override
String toString() {
return 'LangModel{code: $code, flag: $flag}';
}
}This way, by just calling the getLanguages method, we can have the list of languages that we have configured in Remote Config.
Advantages of using Remote Config
Completely free solution.
Easy configuration.
Support for multiple platforms (Android, iOS, Web).
Once the configuration is obtained, it is cached in persistent storage on the device. Supports default value configuration.
Can be easily used for A/B testing.
Very flexible in configuring different values for multiple conditions (operating system, country, user language, application version, etc.).
Allows you to change the appearance and behavior of your application on the fly.
Helps provide a unique app experience for a specific audience segment.
Limitations of Remote Config
Not suitable for storing sensitive data.
Can have up to 2000 parameters.
Parameter keys can have up to 256 characters, must start with an underscore or letters (A-Z, a-z), and may also include numbers.
Can have up to 500 conditions.
The total length of parameter value strings within a project cannot exceed 800,000 characters.
Use cases
Rolling out a new feature to user segments
Remote Config enables the gradual rollout of a new feature within the application to user segments. Once the stability of the feature is confirmed, the user population can be increased until finally reaching 100% of them.
Customizing advertising banners based on multiple parameters
With this tool, personalized advertising that is displayed to the user can be provided. It can have different advertising banners that are loaded dynamically based on user-related information such as: device operating system, region of residence, application version, etc. Favoring an increase in the revenue that can be perceived.
It is even possible to activate promotions for a period of time and stop showing them when they expire.
Provide a better user experience based on app usage
Based on the user's app usage, Remote Config can enable hidden features or incentives. In addition, it can provide unique experiences to users who joined during a specific time interval.
Send Slack/email notifications when Remote Config updates are published
To streamline collaboration processes, you can receive almost real-time alerts through your preferred mechanism (Slack or email). The Remote Config REST API, along with Remote Config's background triggers in Firebase Cloud Functions, allows you to distribute real-time updates.
Don't miss more articles on Flutter app development! Follow us and stay updated with everything new we have prepared for you on our blog! In future articles we will learn how to create a white label app using Remote Config.