GrowthBook Visual Studio Code extension

• About
  • Features List
    • Viewing feature details
    • Copying a feature key
    • Editing a feature
• Configuration
  • Commands
• Contributing

About

The GrowthBook Visual Studio Code extension allows you to see your available feature definitions right in VS Code.

It can be configured to work with your project in under a minute and makes it easier for developers who use VS Code to work with the GrowthBook SDK by making features browsable and conveniently surfacing common actions.

Features List

Once the GrowthBook extension is installed and configured, you will be able to see all of the features for your project in a view panel at the bottom left.

Viewing feature details

You should be able to see the value type of the feature inline beside the feature name. When you hover over the feature, you should see all of the criteria specified in order for this feature to evaluate. In the below example, hovering over dark_mode shows that it has a default value of false and will evaluate to true for 50% of logged in users.

Copying a feature key

When hovering over a feature item, some action icons will appear on the right. One of them will allow you to copy the feature key to the clipboard so you can easily copy and paste into your project.

Once it's been successfully copied, you should see a message pop up temporarily in the bottom right.

Editing a feature

When hovering over a feature item, some action icons will appear on the right. One of them will allow you to open the feature edit screen in your browser on the GrowthBook dashboard, allowing you to view additional details and edit your feature.

Configuration

In order to use the extension, your project will need to have a .growthbook.json file.

You can create this configuration in one of the following ways:

• Use the "Add Configuration" button that shows up in the Features panel
• Use the command GrowthBook: Create a .growthbook.json configuration file.
• Manually create it by copy pasting the below code and including your own key after /features/

{
  "featuresEndpoint": "http://localhost:3100/api/features/key_dev_abc123xyz456",
  "appHost": "http://localhost:3100"  
}

• featuresEndpoint: This is available on the Environments → SDK Endpoints screen in GrowthBook
• appHost: This is the URL for the running application instance of GrowthBook. If you registered at growthbook.com, use the one that is generated for you, otherwise specify the URL of your self-hosted instance.

❗️ Note: We recommend that you omit this file from your project's version control and provide a sample .growthbook.json.example file that your team can copy locally, e.g. cp .growthbook.json.example .growthbook.json.

Commands

Some commands have been surfaced to help with configuring GrowthBook. You can access these commands from the command palette (by pressing Command + Shift + P on macOS or Control + Shift + P on Windows and Linux) and typing GrowthBook.

• Refresh features
• Create GrowthBook config

Contributing

See the Contributing Guide to help out with the project.