Add Feature Flags to your Next.js application with a single React Hook. This package integrates your Next.js application with HappyKit Flags. Create a free happykit.dev account to get started.

Key Features

• written for Next.js
• integrate using a simple useFlags() hook or getFlags() function
• supports App Router (Server Components & Client Components)
• only 2 kB gzipped size
• extremely fast flag responses (~50ms)
• supports Server-Side Rendering and Static Site Generation
• supports Middleware and Edge Functions
• supports User Targeting, Custom Rules and Rollouts

Documentation

See the full documentation for setup instructions and usage guides.

Examples

This is roughly what the usage of feature flags looks like once you're up and running.

// pages/index.js
import { useFlags } from "flags/client";
export default function IndexPage(props) {
  const flagBag = useFlags();
  return flagBag.flags.greeting === "dog" ? "Who's a good boye" : "Hello";
}

The self documenting examples at flags.happykit.dev show how to use @happykit/flags for client-side, static and server-side rendering.

Full Tutorial

A full tutorial including setup instructions is published on frontend-digest.com.