feature-flags-nextjs

Evaluate PostHog feature flags in Next.js client and server components.

Updated Feb 24, 2026

Search Tags:#nextjs #feature flags #react hooks #posthog #server-side evaluation #instrumentation-client

Ready to run

npx skills add https://github.com/FrekiManagarm/dunlo --skill feature-flags-nextjs-frekimanagarm

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: feature-flags-nextjs
Source: https://github.com/FrekiManagarm/dunlo/tree/main/.agents/skills/feature-flags-nextjs
Command: npx skills add https://github.com/FrekiManagarm/dunlo --skill feature-flags-nextjs-frekimanagarm

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Adds PostHog feature flag evaluation to Next.js apps so you can roll out functionality safely and avoid UI flicker by choosing the right client or server approach.

Core Features & Use Cases

Next.js feature flag setup guidance: Integrates PostHog for both client-side usage and server-side evaluation patterns in Next.js.
Correct flag evaluation behavior: Recommends server-side evaluation when possible to reduce hydration/UI flicker and pass values as props.
Framework-specific best practices: Covers Next.js instrumentation-client initialization, React hook usage, and guidance for Server Components and Route Handlers using posthog-node.

Quick Start

Initialize PostHog in instrumentation-client.ts and evaluate your PostHog flags server-side when you need values during initial render to prevent UI flicker, then pass evaluated results into client components as props.

Frequently Asked Questions about feature-flags-nextjs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I prevent UI flicker when using PostHog feature flags in Next.js?▼

To prevent UI flicker with PostHog feature flags in Next.js, evaluate flags server-side using posthog-node and pass the results into client components as props to avoid hydration mismatches.

How do I initialize PostHog in a Next.js 15.3 application?▼

Initialize PostHog in Next.js 15.3+ using the instrumentation-client.ts file to set up the client, ensuring minimal code changes while supporting both client-side hooks and server-side evaluation.

Can I evaluate PostHog feature flags in Next.js Server Components and Route Handlers?▼

Yes, you can evaluate PostHog feature flags in Next.js Server Components and Route Handlers using posthog-node for server-side evaluation, enabling safe progressive rollouts and per-user feature visibility.

Do I need environment variables to configure PostHog feature flags in Next.js?▼

Yes, you must use environment variables for PostHog keys to configure feature flag evaluation in Next.js, securely separating client and server credentials for both rendering scenarios.

What is the best way to handle feature flag rollouts in a Next.js app?▼

The best way to handle feature flag rollouts in Next.js is combining client-side React hooks with server-side evaluation via posthog-node, passing evaluated values as props to control progressive visibility safely.