Install an SDK and read the flag. You always pass a default value — the SDK returns it while the configuration is loading, if the flag is missing, or if its type doesn’t match.
React
JavaScript
npm install @softlaunch/react
Wrap your app in the provider, then read the flag with a hook:
import { SoftlaunchProvider, useBooleanFlag } from "@softlaunch/react";function App() { return ( <SoftlaunchProvider sdkKey="slc_..."> <Checkout /> </SoftlaunchProvider> );}function Checkout() { const { value: showRedesign } = useBooleanFlag( "checkout-redesign", // flag key "user-123", // subject key (a stable user identifier) { plan: "pro" }, // attributes used for targeting false, // default value ); return showRedesign ? <NewCheckout /> : <OldCheckout />;}
npm install @softlaunch/js
Initialize a client, then read the flag:
import { init } from "@softlaunch/js";const client = init({ sdkKey: "slc_..." });await client.waitUntilReady();const showRedesign = client.getBooleanFlag( "checkout-redesign", // flag key "user-123", // subject key (a stable user identifier) { plan: "pro" }, // attributes used for targeting false, // default value);if (showRedesign) { renderNewCheckout();}
