# Source: https://configcat.com/docs/integrations/mixpanel.md

# Mixpanel - Monitor your feature flag change events and feature flag analytics

Copy page

## Overview[​](#overview "Direct link to Overview")

There are two available integration opportunities between [ConfigCat and Mixpanel](https://mixpanel.com/partners/integrations/configcat):

* [Monitoring your feature flag change events in Mixpanel with Annotations](#annotations)
* [Sending feature flag evaluation analytics to Mixpanel Experiments](#experiments)

## Monitoring your feature flag change events in Mixpanel with Annotations[​](#annotations "Direct link to Monitoring your feature flag change events in Mixpanel with Annotations")

Ensures that every setting change in ConfigCat is sent to Mixpanel as an [Annotation](https://docs.mixpanel.com/docs/reports/insights#annotations).

![Mixpanel Annotation](/docs/assets/mixpanel/annotation.png)

### Installation[​](#installation "Direct link to Installation")

1. Have a [Mixpanel account](https://mixpanel.com/).
2. Create a Service account that has at least an Analyst role. ![mixpanel\_service\_Account](/docs/assets/mixpanel/service_account.png)
3. Open the [integrations tab](https://app.configcat.com/product/integrations) on the ConfigCat Dashboard.
4. Click on Mixpanel's CONNECT button and set your Mixpanel Service Account's Username, Secret, and your Project ID.
5. OPTIONAL - Set the proper server of your Mixpanel account. [More about Mixpanel servers](https://docs.mixpanel.com/docs/privacy/eu-residency).
6. You're all set. Go ahead and make some changes on your feature flags, then check your annotations in Mixpanel.

### Un-installation[​](#un-installation "Direct link to Un-installation")

1. Open the [integrations tab](https://app.configcat.com/product/integrations) on the ConfigCat Dashboard.
2. Click on Mixpanel's DISCONNECT button.

### Annotation details[​](#annotation-details "Direct link to Annotation details")

Every annotation sent to Mixpanel by ConfigCat has:

* **Integration ID:** configcat.
* **Date:** When the change happened
* **Description:** A brief summary of the change.

## Sending feature flag evaluation analytics to Mixpanel Experiments[​](#experiments "Direct link to Sending feature flag evaluation analytics to Mixpanel Experiments")

Ensures that feature flag evaluations are logged into [Mixpanel Experiments](https://docs.mixpanel.com/docs/reports/apps/experiments). With this integration, you can have advanced analytics about your feature flag usages, A/B test results.

### Setup[​](#setup "Direct link to Setup")

1. **Install SDKs:** Add both the ConfigCat SDK and Mixpanel SDK to your application.

2. **Configure SDKs:**

   * **ConfigCat SDK:** Initialize with your ConfigCat SDK key.
   * **Mixpanel SDK:** Set up with your Mixpanel token.

3. **Integrate Feature Flag Evaluations:**

   * During the initialization of the ConfigCat SDK, subscribe to the `flagEvaluated` hook.

   * Send feature flag evaluation data to Mixpanel using the `$experiment_started` event name. Include the following parameters:

     <!-- -->

     * `Experiment name`: the feature flag's key.
     * `Variant name`: the evaluated feature flag's value or variation ID
     * `Variation ID` (optional): the evaluated feature flag's variation ID

   * You can use the [Identify API](https://docs.mixpanel.com/docs/tracking-methods/id-management/identifying-users) in Mixpanel to enrich all your events with feature flag metadata. This way you can easily group/filter your existing Mixpanel events by feature flag evaluations.

Code samples:

* JavaScript, Node, SSR
* React
* Python
* Ruby
* Go
* Java
* Android
* Swift (iOS)
* Other languages

```js
const configCatClient = configcat.getClient("#YOUR_SDK_KEY", PollingMode.AutoPoll, {
    setupHooks: (hooks) =>
        hooks.on('flagEvaluated', evaluationDetails => {
            // Send an `$experiment_started` event.
            mixpanel.track('$experiment_started',
                {
                    'Experiment name': evaluationDetails.key,
                    'Variant name': evaluationDetails.value,
                    'Variation ID': evaluationDetails.variationId
                });
            
            // Use the identify API.
            mixpanel.people.set({ ["configcat_" + evaluationDetails.key]: evaluationDetails.value });
        }),
});

```

```tsx
<ConfigCatProvider
  sdkKey="#YOUR_SDK_KEY"
  pollingMode={PollingMode.AutoPoll}
  options={{
    setupHooks: (hooks) =>
      hooks.on('flagEvaluated', evaluationDetails => {
        // Send an `$experiment_started` event.
        mixpanel.track('$experiment_started',
            {
                'Experiment name': evaluationDetails.key,
                'Variant name': evaluationDetails.value,
                'Variation ID': evaluationDetails.variationId
            });
         
        // Use the identify API.
        mixpanel.people.set({ ["configcat_" + evaluationDetails.key]: evaluationDetails.value });
      }),
  }}
>
</ConfigCatProvider>

```

```python
def on_flag_evaluated(evaluation_details):
    # Send an `$experiment_started` event.
    mixpanel.track(evaluation_details.user.get_identifier(), '$experiment_started',  {
        'Experiment name': evaluation_details.key,
        'Variant name': evaluation_details.value,
        'Variation ID': evaluation_details.variation_id
    })

    # Use the identify API.
    mixpanel.people_set(evaluation_details.user.get_identifier(), {
        f'configcat_{evaluationDetails.key}': evaluation_details.value,
    })
    pass

client = configcatclient.get('#YOUR-SDK-KEY#',
    ConfigCatOptions(
        hooks=Hooks(on_flag_evaluated=on_flag_evaluated)
    )
)

```

```ruby
def on_flag_evaluated(evaluation_details):
    # Send an `$experiment_started` event.
    mixpanel.track(evaluation_details.user.get_identifier(), "$experiment_started",  {
        "Experiment name": evaluation_details.key,
        "Variant name": evaluation_details.value,
        "Variation ID": evaluation_details.variation_id
    })

    # Use the identify API.
    mixpanel.people.set(evaluation_details.user.get_identifier(), {
        "configcat_#{evaluationDetails.key}" => evaluation_details.value,
    })
end

client = ConfigCat.get("#YOUR-SDK-KEY#",
    ConfigCat::ConfigCatOptions.new(
        hooks: ConfigCat::Hooks.new(on_flag_evaluated: method(:on_flag_evaluated))
    )
)

```

```go
mp := mixpanel.NewApiClient("#YOUR-MIXPANEL-PROJECT-TOKEN#")

client := configcat.NewCustomClient(configcat.Config{SDKKey: "#YOUR-SDK-KEY#",
    Hooks: &configcat.Hooks{OnFlagEvaluated: func(details *configcat.EvaluationDetails) {
        // Send an `$experiment_started` event.
        _ = mp.Track(context.Background(), []*mixpanel.Event{
            mp.NewEvent("$experiment_started", details.Data.User.(*configcat.UserData).Identifier, map[string]any{
                "Experiment name": details.Data.Key,
                "Variant name":    details.Value,
                "Variation ID":    details.Data.VariationID,
            }),
        })

        // Use the identify API.
        _ = mp.PeopleSet(context.Background(),
            []*mixpanel.PeopleProperties{
                mixpanel.NewPeopleProperties(details.Data.User.(*configcat.UserData).Identifier, map[string]any{
                    "configcat_" + details.Data.Key: details.Value,
                }),
            },
        )
    }}})

```

```java
ConfigCatClient client = ConfigCatClient.get("#YOUR-SDK-KEY#", options -> {
    options.hooks().addOnFlagEvaluated(details -> {
        // Send an `$experiment_started` event.
        JSONObject eventProps = new JSONObject();
        eventProps.put("Experiment name", details.getKey());
        eventProps.put("Variant name", details.getValue());
        eventProps.put("Variation ID", details.getVariationId());
        JSONObject event = messageBuilder.event(details.getUser().getIdentifier(), "$experiment_started", eventProps);
        mixpanel.sendMessage(event);

        // Use the identify API.
        JSONObject userProps = new JSONObject();
        userProps.put("configcat_" + details.getKey(), details.getValue());
        JSONObject updateUser = messageBuilder.set(details.getUser().getIdentifier(), userProps);
        mixpanel.sendMessage(updateUser);
    });
});

```

```java
ConfigCatClient client = ConfigCatClient.get("#YOUR-SDK-KEY#", options -> {
    options.hooks().addOnFlagEvaluated(details -> {
        // Send an `$experiment_started` event.
        JSONObject eventProps = new JSONObject();
        eventProps.put("Experiment name", details.getKey());
        eventProps.put("Variant name", details.getValue());
        eventProps.put("Variation ID", details.getVariationId());
        mixpanel.track("$experiment_started", eventProps);

        // Use the identify API.
        mixpanel.getPeople().set("configcat_" + details.getKey(), details.getValue());
    });
});

```

```swift
let client = ConfigCatClient.get(sdkKey: "#YOUR-SDK-KEY#") { options in
    options.hooks.addOnFlagEvaluated { details in
        // Send an `$experiment_started` event.
        Mixpanel.mainInstance().track(event:"$experiment_started", properties: [
            "Experiment name": details.key,
            "Variant name": details.value,
            "Variation ID": details.variationId ?? "",
        ])
        
        // Use the identify API.
        let keyProperty = "configcat_" + details.Data.Key;
        Mixpanel.mainInstance().people.set(properties: [ keyProperty: details.value])
    }
}

```

While our documentation primarily provides code examples for languages that Mixpanel natively supports and has an official SDK, you can integrate with other languages by sending an event to Mixpanel with a third-party SDK or with using the [Mixpanel's Track Events API](https://developer.mixpanel.com/reference/track-event).

1. **Subscribe to the FlagEvaluated hook** in the ConfigCat SDK.

2. **Send an event to Mixpanel** using the `$experiment_started` event name. Include the following event properties:

   <!-- -->

   * `Experiment name`: the feature flag's key from the FlagEvaluated hook's EvaluationDetails
   * `Variant name`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails
   * `Variant name`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails
   * `distinct_id` (optional): in case you are using the tracking in a backend component or you don't identify all your event sendings to Mixpanel with user details, you have to send the [distinct\_id](https://docs.mixpanel.com/docs/tracking-methods/id-management/identifying-users#what-is-distinct-id) property as well to identify your user. You can use the User object's Identifier property from the FlagEvaluated hook or a value that best describes your user.

note

For Text feature flags with lengthy values (e.g., JSON), send the `variationId` instead of the `value` as the `Variant name` to Mixpanel. The `variationId` is a hashed version of the feature flag value, accessible on the ConfigCat Dashboard by enabling the *Show VariationIDs to support A/B testing* setting. Learn more [here](https://app.configcat.com/product/preferences).

4. Deploy your application and wait for feature flag evaluations to happen so Experiments in Mixpanel could be populated.

### Usage with Experiments[​](#usage-with-experiments "Direct link to Usage with Experiments")

Check your Experiments page in Mixpanel, select your feature flag as the Experiment.

![Mixpanel Experiments report](/docs/assets/mixpanel/experiments.png)

### Usage with Insights report[​](#usage-with-insights-report "Direct link to Usage with Insights report")

If you don't have access to the Experiments feature in Mixpanel, you can create a custom Insights report based on the `Experiment Started` event. You can filter for your feature flag keys with the `Experiment name` property and visualize the different variants by using the `Variant name` property as a Breakdown. Example:

![Mixpanel Insights report](/docs/assets/mixpanel/insights.png)

### Usage with enriched user properties for your custom events.[​](#usage-with-enriched-user-properties-for-your-custom-events "Direct link to Usage with enriched user properties for your custom events.")

If you use the [Identify API](https://docs.mixpanel.com/docs/tracking-methods/id-management/identifying-users) approach, you'll be able to use the feature flag evaluation data in your current reports. Example with a Breakdown:

![Mixpanel Insights report with enriched data](/docs/assets/mixpanel/enrichment.png)

## Useful Resources[​](#useful-resources "Direct link to Useful Resources")

* [Integrating ConfigCat and Mixpanel Analytics for Business Success - Blog Post](https://configcat.com/blog/2024/07/29/configcat-mixpanel-integration/)
* [ConfigCat Integrations API](https://configcat.com/docs/api/reference/integrations/)