React

Install

npm install @flipfeatureflag/react @flipfeatureflag/js

Provider

import { FlipFlagProvider } from "@flipfeatureflag/react";

function App() {
  return (
    <FlipFlagProvider
      config={{
        url: "https://api.example.com",
        sdkKey: "YOUR_SDK_KEY",
        env: "prod",
      }}
    >
      <YourRoutes />
    </FlipFlagProvider>
  );
}

Hooks

import { useFlag, useVariant, useFlagsStatus } from "@flipfeatureflag/react";

function Checkout() {
  const enabled = useFlag("new_checkout");
  const variant = useVariant("new_checkout");
  const status = useFlagsStatus();

  if (!status.ready) {
    return null;
  }

  return enabled ? <NewCheckout /> : <OldCheckout />;
}