Integrate FlagSync feature flags into React applications using hooks and providers.
@flagsync/react-sdk
integrates into React applications for client-side feature management and event tracking—ideal for single-user contexts like browser environments.
Requires React 16.3+ due to its dependency on the React Context API.
FlagSyncProvider
and provide the required configuration:
key
in FsUserContext
is unique and persistent for accurate MAU tracking and consistent flag evaluations. See User Context Best Practices for details.waitForReady
prop in FlagSyncProvider
to delay rendering until the SDK is initialized, or check readiness manually with hooks or render prop components:
Using waitForReady
waitForReady
to FlagSyncProvider
to delay rendering until the SDK is ready, avoiding flicker during initialization.Using hooks or render prop components
useFlag
, useFlags
, or useFlagSyncClient
to control rendering<FlagSyncFlag />
, and <FlagSyncFlags />
.defaultValue
or control
:
LocalStorage
or an initial flag set—values apply until the SDK is ready.useTrack
hook, which supports two usage patterns:
With a pre-filled event key
With a dynamic event key
track()
.SDK_UPDATE
: Emitted when flags are updatedSDK_READY
: Emitted when the SDK is readySDK_READY_FROM_STORE
: Emitted when flags are loaded from storageERROR
: Emitted when an error occurs during initializationuseFlagSyncClient
hook:
SDK_UPDATE
does not fire if syncing is disabled.FsConfig
interface:
key
in FsUserContext
is unique and persistent for accurate MAU tracking and consistent flag evaluations. See User Context Best Practices for details.sync
object: stream
, poll
, or off
.
sync
to off
, requiring a page refresh to fetch updated flags.Stream (Default)
Polling
Off
Memory (Default)
LocalStorage
useFlagSyncClient
to get the client.isReadyFromStore
property.isReady
checks to handle loading states. See Wait for Readiness.stream
/poll
/off
) based on your application’s needs.useTrack
for consistent event tracking in components.FLAGSYNC_SDK_KEY
: Your client-side FlagSync SDK key (required)