skills.rest
FrekiManagarm
FrekiManagarmCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

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
One-click install
npx skills add https://github.com/FrekiManagarm/dunlo --skill feature-flags-nextjs-frekimanagarm
Or copy as Structured Prompt for Agent▼
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.

Related Skills

Explore More Software Engineering Skills→
omerakbenomerakben
1

nextjs-app-router

Instrument Next.js App Router apps with PostHog analytics for client and server events.

Community
Advanced
spencerpaulyspencerpauly
672

adding-feature-flags

Implement PostHog and environment-variable feature flags for staged rollouts.

Community
Intermediate
kausthubh-coderkausthubh-coder

posthog-instrumentation

Implement PostHog event tracking, user identification, and feature flags in Next.js and Convex.

Community
Intermediate
PostHogPostHog
58

feature-flags-nextjs

Manage and evaluate PostHog feature flags in Next.js apps.

Official
Advanced