Skip to content

Next.js

Lets start by installing the required package for your Next.js project

Terminal window
npm install flags @flags-sdk/openfeature @openfeature/server-sdk @openfeature/ofrep-provider

Create a flags.ts file at the root of the Next.js project. You will have to initialize all the flags in this file. Next, lets initialize the OpenFeature adapter and use it to define your flags.

import { flag } from 'flags';
import { OpenFeature } from "@openfeature/server-sdk";
import { createOpenFeatureAdapter } from "@flags-sdk/openfeature";
import { OFREPProvider } from "@openfeature/ofrep-provider";
const openfeatureAdapter = createOpenFeatureAdapter(async () => {
const provider = new OFREPProvider({
baseUrl: "https://f.fflags.com/{{config.orgId}}",
headers: [
["x-fflags-group", "{{config.group}}"],
["x-fflags-api-key", "<API_KEY>"], // generate api key from the api keys section
],
});
await OpenFeature.setProviderAndWait(provider);
return OpenFeature.getClient();
});
export const beta = flag<boolean, { targetingKey: string }>({
key: "beta",
identify: () => ({
targetingKey: "[email protected]",
}),
adapter: openfeatureAdapter.booleanValue(),,
defaultValue: false,
});

To use the feature flag, you can check out flags-sdk documentation.