name	slug	description	framework	useCase	css	deployUrl	demoUrl	relatedTemplates
Experimentation with Statsig	ab-testing-statsig	Reduce CLS and improve performance from client-loaded experiments at the edge with Statsig	Next.js	Edge Config Edge Middleware Documentation	Tailwind	https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fexamples%2Ftree%2Fmain%2Fedge-middleware%2Fab-testing-statsig&project-name=ab-testing-statsig&repository-name=ab-testing-statsig&integration-ids=oac_NAO87zzp3ADxj2ZUh3vikLip&env=STATSIG_SERVER_API_KEY,NEXT_PUBLIC_STATSIG_CLIENT_KEY,STATSIG_CONSOLE_API_KEY,EDGE_CONFIG,EDGE_CONFIG_ITEM_KEY&envDescription=Statsig%20API%20keys%20and%20Edge%20Config%20settings&envLink=https%3A%2F%2Fdocs.statsig.com%2Fguides%2Ffirst-feature	https://edge-ab-testing-statsig.vercel.app	ab-testing-google-optimize ab-testing-simple

Experimentation with Statsig

This example shows how to do experimentation using Statsig, leveraging Edge Config and Edge Middleware.

Demo

https://edge-ab-testing-statsig.vercel.app

How to Use

You can choose from one of the following two methods to use this repository:

One-Click Deploy

Deploy the example using Vercel:

Clone and Deploy

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example https://github.com/vercel/examples/tree/main/edge-middleware/ab-testing-statsig
# or
yarn create next-app --example https://github.com/vercel/examples/tree/main/edge-middleware/ab-testing-statsig

Set up environment variables

Log in to the Statsig console and navigate to Settings -> API KEYS. Then, copy .env.example to .env.local and fill it in with your Client, Server and Console API keys:

cp .env.example .env.local

Install the Statsig Vercel Integration for your project. Then fill in .env.local with the provided Edge Config Connection String and Edge Config Item Key.

Next, run Next.js in development mode:

npm install
npm run dev

# or

yarn
yarn dev

Deploy it to the cloud with Vercel (Documentation).