Setup Experiences

Setting Up Experiences with Fulcrum's React SDK

Fulcrum's React SDK is required to use the Experiences feature. This page will walk you through the process of installing and initializing the SDK, enabling you to create hyper-targeted in-product experiences in minutes.

Prerequisites

Before you begin, make sure you have the following:

Step 1: Install Fulcrum React SDK

To start, install the Fulcrum React SDK in your application using either npm or yarn.

Using npm

npm install getfulcrum-sdk

Using yarn

yarn add getfulcrum-sdk

Step 2: Initialize Fulcrum

Once the SDK is installed, initialize Fulcrum in your application code. Import the initFulcrumSDK function from the SDK and call it with your API Key and User ID.

API Key is generated from Fulcrum settings (opens in a new tab). User ID is your user's unique identifier. This is how Fulcrum personalizes product experience.

// Import the initFulcrumSDK and the elementInspector function from Fulcrum SDK
import { elementInspector, initFulcrumSDK } from "getfulcrum-sdk";
 
// Element Inspector helps you modify UI elements across different user segments
// For e.g. hiding a button, changing copy, replacing ui elements without requiring 
// code changes
elementInspector(document);
 
// Initialize Fulcrum with your API Key and User ID
initFulcrumSDK("<YOUR API KEY>", "<USER ID>");

Replace <YOUR API KEY> and <USER ID> with your actual API Key and User ID obtained from your Fulcrum account.

That's it. Now follow the in product prompts to use the experiences feature.

Here's a sample of how we modify our App.tsx

import { elementInspector, initFulcrumSDK } from "getfulcrum-sdk";
 
elementInspector(document);
 
function App() {
    const initialized = useRef(false);
    const userId = useSelector(selectUserId);
 
    // Initialize Fulcrum
    useEffect(() => {
        if (!initialized.current) {
            initialized.current = true;
            initFulcrumSDK(import.meta.env.VITE_FULCRUM_API_KEY, userId);
        }
    }, [userId]);
 
   ....
}
 
export default App;
 

Please reach out to help@getfulcrum.io for any questions.