Using Edge Config with Statsig

This guide will help you get started with using Vercel's Statsig integration with Edge Config. This integration allows you to use Edge Config as a configuration source for your Statsig feature flags.

Statsig is a statistics engine that enables you to automate A/B testing and make data-driven decisions at scale. The Statsig integration enables you to replace hard-coded values in your application with dynamic values on the server.

Before using this integration, you should have:

1. The latest version of Vercel CLI. To check your version, use vercel --version. To install or update Vercel CLI, use:

   pnpmyarnnpmbun

   pnpm i -g vercel@latest

2. A project. If you don't have one, you can run the following terminal commands to create a Next project:

   pnpmyarnnpmbun

   pnpm i next

   terminal

   npx create-next-app@latest

3. A Vercel project. If you don't have one, see Creating a Project

4. An Edge Config. If you don't have one, follow the Edge Config quickstart

5. The Edge Config SDK:

   pnpmyarnnpmbun

   pnpm i @vercel/edge-config

1. Set up the Statsig integration

   Visit the Statsig page in the Integration Marketplace and select the Add Integration button. Then:

   1. Select a Vercel team and Vercel project for your integration to be applied to
   2. Log into Statsig
   3. Select or create a new Edge Config to connect to Statsig
   4. Statsig will provide you with a Connection String and Edge Config Item Key. Save both, as you'll need them later in the setup

2. Add your Environment Variables

   Navigate to your Vercel dashboard, and select the project you want to use the Statsig integration with.

   Under the Settings tab, navigate to Environment Variables, and add the following variables:

   1. EDGE_CONFIG: Set this to the value of your Connection String
   2. EDGE_CONFIG_ITEM_KEY: Set this to the value of your Edge Config Item Key

   See our Environment Variables documentation to learn more.

3. Use the Statsig integration in your code

   Statsig's statsig-node-vercel package offers an EdgeConfigDataAdapter class, which you can use to initialize Statsig experiments with Edge Config.

   The following example sets up a Statsig experiment with Edge Config in an Middleware file, using the EDGE_CONFIG_ITEM_KEY environment variable.

   Next.js (/app)Next.js (/pages)Other frameworks

   middleware.ts

   TypeScript

   TypeScriptJavaScript

   import { NextResponse } from 'next/server';
   import type { NextRequest, NextFetchEvent } from 'next/server';
   import Statsig from 'statsig-node';
   import { createClient } from '@vercel/edge-config';
   import { EdgeConfigDataAdapter } from 'statsig-node-vercel';
    
   export const config = {
     matcher: '/',
   };
    
   const edgeConfigClient = createClient(process.env.EDGE_CONFIG!);
   const dataAdapter = new EdgeConfigDataAdapter({
     edgeConfigClient: edgeConfigClient,
     edgeConfigItemKey: process.env.EDGE_CONFIG_ITEM_KEY!,
   });
    
   export async function middleware(request: NextRequest, event: NextFetchEvent) {
     await Statsig.initialize('statsig-server-api-key-here', { dataAdapter });
    
     const experiment = await Statsig.getExperiment(
       { userID: 'exampleId' },
       'statsig_example_experiment',
     );
    
     // Do any other experiment actions here
    
     // Ensure that all logged events are flushed to Statsig servers before the middleware exits
     event.waitUntil(Statsig.flush());
    
     return NextResponse.next();
   }

Now that you have set up the Statsig Edge Config integration, you can explore the following topics to learn more:

• Get started with Edge Config
• Read with the SDK
• Use the dashboard
• Edge Config limits