Integrate your first flag

Create an app and environment in the Superflag dashboard, then copy the key for the runtime you are integrating. Use a public pub_ key for React, React Native, and Expo. Use a secret sdk_ key for server code. Create the example flag before running the application. The fixed production environment slug is prod:

npm install --global @superflag-sh/cli
superflag login
superflag doctor --json
superflag use my-app prod

For the Node example, keep the flag server-only. For React or Expo, opt into client delivery explicitly:

# Node/server
superflag flags upsert --key new-checkout --type bool --value true --no-client --json

# React
superflag flags upsert --key new-checkout --type bool --value true --client --json

# React Native/Expo
superflag flags upsert --key new-home --type bool --value true --client --json

--client is a delivery decision, not a security label added automatically by an SDK. Client flags and every advanced dependency must be safe to ship to an untrusted browser or device.

Node and server
React
React Native and Expo

npm install @superflag-sh/node

import { createSuperflag } from "@superflag-sh/node"

const flags = createSuperflag({
  apiKey: process.env.SUPERFLAG_API_KEY!,
})

export async function handleCheckout(user: { id: string; plan: string }) {
  const enabled = await flags.isEnabled("new-checkout", {
    targetingKey: user.id,
    attributes: { plan: user.plan },
  })

  return enabled ? runNewCheckout() : runClassicCheckout()
}

Create the client once at module scope. See Node usage for serverless, edge, targeting, caching, and failure behavior.

npm install @superflag-sh/react

import { SuperflagProvider, useBooleanFlag } from "@superflag-sh/react"

export function App() {
  return (
    <SuperflagProvider
      clientKey={process.env.NEXT_PUBLIC_SUPERFLAG_CLIENT_KEY}
      targetingKey="user-123"
      attributes={{ plan: "pro" }}
    >
      <Checkout />
    </SuperflagProvider>
  )
}

function Checkout() {
  const enabled = useBooleanFlag("new-checkout", false)
  return enabled ? <NewCheckout /> : <ClassicCheckout />
}

npx expo install @superflag-sh/react-native @react-native-async-storage/async-storage

import { SuperflagProvider, useBooleanFlag } from "@superflag-sh/react-native"

export default function App() {
  return (
    <SuperflagProvider
      clientKey={process.env.EXPO_PUBLIC_SUPERFLAG_CLIENT_KEY}
      targetingKey="user-123"
      attributes={{ plan: "pro" }}
    >
      <Home />
    </SuperflagProvider>
  )
}

function Home() {
  const enabled = useBooleanFlag("new-home", false)
  return enabled ? <NewHome /> : <ClassicHome />
}

Verify from the CLI

superflag get new-checkout --json # Node or React
superflag get new-home --json     # React Native or Expo
superflag flags list --app my-app --env prod --json

# Exercise the off path, then restore the example.
superflag set new-checkout false --app my-app --env prod --json
superflag get new-checkout --app my-app --env prod --json
superflag set new-checkout true --app my-app --env prod --json

superflag set new-home false --app my-app --env prod --json
superflag get new-home --app my-app --env prod --json
superflag set new-home true --app my-app --env prod --json

After each false write, confirm the application takes its classic path. Expo and React Native receive this JavaScript/config change without requiring a new native build. For automation, start with superflag contract --json, use explicit --app and --env selectors, and prefer validate/plan/dry-run/apply workflows before a mutation.

Understand keys and visibility

Choose the right credential and keep private targeting rules off clients.

Agent workflows

Build deterministic feature-flag workflows for coding agents and CI.

Start here

Node and server SDK

React SDK

React Native and Expo

Core SDK

CLI and agents

Feature decisions

HTTP API

Quickstart

Integrate your first flag

Verify from the CLI

Understand keys and visibility

Agent workflows

​Integrate your first flag

​Verify from the CLI

Understand keys and visibility

Agent workflows

Integrate your first flag

Verify from the CLI