Skip to content
Dashboard
flags.ts
import { vercelAdapter } from "@flags-sdk/vercel"
import { flag } from 'flags/next';
export const showNewFeature = flag({
key: 'show-new-feature',
description: 'Show the new dashboard redesign',
adapter: vercelAdapter()
});

app/page.tsx
import { showNewFeature } from "~/flags"
export default async function Page() {
const isEnabled = await showNewFeature()
return isEnabled ? <NewDashboard /> : <OldDashboard />
}

app.ts
import { OpenFeature } from '@openfeature/server-sdk';
import { VercelProvider } from '@vercel/flags-core/openfeature';
// Set up the provider and client
await OpenFeature.setProviderAndWait(new VercelProvider());
const client = OpenFeature.getClient();
// Evaluate flags
const enabled = await client.getBooleanValue('show-new-feature');

Vercel Flags transformed our feature access management. Rules and segments let non-technical stakeholders manage access groups through a simple interface—no more developer bottlenecks. Game changer for our team.
Dan Richfield FGS Global

Ready to deploy?