JavaScript (browser) SDK installation

2 minute read

Control feature rollout for certain user segments of your application with feature flags. To start using feature management in the platform, follow the instructions below to install the SDK and deploy a feature flag.

These same instructions are available in the platform UI. Select Installation from the left pane to use.

To install the SDK:

  1. Select the next to Feature management on the left pane, and then select Installation.

  2. Select an Environment from the options, or create an environment by completing the following:


    2. Enter an Environment name.

    3. (Optional) Enter a Description.

    4. (Optional) Select Approvers if you want to have a manual approval required before deployment.

    5. (Optional) Enter any Properties you want to associate with the environment. For more information, refer to properties configuration and properties in an environment.

    6. Select SUBMIT.

  3. Select JavaScript from the language options.

  4. Select a package manager from the options.

  5. Add the ROX package to your application by running the shell commands appropriate for your package manager, listed in the following table:

    Table 1. Commands to add the ROX package to your application
    Package manager Project Commands to run



    npm install rox-browser --save



    npm install rox-browser --save
    npm install @types/rox-browser --save



    yarn add rox-browser



    yarn add rox-browser
    yarn add @types/rox-browser

  6. Add the following code to your JavaScript application:

    Your SDK key is a unique environment identifier. During SDK installation, the SDK key is displayed within the Rox.setup call.
    import Rox from 'rox-browser'; const flags = { enableTutorial: new Rox.Flag(), titleColors: new Rox.RoxString('White', ['White', 'Blue', 'Green', 'Yellow']), titleSize: new Rox.RoxNumber(12, [14, 18, 24]) }; async function initPlatform() { const options = { }; // Register the flags Rox.register('', flags); // Setup connection with the feature management environment key await Rox.setup('<your-SDK-key>', options);(1) // Boolean flag example if (flags.enableTutorial.isEnabled()) { console.log('enableTutorial flag is true'); // TODO: Put your code here that needs to be gated } // RoxString flag example console.log('Title color is ' + flags.titleColors.getValue()); // RoxNumber flag example console.log('Title size is ' + flags.titleSize.getValue()); } initPlatform().then(function() { console.log('Done loading CloudBees platform'); });
    1 The platform provides the unique SDK key for your environment at the <your-SDK-key> location within the Rox.setup call.
  7. Run your application and then select TEST INTEGRATION to confirm a successful connection.

After running the application, a default flag is automatically added to your feature flag list.

You have installed an SDK and created flags in your application.

Refer to the SDK reference for more information.