Skip to content

Latest commit

 

History

History
161 lines (112 loc) · 7 KB

quickstart-feature-flag-javascript.md

File metadata and controls

161 lines (112 loc) · 7 KB
title titleSuffix description author ms.service ms.devlang ms.topic ms.date ms.author ms.custom
Quickstart for adding feature flags to JavaScript apps
Azure App Configuration
In this quickstart, add feature flags to a Node.js app and manage them using Azure App Configuration.
zhiyuanliang-ms
azure-app-configuration
javascript
quickstart
09/26/2024
zhiyuanliang
quickstart, mode-other, devx-track-js

Quickstart: Add feature flags to a Node.js console app

In this quickstart, you incorporate Azure App Configuration into a Node.js console app to create an end-to-end implementation of feature management. You can use App Configuration to centrally store all your feature flags and control their states.

The JavaScript Feature Management libraries extend the framework with feature flag support. They seamlessly integrate with App Configuration through its JavaScript configuration provider. As an example, this tutorial shows how to use the JavaScript Feature Management in a Node.js app.

Prerequisites

Add a feature flag

Add a feature flag called Beta to the App Configuration store and leave Label and Description with their default values. For more information about how to add feature flags to a store using the Azure portal or the CLI, go to Create a feature flag.

[!div class="mx-imgBorder"] Enable feature flag named Beta

Use the feature flag

  1. Install the Feature Management by using the npm install command.

    npm install @microsoft/feature-management

  2. Create a file named app.js and add the following code.

    const sleepInMs = require("util").promisify(setTimeout);
const { load } = require("@azure/app-configuration-provider");
const { FeatureManager, ConfigurationMapFeatureFlagProvider} = require("@microsoft/feature-management")
const connectionString = process.env.AZURE_APPCONFIG_CONNECTION_STRING;

async function run() {
    // Connect to Azure App Configuration using connection string
    const settings = await load(connectionString, {
        featureFlagOptions: {
            enabled: true,
            // Note: selectors must be explicitly provided for feature flags.
            selectors: [{
                keyFilter: "*"
            }],
            refresh: {
                enabled: true,
                refreshIntervalInMs: 10_000
            }
        }
    });

    // Create a feature flag provider which uses a map as feature flag source
    const ffProvider = new ConfigurationMapFeatureFlagProvider(settings);
    // Create a feature manager which will evaluate the feature flag
    const fm = new FeatureManager(ffProvider);

    while (true) {
        await settings.refresh(); // Refresh to get the latest feature flag settings
        const isEnabled = await fm.isEnabled("Beta"); // Evaluate the feature flag
        console.log(`Beta is enabled: ${isEnabled}`);
        await sleepInMs(5000);
    }
}

run().catch(console.error);

Run the application

  1. Set an environment variable named AZURE_APPCONFIG_CONNECTION_STRING, and set it to the connection string of your App Configuration store. At the command line, run the following command:

    Windows command prompt

    To run the app locally using the Windows command prompt, run the following command and replace <app-configuration-store-connection-string> with the connection string of your app configuration store:

    setx AZURE_APPCONFIG_CONNECTION_STRING "<app-configuration-store-connection-string>"

    PowerShell

    If you use Windows PowerShell, run the following command and replace <app-configuration-store-connection-string> with the connection string of your app configuration store:

    $Env:AZURE_APPCONFIG_CONNECTION_STRING = "<app-configuration-store-connection-string>"

    macOS

    If you use macOS, run the following command and replace <app-configuration-store-connection-string> with the connection string of your app configuration store:

    export AZURE_APPCONFIG_CONNECTION_STRING='<app-configuration-store-connection-string>'

    Linux

    If you use Linux, run the following command and replace <app-configuration-store-connection-string> with the connection string of your app configuration store:

    export AZURE_APPCONFIG_CONNECTION_STRING='<app-configuration-store-connection-string>'

  2. Run the following command to run the app locally:

    node app.js

  3. You will see the following console outputs because the Beta feature flag is disabled.

    Beta is enabled: false

  4. Sign in to the Azure portal. Select All resources, and select the App Configuration store that you created previously.

  5. Select Feature manager and locate the Beta feature flag. Enable the flag by selecting the checkbox under Enabled.

  6. Wait for a few seconds and you will see the console outputs change.

    Beta is enabled: true

Next steps

For the full feature rundown of the JavaScript.NET feature management library, continue to the following document.

[!div class="nextstepaction"] JavaScript Feature Management

While a feature flag allows you to activate or deactivate functionality in your app, you may want to customize a feature flag based on your app's logic. Feature filters allow you to enable a feature flag conditionally. For more information, continue to the following tutorial.

[!div class="nextstepaction"] Enable conditional features with feature filters

Azure App Configuration offers built-in feature filters that enable you to activate a feature flag only during a specific period or to a particular targeted audience of your app. For more information, continue to the following tutorial.

[!div class="nextstepaction"] Enable features on a schedule

[!div class="nextstepaction"] Roll out features to targeted audiences