@flaglayer/nextjs

Next.js integration for Flaglayer feature flags. Supports App Router, SSR, and middleware.

Install

npm install @flaglayer/nextjs @flaglayer/react

Client Components

import { FlagProvider } from '@flaglayer/nextjs';
import { useBooleanFlag } from '@flaglayer/react';

// In layout.tsx
export default function Layout({ children }) {
  return (
    <FlagProvider apiKey="your-api-key" context={{ userId }}>
      {children}
    </FlagProvider>
  );
}

// In components
function MyComponent() {
  const enabled = useBooleanFlag('feature', false);
}

Server Components

import { createFlagLayerServer } from '@flaglayer/nextjs/server';

const fl = createFlagLayerServer({ apiKey: 'your-api-key' });
const flags = await fl.evaluateAll({ userId: 'user-123' });

Middleware

import { createFlagLayerMiddleware } from '@flaglayer/nextjs/middleware';

export const middleware = createFlagLayerMiddleware({
  apiKey: 'your-api-key',
  rules: [{ flag: 'new-dashboard', rewrite: '/dashboard-v2' }],
});

Configuration

The API base URL defaults to the Flaglayer cloud API and can be overridden via the baseUrl option in any of the entry points.

Documentation | GitHub