PostHog Flags SDK Example

This example uses PostHog for feature flags with the Flags SDK along with the @flags-sdk/posthog PostHog adapter and the Flags Explorer.

Demo

https://flags-sdk-posthog.vercel.app/

How it works

This demo uses two feature flags in PostHog to control the visibility of two banners on the page. Both gates are configured to show/hide each banner 50% of the time.

If you deploy your own and configure the feature flags in PostHog, you can also use the Flags Explorer to enabled/disabled the features.

Deploy this template

Step 1: Link the project

In order to use the Flags Explorer, you need to link the project on your local machine.

vercel link

Select the project from the list you just deployed.

Step 2: Pull all environment variables

This allows the Flags SDK and the Flags Explorer to work correctly, by getting additional metadata.

vercel env pull

Step 3: Create Feature Flags

Head over to PostHog and create the feature flags required by this template.

Feature Flags:

• Summer Sale with the key summer_sale
• Free Shipping with the key free_delivery

You can also find the feature flag keys in the flags.ts file.

Set both feature flags to rollout to 50% of users.