Varioqub React Native integration

Varioqub React Native is a plugin for the React Native platform. It includes the Varioqub SDK support for Android and iOS.

System requirements:

• React Native 0.74 or later.
• Node.js 18.

The plugin accesses native Android/iOS libraries, so to use it with Expo, you need to follow the instructions for libraries that integrate with native components.

To use the Varioqub React Native plugin, add and initialize the AppMetrica React Native plugin. For more information on how to do this, see the AppMetrica React Native documentation.

Follow this step-by-step guide to enable and initialize Varioqub React Native.

General integration recommendations

1. When starting a new session, call the activateConfig() method to get the stored flag values.

2. Run fetchConfig() in the background to export the new flag values from the server and activate them when the next session starts.

3. We don't recommend calling the activateConfig() method mid-session because it can cause inconsistent app behavior.

Step 1. Integrate the Varioqub React Native plugin

Step 2. Initialize the library

1. Import the library in the source code of your project:

   import Varioqub from '@appmetrica/react-native-varioqub';
   

   In this case, use Varioqub in your project's source code to interact with the library.

2. Initialize the Varioqub library using the initVarioqubWithAppMetricaAdapter() method:

   Varioqub.initVarioqubWithAppMetricaAdapter({
       clientId: 'appmetrica.1234567',
       clientFeatures: {
           my_cool_feature: 'true',
           mode: 'night'
       },
   });
   

To initialize the library, use the initVarioqubWithAppMetricaAdapter(settings: VarioqubSettings) method. It takes a VarioqubSettings object as a parameter.

Contains required and optional settings:

Required

• clientId: Project ID specified as appmetrica.XXXXXX, where XXXXXX is the app ID from the AppMetrica interface. For example, VarioqubSettings("appmetrica.1234567").

  Tip

  You can get the application ID from the AppMetrica Settings page: copy it in General settings → Application ID.

Optional

• ClientFeatures: List of custom parameters. For example, you can pass a flag indicating if the user is subscribed to newsletters.

• fetchThrottleIntervalSeconds: Interval between config updates, in seconds. This is only recommended for testing purposes.

• url: Changes the URL for server responses. Only used for testing.

• logs: Enables internal logging. To help us diagnose your problem, please enable logging and attach the log file with a description of the problem when submitting your support request.

• activateEvent: Sends an event when the flag configuration is activated. Event sending is enabled by default.

Example of Varioqub SDK integration on GitHub.

Step 3. Set the default configuration

You can set up a default configuration to have your app use your preferred parameter values before it connects to a remotely configured server. To do that, send the list of parameters using the setDefaults(map: Map<string, any>) method.

You can download the XML default configuration file from the Flag configuration page.

Step 4. Run a background update of the flag configuration and activate it

To use the most recent flag configuration from the interface, run a background configuration update using the fetchConfig() method.

Each time you receive the latest version of the configuration (most often this occurs when starting a new session), you need to activate it using the activateConfig() method.

Varioqub.fetchConfig(
  () => {
    Varioqub.activateConfig();
  },
  () => {
    console.log('Something went wrong');
  },
);

Getting flags from the interface

Flag values are retrieved and returned in the following order:

1. Flag is present in the experiment.
2. Flag is present in the loaded configuration.
3. Flag is present in the default configuration.

Flag getters:

• Varioqub.getString(key, default).

Code example:

Varioqub.getString("key", "default_value");

Obtaining the device ID to test the experiment

To get the device ID, use the Varioqub.getId() method:

Varioqub.getId();

To learn more about creating and testing experiments, see Creating an experiment.