From ab5c106324a456b337cb197186ecf78a8d3cf45f Mon Sep 17 00:00:00 2001 From: Peter Csajtai Date: Thu, 27 Nov 2025 11:09:26 +0100 Subject: [PATCH 1/5] Add new component for more sophisticated ordered lists --- website/docs/advanced/mcp-server.mdx | 85 ++-- website/docs/advanced/proxy/overview.mdx | 208 +++++---- website/docs/integrations/amplitude.mdx | 430 ++++++++++-------- website/docs/sdk-reference/dotnet.mdx | 39 +- website/src/components/Steps/index.tsx | 73 +++ .../src/components/Steps/styles.module.css | 111 +++++ 6 files changed, 632 insertions(+), 314 deletions(-) create mode 100644 website/src/components/Steps/index.tsx create mode 100644 website/src/components/Steps/styles.module.css diff --git a/website/docs/advanced/mcp-server.mdx b/website/docs/advanced/mcp-server.mdx index 7ff0161f0..02ae6d326 100644 --- a/website/docs/advanced/mcp-server.mdx +++ b/website/docs/advanced/mcp-server.mdx @@ -6,6 +6,7 @@ description: Use the ConfigCat Model Context Protocol (MCP) server to manage fea import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; +import { Steps, Step } from '@site/src/components/Steps'; ## Overview @@ -58,12 +59,19 @@ The MCP server's configuration includes the following environment variables: ### Client Configuration - - -1. Install [Cursor](https://cursor.com/) -2. Open **Preferences** → **Cursor Settings** → **MCP & Integrations** -3. Click **Add Custom MCP** -4. Add (or merge) the snippet below into your JSON settings: + + + +Install [Cursor](https://cursor.com/) + + +Open **Preferences** → **Cursor Settings** → **MCP & Integrations** + + +Click **Add Custom MCP** + + +Add (or merge) the snippet below into your JSON settings: ```json { @@ -79,14 +87,22 @@ The MCP server's configuration includes the following environment variables: } } ``` -5. **Save** – the server will start on demand. -6. You can start writing prompts into Cursor's AI panel. - - - - -1. Install [VS Code](https://code.visualstudio.com/) and [GitHub Copilot](https://code.visualstudio.com/docs/copilot/setup) -2. Create a `.vscode/mcp.json` file in your project root with the following content: + + +**Save** – the server will start on demand. + + +You can start writing prompts into Cursor's AI panel. + + + + + + +Install [VS Code](https://code.visualstudio.com/) and [GitHub Copilot](https://code.visualstudio.com/docs/copilot/setup) + + +Create a `.vscode/mcp.json` file in your project root with the following content: ```json { @@ -102,16 +118,28 @@ The MCP server's configuration includes the following environment variables: } } ``` -3. Save the settings file. The MCP server should now be available in VS Code. -4. You can start writing prompts into VS Code's AI panel. - - - - -1. Install [Claude Desktop](https://claude.ai/download) -2. Open **Settings** → **Developer** -3. Click **Edit Config** -4. In `claude_desktop_config.json` add: + + +Save the settings file. The MCP server should now be available in VS Code. + + +You can start writing prompts into VS Code's AI panel. + + + + + + +Install [Claude Desktop](https://claude.ai/download) + + +Open **Settings** → **Developer** + + +Click **Edit Config** + + +In `claude_desktop_config.json` add: ```json { @@ -127,9 +155,12 @@ The MCP server's configuration includes the following environment variables: } } ``` -5. **Save** & restart Claude Desktop. - - + + +**Save** & restart Claude Desktop. + + + :::info diff --git a/website/docs/advanced/proxy/overview.mdx b/website/docs/advanced/proxy/overview.mdx index 582cf3382..fb663bed6 100644 --- a/website/docs/advanced/proxy/overview.mdx +++ b/website/docs/advanced/proxy/overview.mdx @@ -8,6 +8,7 @@ toc_max_heading_level: 5 import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import CodeBlock from '@theme/CodeBlock'; +import { Steps, Step, Title } from '@site/src/components/Steps'; The ConfigCat Proxy allows you to host a feature flag evaluation service in your own infrastructure. It's a small Go application that communicates with ConfigCat's CDN network and caches/proxies *config JSON* files for your frontend and backend applications. The *config JSON* contains all the data that is needed for ConfigCat SDKs to evaluate feature flags. @@ -113,7 +114,11 @@ You can decide where you want the actual feature flag evaluation to happen. - **Local evaluation**: Feature flags are evaluated in your application by the ConfigCat SDK running in your application. The Proxy only provides the data required for the evaluation process. - **Remote evaluation**: Feature flags are evaluated within the Proxy, your application only gets the result of the evaluation process. -### 1. Local evaluation using a ConfigCat SDK connected to the Proxy + + + +### Local evaluation using a ConfigCat SDK connected to the Proxy + The Proxy has the ability to forward all information required for feature flag evaluation to ConfigCat SDKs via its [CDN proxy](endpoints.mdx#cdn-proxy) endpoint. This means that you can set up your ConfigCat SDK instances to use the Proxy as their data source. @@ -146,7 +151,12 @@ var configCatClient = configcat.getClient( ); ``` -### 2. Remote evaluation with the Proxy's API endpoints + + + + +### Remote evaluation with the Proxy's API endpoints + You can leverage the Proxy's server side feature flag evaluation feature by sending simple HTTP requests to the Proxy's API endpoints. @@ -179,7 +189,12 @@ try { You can find the available API endpoints with their HTTP request/response schemas [here](endpoints.mdx#api). -### 3. Remote evaluation with OpenFeature Remote Evaluation Protocol (OFREP) + + + + +### Remote evaluation with OpenFeature Remote Evaluation Protocol (OFREP) + :::info OFREP compatibility is only available from Proxy version v2.0.0. @@ -209,7 +224,12 @@ OpenFeature.setProvider( You can find the available OFREP endpoints with their HTTP request/response schemas [here](endpoints.mdx#openfeature-remote-evaluation-protocol-ofrep). -### 4. Remote evaluation and streaming with SSE + + + + +### Remote evaluation and streaming with SSE + The Proxy has the ability to evaluate feature flags and send notifications about subsequent evaluated flag value changes through Server-Sent Events connections. @@ -232,11 +252,19 @@ evtSource.onmessage = (event) => { For more information and usage examples, see the related [SSE endpoints documentation](endpoints.mdx#sse). -### 5. Remote evaluation and streaming with gRPC + + + + +### Remote evaluation and streaming with gRPC + The Proxy supports both unary feature flag evaluation RPCs and server streaming of evaluated flag value changes. For more information and usage examples, see the [gRPC section of this documentation](grpc.mdx). + + + ## Configuration Options You can specify options for the Proxy either via a YAML file or with environment variables. When an option is defined in both places, the environment variable's value takes precedence. @@ -413,107 +441,119 @@ You can set up Proxy profiles under the `Manage organization` -> `Proxy Profiles
To connect a Proxy instance to a Proxy profile, follow these steps: -- #### Create a new Proxy profile - Click on the `+ ADD PROFILE` button. - Add Profile + + + +#### Create a new Proxy profile + +Click on the `+ ADD PROFILE` button. +Add Profile +
+
+Give the profile a meaningful name and description, then click `CREATE`. +Create Profile + + + +#### Configure your Proxy instance + +Grab the `Key` and `Secret` from the profile creation dialog and put them into the Proxy's configuration. +Configure Proxy with key and secret + + + + +```yaml title="options.yml" +profile: + key: + secret: +``` + + + + +```shell +CONFIGCAT_PROFILE_KEY="" +CONFIGCAT_PROFILE_SECRET="" +``` + + + + + + +#### Select which SDK Keys your Proxy should use + +Click on the edit icon in the `SDK Keys` column. +Click on Select SDK Keys +
+
+Select the config/environment pairs whose SDK key you want to make available for your Proxy instance. +Select SDK Keys - Give the profile a meaningful name and description, then click `CREATE`. - Create Profile +:::info +You can click config names in the first column to toggle all SDK keys in a row, or environment names in the column headers to toggle all SDK keys in a column. +::: + + + +#### Locate SDK identifiers for the selected SDK Keys + +You can find the SDK identifiers generated for the selected config/environment pairs on the ConfigCat Dashboard right where you find their SDK Key. +Click on view SDK identifiers for ConfigCat Proxy + +In the dialog that appears, you can find the SDK identifiers for the current config/environment pair, listed for each available Proxy profile. +Click on view SDK identifiers for ConfigCat Proxy + + + +#### (Optional) Set up how your Proxy should learn about feature flag changes + +There are two ways a Proxy can detect feature flag changes. Each config/environment pair identified by each SDK key is automatically monitored for changes by periodic polling of the corresponding config JSON file at a configured frequency. +Besides polling, the Proxy can receive change notifications over HTTP, via its [webhook endpoint](endpoints.mdx#webhook). + +- ##### Config JSON poll interval + You have the option to control how frequently the Proxy should poll for config JSON changes. + Click on the configure icon in the `Connection preferences` column, set the poll interval and click on `SAVE POLL INTERVAL`. + Set config JSON poll interval

-- #### Configure your Proxy instance - Grab the `Key` and `Secret` from the profile creation dialog and put them into the Proxy's configuration. - Configure Proxy with key and secret +- ##### Webhook notification + You can set up automatic webhook notifications about feature flag changes for your Proxy by providing its public URL. + Click on the configure icon in the `Connection preferences` column and select `Webhook notification`. + Then, enter your Proxy instance's public URL and click `ADD PROXY URL`. + Set Proxy webhook URL + + Put the displayed webhook signing key(s) into your Proxy's configuration. + Signing keys are for making sure that webhook requests received by your Proxy are sent by ConfigCat. + Signatures are automatically [verified](../../advanced/notifications-webhooks.mdx#verifying-webhook-requests) by the Proxy. + Copy webhook signing key ```yaml title="options.yml" profile: - key: - secret: + webhook_signing_key: ``` ```shell - CONFIGCAT_PROFILE_KEY="" - CONFIGCAT_PROFILE_SECRET="" + CONFIGCAT_PROFILE_WEBHOOK_SIGNING_KEY="" ``` -
- -- #### Select which SDK Keys your Proxy should use - Click on the edit icon in the `SDK Keys` column. - Click on Select SDK Keys - Select the config/environment pairs whose SDK key you want to make available for your Proxy instance. - Select SDK Keys + Test the connection to your Proxy instance. + Test the webhook configuration + + - :::info - You can click config names in the first column to toggle all SDK keys in a row, or environment names in the column headers to toggle all SDK keys in a column. - ::: -
- -- #### Locate SDK identifiers for the selected SDK Keys - You can find the SDK identifiers generated for the selected config/environment pairs on the ConfigCat Dashboard right where you find their SDK Key. - Click on view SDK identifiers for ConfigCat Proxy - - In the dialog that appears, you can find the SDK identifiers for the current config/environment pair, listed for each available Proxy profile. - Click on view SDK identifiers for ConfigCat Proxy -
-
- -- #### (Optional) Set up how your Proxy should learn about feature flag changes - There are two ways a Proxy can detect feature flag changes. Each config/environment pair identified by each SDK key is automatically monitored for changes by periodic polling of the corresponding config JSON file at a configured frequency. - Besides polling, the Proxy can receive change notifications over HTTP, via its [webhook endpoint](endpoints.mdx#webhook). - - - ##### Config JSON poll interval - You have the option to control how frequently the Proxy should poll for config JSON changes. - Click on the configure icon in the `Connection preferences` column, set the poll interval and click on `SAVE POLL INTERVAL`. - Set config JSON poll interval -
-
- - - ##### Webhook notification - You can set up automatic webhook notifications about feature flag changes for your Proxy by providing its public URL. - Click on the configure icon in the `Connection preferences` column and select `Webhook notification`. - Then, enter your Proxy instance's public URL and click `ADD PROXY URL`. - Set Proxy webhook URL - - Put the displayed webhook signing key(s) into your Proxy's configuration. - Signing keys are for making sure that webhook requests received by your Proxy are sent by ConfigCat. - Signatures are automatically [verified](../../advanced/notifications-webhooks.mdx#verifying-webhook-requests) by the Proxy. - Copy webhook signing key - - - - - ```yaml title="options.yml" - profile: - webhook_signing_key: - ``` - - - - - ```shell - CONFIGCAT_PROFILE_WEBHOOK_SIGNING_KEY="" - ``` - - - - - Test the connection to your Proxy instance. - Test the webhook configuration -
-
- -- #### All configuration options related to Proxy profiles + #### All configuration options related to Proxy profiles diff --git a/website/docs/integrations/amplitude.mdx b/website/docs/integrations/amplitude.mdx index 4566f7f87..52e8aa349 100644 --- a/website/docs/integrations/amplitude.mdx +++ b/website/docs/integrations/amplitude.mdx @@ -7,6 +7,7 @@ description: ConfigCat Amplitude integration reference. This is a step-by-step g import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import CodeBlock from '@theme/CodeBlock'; +import { Steps, Step } from '@site/src/components/Steps'; ## Overview @@ -22,20 +23,44 @@ Every feature flag change in ConfigCat is annotated on the Amplitude charts as a ### Installation -1. Have an Amplitude subscription. -2. Get an Amplitude API Key and Secret Key. - amplitude_apikey_secretkey -3. Open the integrations tab on ConfigCat Dashboard. -4. Click on Amplitude's **Connect** button and set your Amplitude API key and Secret key. -5. You're all set. Go ahead and make some changes on your feature flags, then check your charts in Amplitude. + + +Have an Amplitude subscription. + + +Get an Amplitude API Key and Secret Key. +amplitude_apikey_secretkey + + +Open the integrations tab on ConfigCat Dashboard. + + +Click on Amplitude's **Connect** button and set your Amplitude API key and Secret key. + + +You're all set. Go ahead and make some changes on your feature flags, then check your charts in Amplitude. + + ### Un-installation -1. Open the integrations tab on ConfigCat Dashboard. -2. Click on Amplitude's **Connected** button. -2. Select the connection from the **Connected** dropdown. -3. Click the **Disconnect** button in the edit dialog. -4. Click **Yes** in the confirmation dialog. + + +Open the integrations tab on ConfigCat Dashboard. + + +Click on Amplitude's **Connected** button. + + +Select the connection from the **Connected** dropdown. + + +Click the **Disconnect** button in the edit dialog. + + +Click **Yes** in the confirmation dialog. + + ### Chart Annotation @@ -53,209 +78,218 @@ Ensures that feature flag evaluations are logged into Identify API in Amplitude to enrich all your events with feature flag metadata. This way you can easily group/filter your existing Amplitude events by feature flag evaluations. - -Code samples: - - -```js -const configCatClient = configcat.getClient("#YOUR_SDK_KEY", PollingMode.AutoPoll, { - setupHooks: (hooks) => - hooks.on('flagEvaluated', evaluationDetails => { + + +**Install SDKs:** Add both the ConfigCat SDK and Amplitude SDK to your application. + + +**Configure SDKs:** +- **ConfigCat SDK:** Initialize with your ConfigCat SDK key. +- **Amplitude SDK:** Set up with your Amplitude ApiKey. + + +**Integrate Feature Flag Evaluations:** +- During the initialization of the ConfigCat SDK, subscribe to the `flagEvaluated` hook. +- Send feature flag evaluation data to Amplitude using the `$exposure` event name. Include the following parameters: + - `flag_key`: the feature flag's key. + - `variant`: 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 in Amplitude to enrich all your events with feature flag metadata. This way you can easily group/filter your existing Amplitude events by feature flag evaluations. + +- Code samples: + + + ```js + const configCatClient = configcat.getClient("#YOUR_SDK_KEY", PollingMode.AutoPoll, { + setupHooks: (hooks) => + hooks.on('flagEvaluated', evaluationDetails => { + // Send an `$exposure` event. + amplitude.track('$exposure', + { + 'flag_key': evaluationDetails.key, + 'variant': evaluationDetails.value, + 'variation_id': evaluationDetails.variationId + }); + + // Use the identify API. + const identifyEvent = new amplitude.Identify(); + identifyEvent.set("configcat_" + evaluationDetails.key, evaluationDetails.value); + amplitude.identify(identifyEvent); + }), + }); + ``` + + + + ```tsx + + hooks.on('flagEvaluated', evaluationDetails => { // Send an `$exposure` event. amplitude.track('$exposure', - { - 'flag_key': evaluationDetails.key, - 'variant': evaluationDetails.value, - 'variation_id': evaluationDetails.variationId - }); + { + 'flag_key': evaluationDetails.key, + 'variant': evaluationDetails.value, + 'variation_id': evaluationDetails.variationId + }); // Use the identify API. const identifyEvent = new amplitude.Identify(); identifyEvent.set("configcat_" + evaluationDetails.key, evaluationDetails.value); amplitude.identify(identifyEvent); - }), -}); -``` - - - -```tsx - - hooks.on('flagEvaluated', evaluationDetails => { + }), + }} + > + + ``` + + + + ```python + def on_flag_evaluated(evaluation_details): + # Send an `$exposure` event. + amplitude.track( + BaseEvent( + event_type="$exposure", + user_id=evaluation_details.user.get_identifier(), + event_properties={ + "flag_key": evaluation_details.key, + "variant": evaluation_details.value, + "variation_id": evaluation_details.variation_id + } + )) + + # Use the identify API. + identify_obj=Identify() + identify_obj.set(f'configcat_{evaluationDetails.key}', evaluation_details.value) + amplitude.identify(identify_obj, EventOptions(user_id=evaluation_details.user.get_identifier())) + pass + + client = configcatclient.get('#YOUR-SDK-KEY#', + ConfigCatOptions( + hooks=Hooks(on_flag_evaluated=on_flag_evaluated) + ) + ) + ``` + + + + ```go + client := configcat.NewCustomClient(configcat.Config{SDKKey: "#YOUR-SDK-KEY#", + Hooks: &configcat.Hooks{OnFlagEvaluated: func(details *configcat.EvaluationDetails) { + // Send an `$exposure` event. + amplitude.Track(amplitude.Event{ + UserID: details.Data.User.(*configcat.UserData).Identifier, + EventType: "$exposure", + EventProperties: map[string]interface{}{ + "flag_key": details.Data.Key, + "variant": details.Value, + "variation_id": details.Data.VariationID, + }, + }) + + // Use the identify API. + identifyObj := amplitude.Identify{} + identifyObj.Set("configcat_" + details.Data.Key, details.Value) + amplitude.Identify(identifyObj, amplitude.EventOptions{UserID: details.Data.User.(*configcat.UserData).Identifier}) + }}}) + ``` + + + + ```java + ConfigCatClient client = ConfigCatClient.get("#YOUR-SDK-KEY#", options -> { + options.hooks().addOnFlagEvaluated(details -> { // Send an `$exposure` event. - amplitude.track('$exposure', - { - 'flag_key': evaluationDetails.key, - 'variant': evaluationDetails.value, - 'variation_id': evaluationDetails.variationId - }); + JSONObject eventProps = new JSONObject(); + eventProps.put("flag_key", details.getKey()); + eventProps.put("variant", details.getValue()); + eventProps.put("variation_id", details.getVariationId()); + Event event = new Event("$exposure", details.getUser().getIdentifier()); + amplitude.logEvent(event); // Use the identify API. - const identifyEvent = new amplitude.Identify(); - identifyEvent.set("configcat_" + evaluationDetails.key, evaluationDetails.value); - amplitude.identify(identifyEvent); - }), - }} -> - -``` - - - -```python -def on_flag_evaluated(evaluation_details): - # Send an `$exposure` event. - amplitude.track( - BaseEvent( - event_type="$exposure", - user_id=evaluation_details.user.get_identifier(), - event_properties={ - "flag_key": evaluation_details.key, - "variant": evaluation_details.value, - "variation_id": evaluation_details.variation_id - } - )) - - # Use the identify API. - identify_obj=Identify() - identify_obj.set(f'configcat_{evaluationDetails.key}', evaluation_details.value) - amplitude.identify(identify_obj, EventOptions(user_id=evaluation_details.user.get_identifier())) - pass - -client = configcatclient.get('#YOUR-SDK-KEY#', - ConfigCatOptions( - hooks=Hooks(on_flag_evaluated=on_flag_evaluated) - ) -) -``` - - - -```go -client := configcat.NewCustomClient(configcat.Config{SDKKey: "#YOUR-SDK-KEY#", - Hooks: &configcat.Hooks{OnFlagEvaluated: func(details *configcat.EvaluationDetails) { + JSONObject userProps = new JSONObject(); + userProps.put("configcat_" + details.getKey(), details.getValue()); + Event updateUser = new Event("$identify", details.getUser().getIdentifier()); + updateUser.userProperties = userProps; + amplitude.logEvent(event); + }); + }); + ``` + + + + ```java + ConfigCatClient client = ConfigCatClient.get("#YOUR-SDK-KEY#", options -> { + options.hooks().addOnFlagEvaluated(details -> { // Send an `$exposure` event. - amplitude.Track(amplitude.Event{ - UserID: details.Data.User.(*configcat.UserData).Identifier, - EventType: "$exposure", - EventProperties: map[string]interface{}{ - "flag_key": details.Data.Key, - "variant": details.Value, - "variation_id": details.Data.VariationID, - }, - }) - + amplitude.track( + "$exposure", + mutableMapOf( + "flag_key" to details.getKey(), + "variant" to details.getValue(), + "variation_id" to details.getVariationId() + )) + // Use the identify API. - identifyObj := amplitude.Identify{} - identifyObj.Set("configcat_" + details.Data.Key, details.Value) - amplitude.Identify(identifyObj, amplitude.EventOptions{UserID: details.Data.User.(*configcat.UserData).Identifier}) - }}}) -``` - - - -```java -ConfigCatClient client = ConfigCatClient.get("#YOUR-SDK-KEY#", options -> { - options.hooks().addOnFlagEvaluated(details -> { - // Send an `$exposure` event. - JSONObject eventProps = new JSONObject(); - eventProps.put("flag_key", details.getKey()); - eventProps.put("variant", details.getValue()); - eventProps.put("variation_id", details.getVariationId()); - Event event = new Event("$exposure", details.getUser().getIdentifier()); - amplitude.logEvent(event); - - // Use the identify API. - JSONObject userProps = new JSONObject(); - userProps.put("configcat_" + details.getKey(), details.getValue()); - Event updateUser = new Event("$identify", details.getUser().getIdentifier()); - updateUser.userProperties = userProps; - amplitude.logEvent(event); + val identify = Identify() + identify.set("configcat_" + details.getKey(), details.getValue()) + }); }); -}); -``` - - - -```java -ConfigCatClient client = ConfigCatClient.get("#YOUR-SDK-KEY#", options -> { - options.hooks().addOnFlagEvaluated(details -> { - // Send an `$exposure` event. - amplitude.track( - "$exposure", - mutableMapOf( - "flag_key" to details.getKey(), - "variant" to details.getValue(), - "variation_id" to details.getVariationId() - )) + ``` + - // Use the identify API. - val identify = Identify() - identify.set("configcat_" + details.getKey(), details.getValue()) - }); -}); -``` - - - -```swift -let client = ConfigCatClient.get(sdkKey: "#YOUR-SDK-KEY#") { options in - options.hooks.addOnFlagEvaluated { details in - // Send an `$exposure` event. - let event = BaseEvent( - eventType: "$exposure", - eventProperties: [ - "flag_key": details.key, - "variant": details.value, - "variation_id": details.variationId ?? "" - ] - ) + + ```swift + let client = ConfigCatClient.get(sdkKey: "#YOUR-SDK-KEY#") { options in + options.hooks.addOnFlagEvaluated { details in + // Send an `$exposure` event. + let event = BaseEvent( + eventType: "$exposure", + eventProperties: [ + "flag_key": details.key, + "variant": details.value, + "variation_id": details.variationId ?? "" + ] + ) - // Use the identify API. - let identify = Identify() - identify.set(property: "configcat_" + details.key, value: details.value) - amplitude.identify(identify: identify) + // Use the identify API. + let identify = Identify() + identify.set(property: "configcat_" + details.key, value: details.value) + amplitude.identify(identify: identify) + } } -} -``` - - - -While our documentation primarily provides code examples for languages that Amplitude natively supports and has an official SDK, -you can integrate with other languages by sending an event to Amplitude with a third-party SDK or with using the Amplitude's Upload request API. - -1. **Subscribe to the FlagEvaluated hook** in the ConfigCat SDK. -2. **Send an event to Amplitude** using the `$exposure` event name. Include the following event properties: - - `flag_key`: the feature flag's key from the FlagEvaluated hook's EvaluationDetails - - `variant`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails - - `variation_id`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails - - `user_id` (optional): in case you are using the tracking in a backend component or you don't identify all your event sendings to Amplitude with user details, -you have to send the `user_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` to Amplitude. -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 Amplitude could be populated. + ``` + + + + While our documentation primarily provides code examples for languages that Amplitude natively supports and has an official SDK, + you can integrate with other languages by sending an event to Amplitude with a third-party SDK or with using the Amplitude's Upload request API. + + 1. **Subscribe to the FlagEvaluated hook** in the ConfigCat SDK. + 2. **Send an event to Amplitude** using the `$exposure` event name. Include the following event properties: + - `flag_key`: the feature flag's key from the FlagEvaluated hook's EvaluationDetails + - `variant`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails + - `variation_id`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails + - `user_id` (optional): in case you are using the tracking in a backend component or you don't identify all your event sendings to Amplitude with user details, + you have to send the `user_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` to Amplitude. + 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). + ::: + + +Deploy your application and wait for feature flag evaluations to happen so Experiments in Amplitude could be populated. + + ### Usage with Experiments Check your Experiments page in Amplitude and select your feature flag as the Experiment. diff --git a/website/docs/sdk-reference/dotnet.mdx b/website/docs/sdk-reference/dotnet.mdx index 940741a85..c1c159cb9 100644 --- a/website/docs/sdk-reference/dotnet.mdx +++ b/website/docs/sdk-reference/dotnet.mdx @@ -6,6 +6,7 @@ description: ConfigCat .NET SDK Reference. This is a step-by-step guide on how t import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; +import { Steps, Step, Title } from '@site/src/components/Steps'; export const NetSchema = require('@site/src/schema-markup/sdk-reference/net.json'); @@ -20,7 +21,11 @@ export const NetSchema = require('@site/src/schema-markup/sdk-reference/net.json ## Getting started -### 1. Install _ConfigCat SDK_ [NuGet package](https://www.nuget.org/packages/ConfigCat.Client) + + + +### Install _ConfigCat SDK_ [NuGet package](https://www.nuget.org/packages/ConfigCat.Client) + @@ -43,19 +48,35 @@ dotnet add package ConfigCat.Client To get the _ConfigCat SDK_ up and running in Unity, please refer to [this guide](./unity.mdx). ::: -### 2. Import package + + + + +### Import package + ```csharp using ConfigCat.Client; ``` -### 3. Create the _ConfigCat_ client with your _SDK Key_ + + + + +### Create the _ConfigCat_ client with your _SDK Key_ + ```csharp var client = ConfigCatClient.Get("#YOUR-SDK-KEY#"); ``` -### 4. Get your setting value + + + + + +### Get your setting value + ```csharp var isMyAwesomeFeatureEnabled = await client.GetValueAsync("isMyAwesomeFeatureEnabled", false); @@ -71,7 +92,12 @@ else The _ConfigCat SDK_ also offers a synchronous API for feature flag evaluation. Read more [here](#snapshots-and-non-blocking-synchronous-feature-flag-evaluation). -### 5. Dispose the _ConfigCat_ client + + + + +### Dispose the _ConfigCat_ client + You can safely dispose all clients at once or individually and release all associated resources on application exit. @@ -81,6 +107,9 @@ ConfigCatClient.DisposeAll(); // disposes all clients client.Dispose(); // disposes a specific client ``` + + + ## Creating the _ConfigCat Client_ _ConfigCat Client_ is responsible for: diff --git a/website/src/components/Steps/index.tsx b/website/src/components/Steps/index.tsx new file mode 100644 index 000000000..3665b34d3 --- /dev/null +++ b/website/src/components/Steps/index.tsx @@ -0,0 +1,73 @@ +import React, { ReactNode } from 'react'; +import clsx from 'clsx'; +import styles from './styles.module.css'; + +interface ChildrenProps { + children: ReactNode; +} + +export const Steps: React.FC = ({ + children +}) => { + return ( +
+ {(React.Children.toArray(children) + .filter(child => child.type === Step) + .map((child, index) => { + const childNodes = React.Children.toArray(child.props.children); + const titleNode = childNodes.find(c => c.type === Title); + const content = childNodes.filter(c => c.type !== Title); + return titleNode ? ( +
+
+
{index + 1}
+
{titleNode}
+
+
+
+
+
+ {React.cloneElement(child, { children: content })} +
+
+
+
+
+
+
+ ) : ( +
+
+
{index + 1}
+
+
+
+
+ {child} +
+ ); + }) + )} +
+ ) +}; + +export const Step: React.FC = ({ + children +}) => { + return ( +
+ {children} +
+ ) +}; + +export const Title: React.FC = ({ + children +}) => { + return ( +
+ {children} +
+ ) +}; \ No newline at end of file diff --git a/website/src/components/Steps/styles.module.css b/website/src/components/Steps/styles.module.css new file mode 100644 index 000000000..328eb7afe --- /dev/null +++ b/website/src/components/Steps/styles.module.css @@ -0,0 +1,111 @@ +:root { + --step-number-background-color: rgba(172, 172, 172, 0.08); + --step-line-color: rgba(39, 39, 39, 0.12); +} + +[data-theme='dark'] { + --step-number-background-color: rgba(255, 255, 255, 0.05); + --step-line-color: rgba(255, 255, 255, 0.14); +} + +.steps { + margin-bottom: 25px; +} + +.step.withtitle { + display: flex; + flex-direction: column; +} + +.step.withouttitle { + display: flex; + flex-direction: row; + gap: 10px; +} + +.step.withouttitle .content { + margin-top: 6px; +} + +.step.withtitle .content { + margin-top: 15px; +} + +.step > .titlerow { + display: flex; + flex-direction: row; + align-items: center; + gap: 10px; +} + +.step .stepnum { + display: flex; + justify-content: center; + align-items: center; + min-width: 28px; + min-height: 28px; + font-weight: 600; + background-color: var(--step-number-background-color); + border: 1px solid var(--step-line-color); + border-radius: 50%; + font-size: 0.9rem; + margin: 6px 0; +} + +.step .line { + width: 1px; + background-color: var(--step-line-color); +} + +.step > .contentrow { + display: flex; + align-items: stretch; + flex-direction: row; + gap: 10px; +} + +.step > .stepnumcol { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; +} + +.step .content { + flex-grow: 1; + width: 100%; +} + +.step .linecont { + display: flex; + justify-content: center; + flex-grow: 1; + flex-shrink: 0; + width: 28px; + max-width: 28px; +} + +.step > .titlerow .title { + margin-top: -3px; +} + +.step.withtitle:not(:last-of-type) .padder .linecont { + height: 15px; +} + +.step .content { + width: calc(100% - 40px); +} + +.step:last-of-type .content > *:last-child { + margin: unset; +} + +.title > h1, +.title > h2, +.title > h3, +.title > h4, +.title > h5, +.title > h6 { + margin: unset; +} From 497632f3e8fa142e1a8a6d19fce3adeb0c5492f2 Mon Sep 17 00:00:00 2001 From: Peter Csajtai Date: Sat, 13 Dec 2025 16:01:10 +0100 Subject: [PATCH 2/5] Few styling fixes --- website/src/components/Steps/index.tsx | 9 +++++++-- website/src/components/Steps/styles.module.css | 15 +++++++++++---- 2 files changed, 18 insertions(+), 6 deletions(-) diff --git a/website/src/components/Steps/index.tsx b/website/src/components/Steps/index.tsx index 3665b34d3..89f28fd25 100644 --- a/website/src/components/Steps/index.tsx +++ b/website/src/components/Steps/index.tsx @@ -1,5 +1,5 @@ -import React, { ReactNode } from 'react'; import clsx from 'clsx'; +import React, { ReactNode } from 'react'; import styles from './styles.module.css'; interface ChildrenProps { @@ -20,7 +20,12 @@ export const Steps: React.FC = ({ return titleNode ? (
-
{index + 1}
+
+
{index + 1}
+
+
+
+
{titleNode}
diff --git a/website/src/components/Steps/styles.module.css b/website/src/components/Steps/styles.module.css index 328eb7afe..880e53f31 100644 --- a/website/src/components/Steps/styles.module.css +++ b/website/src/components/Steps/styles.module.css @@ -24,7 +24,7 @@ } .step.withouttitle .content { - margin-top: 6px; + margin-top: 1px; } .step.withtitle .content { @@ -34,7 +34,7 @@ .step > .titlerow { display: flex; flex-direction: row; - align-items: center; + align-items: flex-start; gap: 10px; } @@ -49,7 +49,14 @@ border: 1px solid var(--step-line-color); border-radius: 50%; font-size: 0.9rem; - margin: 6px 0; + margin: 0; +} + +.step.withtitle .stepnumcont { + align-self: stretch; + display: flex; + flex-direction: column; + justify-content: center; } .step .line { @@ -86,7 +93,7 @@ } .step > .titlerow .title { - margin-top: -3px; + margin-top: 1px; } .step.withtitle:not(:last-of-type) .padder .linecont { From b90146de9eb4353592bfa82de5c2a7ffae6c29a1 Mon Sep 17 00:00:00 2001 From: Peter Csajtai Date: Sat, 13 Dec 2025 21:18:38 +0100 Subject: [PATCH 3/5] Update news.mdx --- website/docs/news.mdx | 40 +++++++++++++++++++++++++++++++++------- 1 file changed, 33 insertions(+), 7 deletions(-) diff --git a/website/docs/news.mdx b/website/docs/news.mdx index 50396ac57..1bcf650f6 100644 --- a/website/docs/news.mdx +++ b/website/docs/news.mdx @@ -5,14 +5,21 @@ description: Instead of spamming your mailbox, we're posting news and product up --- import LazyVideo from '@site/src/components/LazyVideo'; +import { Steps, Step, Title } from '@site/src/components/Steps'; Here, you'll find all the latest updates, enhancements, and new features we've added to our service. Stay tuned to this page to keep up with all the latest news from ConfigCat! {/* This page must be in sync with the news page on the Dashboard: https://github.com/configcat/app/blob/master/src/app/home-module/news/news.component.html */} -## ConfigCat MCP Server + + + + +#### Sept 30, 2025 -#### Spet 30, 2025 + + +## ConfigCat MCP Server We just released a new official ConfigCat's Model Context Protocol (MCP) Server. AI tools like Cursor can now interact with ConfigCat via our new MCP server. @@ -36,11 +43,17 @@ AI tools like Cursor can now interact with ConfigCat via our new MCP server. /> For more info about how to set up the MCP server, [see Documentation](../advanced/mcp-server/). - -## Automatic ConfigCat Proxy configuration with Proxy profiles / OpenFeature Remote Evaluation Protocol + + + + #### Aug 22, 2025 + + +## Automatic ConfigCat Proxy configuration with Proxy profiles / OpenFeature Remote Evaluation Protocol + We have two exciting [ConfigCat Proxy](/docs/advanced/proxy/overview.mdx) related news: 1. From the [v2.0.0](https://github.com/configcat/configcat-proxy/releases/tag/v2.0.0) version, @@ -54,10 +67,16 @@ the Proxy has the ability to use [Proxy profiles](https://app.configcat.com/orga 2. From the [v2.0.0](https://github.com/configcat/configcat-proxy/releases/tag/v2.0.0) version, the Proxy conforms to the [OpenFeature Remote Evaluation Protocol](https://github.com/open-feature/protocol) (OFREP), which means it can be used with OFREP compatible OpenFeature providers. [See the API documentation](/docs/advanced/proxy/endpoints/#openfeature-remote-evaluation-protocol-ofrep) for the OFREP implementation with usage examples. -## New SDK for JavaScript with Cloudflare Workers support + + + #### Aug 15, 2025 + + +## New SDK for JavaScript with Cloudflare Workers support + We just released the [new, revamped ConfigCat SDK for JavaScript platforms](https://configcat.com/docs/sdk-reference/js/overview/). Unlike the previous platform-specific SDKs, it ships as a [single, unified NPM package](https://www.npmjs.com/package/@configcat/sdk) that supports multiple JS environments. @@ -94,10 +113,16 @@ But there are other advantages to upgrading to the new SDK sooner rather than la For the full list of new features and improvements, take a look at the [release notes](https://github.com/configcat/js-unified-sdk/releases/tag/v1.0.0). -## New ConfigCat OpenFeature providers + + + #### July 4, 2025 + + +## New ConfigCat OpenFeature providers + We're happy to share that we have released new OpenFeature providers for the following platforms: - [Angular](./sdk-reference/openfeature/angular.mdx) @@ -109,7 +134,8 @@ We're happy to share that we have released new OpenFeature providers for the fol [See the documentation](./sdk-reference/openfeature/overview.mdx) for the complete list of currently supported platforms. ---- + + ## Quality of Life improvements From b19ca958ef5bbf8e70e63dcc14375907d632a423 Mon Sep 17 00:00:00 2001 From: Peter Csajtai Date: Thu, 9 Apr 2026 17:30:28 +0200 Subject: [PATCH 4/5] Apply new ordered style --- .../advanced/code-references/azure-devops.mdx | 23 ++- .../code-references/bitbucket-pipe.mdx | 57 +++--- .../advanced/code-references/bitrise-step.mdx | 26 ++- .../advanced/code-references/circleci-orb.mdx | 28 ++- .../code-references/github-action.mdx | 26 ++- .../advanced/code-references/gitlab-ci.mdx | 29 +-- .../docs/advanced/code-references/manual.mdx | 16 +- .../advanced/code-references/overview.mdx | 13 +- .../advanced/config-v2-migration-guide.mdx | 12 +- .../advanced/migration-from-launchdarkly.mdx | 63 ++++-- .../docs/advanced/notifications-webhooks.mdx | 84 ++++++-- website/docs/advanced/proxy/overview.mdx | 36 ++-- .../team-management-basics.mdx | 20 +- website/docs/advanced/troubleshooting.mdx | 50 +++-- website/docs/faq.mdx | 16 +- website/docs/getting-started.mdx | 12 +- website/docs/integrations/amplitude.mdx | 17 +- website/docs/integrations/datadog.mdx | 52 +++-- .../docs/integrations/google-analytics.mdx | 37 ++-- website/docs/integrations/intellij.mdx | 180 ++++++++++++----- website/docs/integrations/jira.mdx | 127 +++++++++--- website/docs/integrations/mixpanel.mdx | 72 +++++-- website/docs/integrations/monday.mdx | 112 ++++++++--- website/docs/integrations/pubnub.mdx | 37 +++- website/docs/integrations/segment.mdx | 78 ++++++-- website/docs/integrations/slack.mdx | 50 ++++- website/docs/integrations/trello.mdx | 119 +++++++++--- website/docs/integrations/vscode.mdx | 181 ++++++++++++++---- website/docs/integrations/zapier.mdx | 49 +++-- website/docs/integrations/zoho-flow.mdx | 69 +++++-- website/docs/sdk-reference/dotnet.mdx | 37 +--- website/docs/sdk-reference/unity.mdx | 15 +- website/docs/sdk-reference/unreal.mdx | 11 +- .../targeting/feature-flag-evaluation.mdx | 16 +- website/docs/targeting/targeting-overview.mdx | 16 +- website/docs/zombie-flags.mdx | 18 +- 36 files changed, 1327 insertions(+), 477 deletions(-) diff --git a/website/docs/advanced/code-references/azure-devops.mdx b/website/docs/advanced/code-references/azure-devops.mdx index d7a63eff6..95b8e7be2 100644 --- a/website/docs/advanced/code-references/azure-devops.mdx +++ b/website/docs/advanced/code-references/azure-devops.mdx @@ -3,17 +3,23 @@ id: azure-devops title: Azure DevOps - Scan your source code for feature flags --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + This section describes how to use the [ConfigCat CLI](../cli.mdx) in Azure DevOps Pipelines to automatically scan your source code for feature flag and setting usages and upload the found code references to ConfigCat. ## Setup -1. Create a new ConfigCat Management API credential and store its values in Azure DevOps Pipeline Variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. + + +Create a new ConfigCat Management API credential and store its values in Azure DevOps Pipeline Variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. Azure secrets - -2. Get your selected [Config's ID](overview.mdx#config-id). - -3. Create a new or open your existing `azure-pipelines.yml` file, and add the following job to your `jobs` definition. + + +Get your selected [Config's ID](overview.mdx#config-id). + + +Create a new or open your existing `azure-pipelines.yml` file, and add the following job to your `jobs` definition. Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. ```yaml - job: configcat_scan_and_upload @@ -41,7 +47,10 @@ to automatically scan your source code for feature flag and setting usages and u :::info If you are using a different VCS than Azure DevOps' Git, you should set the `--file-url-template` and `--commit-url-template` according to your VCS provider. ::: - -4. Commit & push your changes. + + +Commit & push your changes. + + Scan reports are uploaded for each branch of your repository that triggers the job. diff --git a/website/docs/advanced/code-references/bitbucket-pipe.mdx b/website/docs/advanced/code-references/bitbucket-pipe.mdx index b6dbc29c5..2656be840 100644 --- a/website/docs/advanced/code-references/bitbucket-pipe.mdx +++ b/website/docs/advanced/code-references/bitbucket-pipe.mdx @@ -3,36 +3,45 @@ id: bitbucket-pipe title: Bitbucket Pipe - Scan your source code for feature flags --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + This section describes how to use ConfigCat's Bitbucket Pipe to automatically scan your source code for feature flag and setting usages and upload the found code references to ConfigCat. You can find more information about Bitbucket Pipelines here. ## Setup -1. Create a new ConfigCat Management API credential and store its values in secure pipeline variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. - Bitbucket Pipe secrets - -2. Get your selected [Config's ID](overview.mdx#config-id). - -3. Add the following snippet to the script section of your `bitbucket-pipelines.yml` file. - Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. - - ```yaml - - pipe: configcat/scan-repository-pipe:1.8.1 - variables: - CONFIG_ID: 'PASTE-YOUR-CONFIG-ID-HERE' - # LINE_COUNT: '3' # optional - # TIMEOUT: '1800' # optional - # SUB_FOLDER: '/src' # optional - # EXCLUDE_KEYS: > # optional - # flag_key_to_exclude_1 - # flag_key_to_exclude_2 - # ALIAS_PATTERNS: (\w+) = :CC_KEY,const (\w+) = feature_flags\.enabled\(:CC_KEY\) # optional - # USAGE_PATTERNS: feature_flags\.enabled\(:CC_KEY\) - # VERBOSE: 'true' # optional - ``` - -4. Commit & push your changes. + + +Create a new ConfigCat Management API credential and store its values in secure pipeline variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. +Bitbucket Pipe secrets + + +Get your selected [Config's ID](overview.mdx#config-id). + + +Add the following snippet to the script section of your `bitbucket-pipelines.yml` file. +Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. + +```yaml +- pipe: configcat/scan-repository-pipe:1.8.1 + variables: + CONFIG_ID: 'PASTE-YOUR-CONFIG-ID-HERE' + # LINE_COUNT: '3' # optional + # TIMEOUT: '1800' # optional + # SUB_FOLDER: '/src' # optional + # EXCLUDE_KEYS: > # optional + # flag_key_to_exclude_1 + # flag_key_to_exclude_2 + # ALIAS_PATTERNS: (\w+) = :CC_KEY,const (\w+) = feature_flags\.enabled\(:CC_KEY\) # optional + # USAGE_PATTERNS: feature_flags\.enabled\(:CC_KEY\) + # VERBOSE: 'true' # optional +``` + + +Commit & push your changes. + + Scan reports are uploaded for each branch of your repository that triggers the job. diff --git a/website/docs/advanced/code-references/bitrise-step.mdx b/website/docs/advanced/code-references/bitrise-step.mdx index cf356f3c9..4c288dc40 100644 --- a/website/docs/advanced/code-references/bitrise-step.mdx +++ b/website/docs/advanced/code-references/bitrise-step.mdx @@ -3,18 +3,23 @@ id: bitrise-step title: Bitrise - Scan your source code for feature flags --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + This section describes how to use ConfigCat's Bitrise Step to automatically scan your source code for feature flag and setting usages and upload the found code references to ConfigCat. Bitrise is full-featured mobile CI/CD platform. You can find more information about Bitrise Steps here. ## Setup - -1. Create a new ConfigCat Management API credential and store its values in secure pipeline variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. - Bitrise secrets - -2. Get your selected [Config's ID](overview.mdx#config-id). - -3. Add the following step to the workflows section of your `bitrise.yml` file. + + +Create a new ConfigCat Management API credential and store its values in secure pipeline variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. +Bitrise secrets + + +Get your selected [Config's ID](overview.mdx#config-id). + + +Add the following step to the workflows section of your `bitrise.yml` file. Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. ```yaml @@ -30,8 +35,11 @@ to automatically scan your source code for feature flag and setting usages and u # - usage-patterns: feature_flags\.enabled\(:CC_KEY\) # optional # - verbose: true # optional ``` - -4. Commit & push your changes. + + +Commit & push your changes. + + Scan reports are uploaded for each branch of your repository that triggers the job. diff --git a/website/docs/advanced/code-references/circleci-orb.mdx b/website/docs/advanced/code-references/circleci-orb.mdx index 303eca432..f7180c9d6 100644 --- a/website/docs/advanced/code-references/circleci-orb.mdx +++ b/website/docs/advanced/code-references/circleci-orb.mdx @@ -3,19 +3,24 @@ id: circleci-orb title: CircleCI Orb - Scan your source code for feature flags --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + This section describes how to use ConfigCat's CircleCI Orb to automatically scan your source code for feature flag and setting usages and upload the found code references to ConfigCat. You can find more information about CircleCI Orbs here. ## Setup - -1. Create a new ConfigCat Management API credential and store its values in CircleCI Environment Variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. - CircleCI Orb secrets - -2. Get your selected [Config's ID](overview.mdx#config-id). - -3. Create a new CircleCI YAML config in your repository under the `.circleci` folder, and put the following snippet into it. - Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. + + +Create a new ConfigCat Management API credential and store its values in CircleCI Environment Variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. +CircleCI Orb secrets + + +Get your selected [Config's ID](overview.mdx#config-id). + + +Create a new CircleCI YAML config in your repository under the `.circleci` folder, and put the following snippet into it. +Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. ```yaml version: 2.1 @@ -40,8 +45,11 @@ You can find more information about CircleCI Orbs Scan Repository GitHub Action to automatically scan your source code for feature flag and setting usages and upload the found code references to ConfigCat. You can find more information about GitHub Actions here. ## Setup - -1. Create a new ConfigCat Management API credential and store its values in your repository's GitHub Secrets with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. - Github Action secrets - -2. Get your selected [Config's ID](overview.mdx#config-id). - -3. Create a new Actions workflow in your GitHub repository under the `.github/workflows` folder, and put the following snippet into it. Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. + + +Create a new ConfigCat Management API credential and store its values in your repository's GitHub Secrets with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. +Github Action secrets + + +Get your selected [Config's ID](overview.mdx#config-id). + + +Create a new Actions workflow in your GitHub repository under the `.github/workflows` folder, and put the following snippet into it. Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. ```yaml on: [push] @@ -42,8 +47,11 @@ You can find more information about GitHub Actions GitLab CI/CD to automatically scan your source code for feature flag and setting usages and upload the found code references to ConfigCat. ## Setup - -1. Create a new ConfigCat Management API credential and store its values in GitLab's CI/CD Variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. - GitLab secrets - -2. Get your selected [Config's ID](overview.mdx#config-id). - -3. Create a new or open your existing `.gitlab-ci.yml` file, and put the following job into it. - Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. + + +Create a new ConfigCat Management API credential and store its values in GitLab's CI/CD Variables with the following names: `CONFIGCAT_API_USER`, `CONFIGCAT_API_PASS`. +GitLab secrets + + +Get your selected [Config's ID](overview.mdx#config-id). + + +Create a new or open your existing `.gitlab-ci.yml` file, and put the following job into it. +Don't forget to replace the `PASTE-YOUR-CONFIG-ID-HERE` value with your actual Config ID. ```yaml configcat-scan-repository: @@ -33,7 +38,9 @@ to automatically scan your source code for feature flag and setting usages and u --upload --non-interactive ``` - -4. Commit & push your changes. - + + +Commit & push your changes. + + Scan reports are uploaded for each branch of your repository that triggers the job. diff --git a/website/docs/advanced/code-references/manual.mdx b/website/docs/advanced/code-references/manual.mdx index 62d08cc89..fb82ee76d 100644 --- a/website/docs/advanced/code-references/manual.mdx +++ b/website/docs/advanced/code-references/manual.mdx @@ -3,14 +3,24 @@ id: manual title: CLI - Add to CI/CD pipelines manually --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + This section describes how to use the [ConfigCat CLI](../cli.mdx) to scan your source code for feature flag and setting usages and upload the found code references to ConfigCat. ## Prerequisites -- [Install](../cli.mdx#installation) the CLI in your CI/CD or local environment. -- [Setup](../cli.mdx#setup) the CLI with your ConfigCat Management API credentials. -- Get your selected [Config's ID](overview.mdx#config-id). + + +[Install](../cli.mdx#installation) the CLI in your CI/CD or local environment. + + +[Setup](../cli.mdx#setup) the CLI with your ConfigCat Management API credentials. + + +Get your selected [Config's ID](overview.mdx#config-id). + + ## Scan & Upload diff --git a/website/docs/advanced/code-references/overview.mdx b/website/docs/advanced/code-references/overview.mdx index ed9f0bca1..293ca6d68 100644 --- a/website/docs/advanced/code-references/overview.mdx +++ b/website/docs/advanced/code-references/overview.mdx @@ -4,6 +4,7 @@ title: Scan & Upload Code References Overview --- import CodeRefIntro from './\_intro.mdx' +import { Steps, Step, Title } from '@site/src/components/Steps'; @@ -46,13 +47,17 @@ In non-interactive environments, like in a CI/CD pipeline, you have to pass the To get the ID of a Config, follow the steps below: -1. Go to your ConfigCat Dashboard, select the desired Config, and click the code references icon on one of your feature flags. - + + +Go to your ConfigCat Dashboard, select the desired Config, and click the code references icon on one of your feature flags. ConfigCat code references button -2. Copy the Config ID from the highlighted box. - + + +Copy the Config ID from the highlighted box. ConfigCat Config ID + + ## How Scanning Works diff --git a/website/docs/advanced/config-v2-migration-guide.mdx b/website/docs/advanced/config-v2-migration-guide.mdx index fd1364374..c4ad77968 100644 --- a/website/docs/advanced/config-v2-migration-guide.mdx +++ b/website/docs/advanced/config-v2-migration-guide.mdx @@ -4,6 +4,8 @@ title: Config V2 Migration Guide description: A detailed guide on how to migrate from Config V1 to Config V2. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + This guide will help you migrate from Config V1 to Config V2. ## What is Config V2? @@ -30,8 +32,14 @@ The migration process starts with copying your V1 config to a new V2 one and upd ### Step 1: Create the V2 config -1. Open the ConfigCat Dashboard and click on the `Start migration` button on top of a V1 config. -2. Click `Create V2 config` to create a new config with the same settings as the V1 config. + + +Open the ConfigCat Dashboard and click on the `Start migration` button on top of a V1 config. + + +Click `Create V2 config` to create a new config with the same settings as the V1 config. + + It's important to note that the V2 config will be created with the same settings as the V1 config and the V1 config will still be accessible and unchanged. diff --git a/website/docs/advanced/migration-from-launchdarkly.mdx b/website/docs/advanced/migration-from-launchdarkly.mdx index 1384d4498..396053f7a 100644 --- a/website/docs/advanced/migration-from-launchdarkly.mdx +++ b/website/docs/advanced/migration-from-launchdarkly.mdx @@ -7,15 +7,24 @@ description: A guide to migration from LaunchDarkly to ConfigCat. import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import CodeBlock from '@theme/CodeBlock'; +import { Steps, Step, Title } from '@site/src/components/Steps'; This document is for current LaunchDarkly users who want to migrate to ConfigCat. It guides you through the migration process while providing information on the technical differences between the two services that you need to be aware of. Migration can be done on a LaunchDarkly project basis, and migration of a project usually consists of the following three steps: -1. Migrating LaunchDarkly feature flags and segments to ConfigCat -1. Adjusting the code of your applications to use ConfigCat instead of LaunchDarkly -1. Migrating LaunchDarkly teams and permissions to ConfigCat + + +Migrating LaunchDarkly feature flags and segments to ConfigCat + + +Adjusting the code of your applications to use ConfigCat instead of LaunchDarkly + + +Migrating LaunchDarkly teams and permissions to ConfigCat + + ConfigCat provides a wizard-like tool that is able to do the heavy lifting for step 1. However, there is currently no automation for step 2 and 3. So please expect these steps to require some manual work. @@ -229,23 +238,31 @@ process.exit(0); Let's see now step by step how to convert this code to ConfigCat: -1. Uninstall the LaunchDarkly SDK package, and install the ConfigCat one instead: + + +Uninstall the LaunchDarkly SDK package, and install the ConfigCat one instead: ```bash npm uninstall @launchdarkly/node-server-sdk npm install configcat-node ``` -1. Instead of the `LaunchDarkly` namespace, import `configcat`: + + +Instead of the `LaunchDarkly` namespace, import `configcat`: ```js import configcat from "configcat-node"; ``` -1. Replace the LaunchDarkly SDK key with the ConfigCat one. + + +Replace the LaunchDarkly SDK key with the ConfigCat one. You can obtain it from the [ConfigCat Dashboard](https://app.configcat.com/organization), by selecting the config containing the imported feature flag on the sidebar, and clicking the "VIEW SDK KEY" button in the top right corner of the page. -1. Instead of a LaunchDarkly client instance, obtain a ConfigCat one: + + +Instead of a LaunchDarkly client instance, obtain a ConfigCat one: ```js const client = configcat.getClient(sdkKey, configcat.PollingMode.AutoPoll, { @@ -257,7 +274,9 @@ Let's see now step by step how to convert this code to ConfigCat: polling strategies to get the data necessary for feature flag evaluation. Refer to the [SDK reference](../../sdk-reference/js/overview#creating-the-configcat-client) to learn more about the options. For frontend applications and long-running backend services, Auto Polling mode is usually a good choice. -1. Adjust the wait-for-initialization logic. + + +Adjust the wait-for-initialization logic. * When using Auto Polling mode, you can rewrite it like this: ```js const clientCacheState = await client.waitForReady(); @@ -276,7 +295,9 @@ Let's see now step by step how to convert this code to ConfigCat: Actually, you only need this wait-for-initialization logic at the startup of your applications if you want to use [synchronous feature flag evaluation via snapshots](../../sdk-reference/js/overview#snapshots-and-synchronous-feature-flag-evaluation). * For other polling modes, the wait-for-initialization logic doesn't make sense, so just omit it. -1. Rewrite LaunchDarkly contexts to ConfigCat User Objects. + + +Rewrite LaunchDarkly contexts to ConfigCat User Objects. ConfigCat uses the concept of [User Object](../../targeting/user-object) to pass user and/or session-related contextual data to feature flag evaluation. It serves the same purpose as [LaunchDarkly contexts](https://launchdarkly.com/docs/home/observability/contexts), @@ -299,7 +320,9 @@ Let's see now step by step how to convert this code to ConfigCat: comparators only. This means that it's not possible to specify multiple values for a user attribute if the evaluated feature flag contains a [User Condition](../../targeting/targeting-rule/user-condition) that references the attribute, but has a comparator other than the two mentioned. Unfortunately, no workaround exists for this case. -1. Rewrite feature flag evaluation calls. + + +Rewrite feature flag evaluation calls. This step is pretty straightforward as ConfigCat SDKs provide similar evaluation methods to LaunchDarkly SDKs. Those methods are named `getValue`, `getValueAsync` or similar. @@ -323,6 +346,8 @@ Let's see now step by step how to convert this code to ConfigCat: feature flag evaluation is usually still possible, [via snapshots](../../sdk-reference/js/overview#snapshots-and-synchronous-feature-flag-evaluation). But this works slightly differently from the asynchronous methods, so make sure you understand its behavior and possible pitfalls. + + By adjusting the example code according to the above, we get this: @@ -379,12 +404,18 @@ If you're out of luck, you can still use the ConfigCat SDK directly as explained [contact us](https://configcat.com/support) about the missing OpenFeature provider. Otherwise, to switch to ConfigCat, you need to do the following: -1. Uninstall the LaunchDarkly OpenFeature provider package, and install the ConfigCat one instead. -1. Adjust the initialization logic. + + +Uninstall the LaunchDarkly OpenFeature provider package, and install the ConfigCat one instead. + + +Adjust the initialization logic. Look for a call to `setProvider`, `setProviderAndWait` or similar, and change it so an instance of ConfigCat OpenFeature provider is passed to it. (For ConfigCat, use `setProviderAndWait` if possible.) -1. Convert [LaunchDarkly-specific evaluation context objects](https://github.com/launchdarkly/openfeature-node-server?tab=readme-ov-file#openfeature-specific-considerations) + + +Convert [LaunchDarkly-specific evaluation context objects](https://github.com/launchdarkly/openfeature-node-server?tab=readme-ov-file#openfeature-specific-considerations) to have a data structure compatible with ConfigCat. This is done in a very similar way to what's described in the previous section. Read [this section](../migration-from-launchdarkly-translation#mapping-between-launchdarkly-contexts-and-configcat-user-objects) @@ -423,10 +454,14 @@ Otherwise, to switch to ConfigCat, you need to do the following: "/kind": ["user", "organization"], }; ``` -1. Review feature flag evaluation calls. + + +Review feature flag evaluation calls. Most of the pitfalls pointed out in the "Rewrite feature flag evaluation calls" part of the previous section applies here too. + + ### Implement experiments and analytics diff --git a/website/docs/advanced/notifications-webhooks.mdx b/website/docs/advanced/notifications-webhooks.mdx index 0416fd760..a39bcab96 100644 --- a/website/docs/advanced/notifications-webhooks.mdx +++ b/website/docs/advanced/notifications-webhooks.mdx @@ -6,6 +6,7 @@ description: Webhooks are a way to send notifications to your applications about import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; +import { Steps, Step, Title } from '@site/src/components/Steps'; ConfigCat Webhooks can notify your applications when a feature flag or other Setting changes by calling a public HTTP endpoint on your end. This allows your applications to react almost immediately to updates. @@ -14,11 +15,23 @@ To enable Webhooks, simply tell us which HTTP endpoint to call. ConfigCat will s ## Adding a Webhook -1. Go to the Webhooks screen. -2. Click the **+ ADD WEBHOOK** button. -3. Choose **when** webhook notifications should be sent by selecting the **Config** and **Environment** where changes should trigger the Webhook. -4. Define **how** to notify your system by setting the **URL** and the **HTTP METHOD**. This tells us which endpoint to call. -5. (Optional) Add custom HTTP headers and a request body if needed. + + +Go to the Webhooks screen. + + +Click the **+ ADD WEBHOOK** button. + + +Choose **when** webhook notifications should be sent by selecting the **Config** and **Environment** where changes should trigger the Webhook. + + +Define **how** to notify your system by setting the **URL** and the **HTTP METHOD**. This tells us which endpoint to call. + + +(Optional) Add custom HTTP headers and a request body if needed. + + ## Request body with variables @@ -55,16 +68,24 @@ The ##ChangeDetails## variable is replaced with a JSON array in the following fo ``` ## Testing your Webhook - -1. Change some of your settings in the _ConfigCat Dashboard._ -2. Click **SAVE & PUBLISH CHANGES**. -3. Check if your Webhook was called correctly. + + +Change some of your settings in the _ConfigCat Dashboard._ + + +Click **SAVE & PUBLISH CHANGES**. + + +Check if your Webhook was called correctly. :::info **Developer Tip** - Running your Webhook on `localhost`? Expose it to the public internet temporarily by using a tool like ngrok. This enables ConfigCat to call your webhook even in your local development environment. - Just interested in what ConfigCat sends? Try [Webhhok.site](https://webhook.site/). This allows you to catch HTTP requests and see their content without requiring your to run anything anywhere. ::: + + + ## Verifying Webhook requests @@ -378,28 +399,49 @@ it will retry the request up to 5 times, using variable delays between attempts. ## Connecting to Slack A few steps to set up Slack and get a message when a setting changes: - -1. In Slack, create an Incoming Webhook and copy the **Webhook URL**. -2. In ConfigCat, go to the Webhooks screen, and click **+ ADD WEBHOOK**. -3. Paste Slack's **Webhhok URL** to ConfigCat's **URL** field. -4. Select **POST** as the **HTTP METHOD**. -5. Add the following request body: + + +In Slack, create an Incoming Webhook and copy the **Webhook URL**. + + +In ConfigCat, go to the Webhooks screen, and click **+ ADD WEBHOOK**. + + +Paste Slack's **Webhhok URL** to ConfigCat's **URL** field. + + +Select **POST** as the **HTTP METHOD**. + + +Add the following request body: ``` { "text": "<##URL##|##ConfigName## - ##EnvironmentName##> changed in ConfigCat: \n\n##ChangeDetailsSlack##" } ``` + + ## Connecting to Microsoft Teams A few steps to set up Microsoft Teams and get a message when a setting changes: -1. In Microsoft Teams, create an Incoming Webhook and copy the **Webhook URL**. -2. In ConfigCat, go to the Webhooks screen, and click **+ ADD WEBHOOK**. -3. Paste Microsoft Teams' **Webhhok URL** to ConfigCat's **URL** field. -4. Select **POST** as the **HTTP METHOD**. -5. Add the following request body: + + +In Microsoft Teams, create an Incoming Webhook and copy the **Webhook URL**. + + +In ConfigCat, go to the Webhooks screen, and click **+ ADD WEBHOOK**. + + +Paste Microsoft Teams' **Webhhok URL** to ConfigCat's **URL** field. + + +Select **POST** as the **HTTP METHOD**. + + +Add the following request body: ``` { @@ -419,3 +461,5 @@ A few steps to set up Microsoft Teams and get a message when a setting changes: ] } ``` + + diff --git a/website/docs/advanced/proxy/overview.mdx b/website/docs/advanced/proxy/overview.mdx index b6a5961df..90e4e658a 100644 --- a/website/docs/advanced/proxy/overview.mdx +++ b/website/docs/advanced/proxy/overview.mdx @@ -111,13 +111,15 @@ You can then check the [status endpoint](monitoring.mdx#status) of the Proxy to This section describes the possible ways of how you can use the Proxy from your application. You can decide where you want the actual feature flag evaluation to happen. -- **Local evaluation**: Feature flags are evaluated by a ConfigCat SDK running in your application. The Proxy only provides the data required for the evaluation process. -- **Remote evaluation**: Feature flags are evaluated within the Proxy, your application only gets the result of the evaluation process. + +**Local evaluation**: Feature flags are evaluated by a ConfigCat SDK running in your application. The Proxy only provides the data required for the evaluation process. + +**Remote evaluation**: Feature flags are evaluated within the Proxy, your application only gets the result of the evaluation process. -### Local evaluation using a ConfigCat SDK connected to the Proxy +### Local evaluation using a ConfigCat SDK connected to the Proxy {#1-local-evaluation-using-a-configcat-sdk-connected-to-the-proxy} The Proxy has the ability to forward all information required for feature flag evaluation to ConfigCat SDKs via its [CDN proxy](endpoints.mdx#cdn-proxy) endpoint. @@ -155,7 +157,7 @@ var configCatClient = configcat.getClient( -### Remote evaluation with the Proxy's API endpoints +### Remote evaluation with the Proxy's API endpoints {#2-remote-evaluation-with-the-proxys-api-endpoints} You can leverage the Proxy's server side feature flag evaluation feature by sending simple HTTP requests to the Proxy's API endpoints. @@ -226,17 +228,13 @@ You can find the available API endpoints with their HTTP request/response schema -### Remote evaluation with OpenFeature Remote Evaluation Protocol (OFREP) +### Remote evaluation with OpenFeature Remote Evaluation Protocol (OFREP) {#3-remote-evaluation-with-openfeature-remote-evaluation-protocol-ofrep} :::info OFREP compatibility is only available from Proxy version v2.0.0. ::: -:::info -The OFREP feature of the Proxy is turned OFF by default, to use it, you have to turn it ON with the [OFREP endpoint options](endpoints.mdx#available-options-2). -::: - The Proxy conforms to the OpenFeature Remote Evaluation Protocol, which means it can be used with OFREP compatible OpenFeature providers. ```js title="example.js (Initializing the OFREP JS Web provider to use the Proxy with SDK key)" @@ -280,7 +278,7 @@ You can find the available OFREP endpoints with their HTTP request/response sche -### Remote evaluation and streaming with SSE +### Remote evaluation and streaming with SSE {#4-remote-evaluation-and-streaming-with-sse} The Proxy has the ability to evaluate feature flags and send notifications about subsequent evaluated flag value changes through Server-Sent Events connections. @@ -332,7 +330,7 @@ For more information and usage examples, see the related [SSE endpoints document -### Remote evaluation and streaming with gRPC +### Remote evaluation and streaming with gRPC {#5-remote-evaluation-and-streaming-with-grpc} The Proxy supports both unary feature flag evaluation RPCs and server streaming of evaluated flag value changes. @@ -496,7 +494,11 @@ That is, the SDK identifier is effectively an alias for the associated SDK key a There are two ways to let the Proxy know which SDK Keys it should use: -### 1. Automatic configuration with Proxy profiles + + + +### Automatic configuration with Proxy profiles {#1-automatic-configuration-with-proxy-profiles} + :::info **Beta Feature**: Automatic configuration with Proxy profiles is in public beta. @@ -884,8 +886,11 @@ To connect a Proxy instance to a Proxy profile, follow these steps: :::info Offline Proxy instances only need the profile's `key` to read the connected profile from the cache, the `secret` option is not mandatory in this mode. ::: - -### 2. Manual configuration + + + +### Manual configuration {#2-manual-configuration} + When using environment variables, the SDK keys can be specified as a JSON object, where the **property name is the SDK identifier** (the identifier of the config-environment pair whose SDK Key the underlying SDK instance is configured to use) and the **property value is the actual SDK key**. The **SDK identifier** part is later used in [endpoint routes](endpoints.mdx) to recognize which SDK must serve the given flag evaluation request. @@ -1399,6 +1404,9 @@ CONFIGCAT_MY_SDK_OFFLINE_LOCAL_POLL_INTERVAL=5
OptionDefaultDescription
+ + + ## Default User Attributes There's an option to predefine [User Object](../../targeting/user-object.mdx) attributes with default values. Whenever the Proxy receives an evaluation request, it will automatically attach these predefined attributes to the request. If the evaluation request contains a different value for an attribute you previously defined, the request's value will take precedence. diff --git a/website/docs/advanced/team-management/team-management-basics.mdx b/website/docs/advanced/team-management/team-management-basics.mdx index 4faa75f87..f7b460d8d 100644 --- a/website/docs/advanced/team-management/team-management-basics.mdx +++ b/website/docs/advanced/team-management/team-management-basics.mdx @@ -4,16 +4,28 @@ title: Team Management Basics description: ConfigCat provides an unlimited number of team members for every subscription plan, even the free one. Here is how to manage your team. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + _Team members_ are your friends, colleagues, and clients who work on the same _Product_. You can invite as many of them to your _Product_ as you want. The following guide provides an overview of how to manage your team in ConfigCat. ## Invite others to collaborate -1. Click the `Invite Team Members` button on the sidebar. -1. Enter the invitees' email addresses (comma separated list). -1. Select a _Permission group_ and click on **SEND INVITATION EMAIL**. -1. An invitation will be sent to the invitees' email addresses. + + +Click the `Invite Team Members` button on the sidebar. + + +Enter the invitees' email addresses (comma separated list). + + +Select a _Permission group_ and click on **SEND INVITATION EMAIL**. + + +An invitation will be sent to the invitees' email addresses. + + You can modify their permission group later anytime. diff --git a/website/docs/advanced/troubleshooting.mdx b/website/docs/advanced/troubleshooting.mdx index 2e8c0f96b..334e94880 100644 --- a/website/docs/advanced/troubleshooting.mdx +++ b/website/docs/advanced/troubleshooting.mdx @@ -4,6 +4,8 @@ title: Troubleshooting description: This section helps you troubleshoot your issues. It's a good idea to double check these before contacting support. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + The following issues were reported by customers. We've collected what we've learned and provided the possible solutions below. ## Long response times and connection issues @@ -12,26 +14,48 @@ First, check the [Service Status Monitor](https://status.configcat.com) to see i ### General SDK Checklist -1. Make sure you're using the latest version of the ConfigCat SDK. -1. Check if you've configured the [Data Governance](../advanced/data-governance.mdx) functionality correctly. -1. Singleton: We strongly recommend using the ConfigCat SDK as a Singleton object. Initializing the SDK multiple times can cause serious performance issues in production. If you need to use multiple SDK Keys in the same application, create only one _ConfigCat Client_ per SDK Key. -1. Are you using the proper polling mode for your use case? Details on polling modes in the [SDK + + +Make sure you're using the latest version of the ConfigCat SDK. + + +Check if you've configured the [Data Governance](../advanced/data-governance.mdx) functionality correctly. + + +Singleton: We strongly recommend using the ConfigCat SDK as a Singleton object. Initializing the SDK multiple times can cause serious performance issues in production. If you need to use multiple SDK Keys in the same application, create only one _ConfigCat Client_ per SDK Key. + + +Are you using the proper polling mode for your use case? Details on polling modes in the [SDK Docs](../sdk-reference/overview.mdx). -1. Are you using the right polling interval for `Auto Polling`? Too frequent polling will increase your network traffic. Please check the [SDK Docs](../sdk-reference/overview.mdx). -1. In `Manual Polling` mode, are you calling `forceRefresh()` in your code as frequently as needed? Excessive refreshes will increase your network traffic. -1. You can try one of our lightweight sample applications to rule out local issues. Find in the [repository of each SDK](https://github.com/configcat). + + +Are you using the right polling interval for `Auto Polling`? Too frequent polling will increase your network traffic. Please check the [SDK Docs](../sdk-reference/overview.mdx). + + +In `Manual Polling` mode, are you calling `forceRefresh()` in your code as frequently as needed? Excessive refreshes will increase your network traffic. + + +You can try one of our lightweight sample applications to rule out local issues. Find in the [repository of each SDK](https://github.com/configcat). + + ### Network Checklist :::caution -Please, **do not load test** the ConfigCat production infrastructure without our consent. +**Do not load test** the ConfigCat production infrastructure without our consent. ::: -1. You can check response times manually by navigating to `https://cdn.configcat.com/ping.txt` and opening your browser's network tab. -1. Does the machine/server running your code have access to the above address? -1. You might need to whitelist the following addresses in your firewall: `cdn.configcat.com`, `cdn-eu.configcat.com`, `cdn-global.configcat.com`. - ---- + + +You can check response times manually by navigating to `https://cdn.configcat.com/ping.txt` and opening your browser's network tab. + + +Does the machine/server running your code have access to the above address? + + +You might need to whitelist the following addresses in your firewall: `cdn.configcat.com`, `cdn-eu.configcat.com`, `cdn-global.configcat.com`. + + ## Too many requests error in Angular diff --git a/website/docs/faq.mdx b/website/docs/faq.mdx index 18ddebe02..b7b3b7c9c 100644 --- a/website/docs/faq.mdx +++ b/website/docs/faq.mdx @@ -6,6 +6,8 @@ description: This is a collection of frequently asked questions and the most typ export const FaqSchema = require('@site/src/schema-markup/faq.json'); +import { Steps, Step, Title } from '@site/src/components/Steps'; + A collection of frequently asked questions. @@ -45,9 +47,17 @@ Discounts are available through our partnership program. [Contact us](https://co Currently, there's no direct way to change the email address of an account. However, you can: -1. Invite the new email to join your ConfigCat organization; this will create a fresh ConfigCat account. -2. Grant all the necessary permissions to the new account. -3. Proceed with deleting your old account from [here](https://app.configcat.com/my-account). + + +Invite the new email to join your ConfigCat organization; this will create a fresh ConfigCat account. + + +Grant all the necessary permissions to the new account. + + +Proceed with deleting your old account from [here](https://app.configcat.com/my-account). + + If you don't have the required permissions, contact your organization admin or a team member who has "Team members and permission groups" permissions. diff --git a/website/docs/getting-started.mdx b/website/docs/getting-started.mdx index ea69aa1e3..b4f91d91f 100644 --- a/website/docs/getting-started.mdx +++ b/website/docs/getting-started.mdx @@ -4,6 +4,8 @@ title: Getting Started description: This is a step-by-step guide on how to get started with ConfigCat feature flags and on how to implement feature flags in an application. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + This page is an overview and a short guide on how to get started. **ConfigCat** is a cloud-based service that lets you release features without code deployments. @@ -18,10 +20,16 @@ then you can **connect your application** to the ConfigCat service to access you ### Create a feature flag on the _ConfigCat Dashboard_ -1. Log in to the _Dashboard_ -2. Click _ADD FEATURE FLAG_ and give it a name. + + +Log in to the _Dashboard_ + + +Click _ADD FEATURE FLAG_ and give it a name. Add feature flag + + ### Explore with Our Tutorial App diff --git a/website/docs/integrations/amplitude.mdx b/website/docs/integrations/amplitude.mdx index 769c7eb72..6d7da0eb6 100644 --- a/website/docs/integrations/amplitude.mdx +++ b/website/docs/integrations/amplitude.mdx @@ -269,14 +269,19 @@ Ensures that feature flag evaluations are logged into While our documentation primarily provides code examples for languages that Amplitude natively supports and has an official SDK, you can integrate with other languages by sending an event to Amplitude with a third-party SDK or with using the Amplitude's Upload request API. - - 1. **Subscribe to the FlagEvaluated hook** in the ConfigCat SDK. - 2. **Send an event to Amplitude** using the `$exposure` event name. Include the following event properties: + + + **Subscribe to the FlagEvaluated hook** in the ConfigCat SDK. + + + **Send an event to Amplitude** using the `$exposure` event name. Include the following event properties: - `flag_key`: the feature flag's key from the FlagEvaluated hook's EvaluationDetails - `variant`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails - `variation_id`: the evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails - `user_id` (optional): in case you are using the tracking in a backend component or you don't identify all your event sendings to Amplitude with user details, you have to send the `user_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. + + @@ -288,7 +293,11 @@ The `variationId` is a hashed version of the feature flag value, accessible on t For more information about Variation IDs, see [Variation ID for analytics](/advanced/variation-id-for-analytics). ::: -4. Deploy your application and wait for feature flag evaluations to happen so Experiments in Amplitude could be populated. + + +Deploy your application and wait for feature flag evaluations to happen so Experiments in Amplitude could be populated. + + ### Usage with Experiments Check your Experiments page in Amplitude and select your feature flag as the Experiment. diff --git a/website/docs/integrations/datadog.mdx b/website/docs/integrations/datadog.mdx index a81f40fa7..a2262189f 100644 --- a/website/docs/integrations/datadog.mdx +++ b/website/docs/integrations/datadog.mdx @@ -4,6 +4,8 @@ title: Datadog - Monitor your feature flags events description: ConfigCat Datadog integration. This is a step-by-step guide on how to connect the ConfigCat feature flag service events to Datadog. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + ## Overview Monitor feature flag events in real-time. Feature flag changes will appear as events in Datadog, tagged with relevant product, config, and environment details. @@ -12,23 +14,47 @@ Monitor feature flag events in real-time. Feature flag changes will appear as ev ## Installation -1. Have a Datadog subscription. -2. Get a Datadog API Key. + + +Have a Datadog subscription. + + +Get a Datadog API Key. Datadog API Key - -3. Open the integrations tab on ConfigCat Dashboard. -4. Click on Datadog's **Connect** button and set your Datadog API key. -5. OPTIONAL - Set the proper site of your Datadog account. [More about Datadog site](https://docs.datadoghq.com/getting_started/site/). -6. You're all set. Go ahead and make some changes on your feature flags, then check your Events in Datadog. + + +Open the integrations tab on ConfigCat Dashboard. + + +Click on Datadog's **Connect** button and set your Datadog API key. + + +OPTIONAL - Set the proper site of your Datadog account. [More about Datadog site](https://docs.datadoghq.com/getting_started/site/). + + +You're all set. Go ahead and make some changes on your feature flags, then check your Events in Datadog. + + ## Un-installation - -1. Open the integrations tab on ConfigCat Dashboard. -2. Click on Datadog's **Connected** button. -3. Select the connection from the **Connected** dropdown. -4. Click the **Disconnect** button in the edit dialog. -5. Click **Yes** in the confirmation dialog. + + +Open the integrations tab on ConfigCat Dashboard. + + +Click on Datadog's **Connected** button. + + +Select the connection from the **Connected** dropdown. + + +Click the **Disconnect** button in the edit dialog. + + +Click **Yes** in the confirmation dialog. + + ## Event details diff --git a/website/docs/integrations/google-analytics.mdx b/website/docs/integrations/google-analytics.mdx index 56562ded5..4f0a5610d 100644 --- a/website/docs/integrations/google-analytics.mdx +++ b/website/docs/integrations/google-analytics.mdx @@ -7,18 +7,24 @@ description: ConfigCat Google Analytics integration. This is a step-by-step guid import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import CodeBlock from '@theme/CodeBlock'; +import { Steps, Step, Title } from '@site/src/components/Steps'; ## Sending Feature Flag Evaluation Analytics to Google Analytics Integrate your feature flag evaluations with [Google Analytics experiments](https://developers.google.com/analytics/devguides/collection/ga4/integration) to gain advanced insights into how your features are used and to assess the outcomes of A/B tests. ### Setup Instructions - -1. **Install SDKs:** Add both the ConfigCat SDK and the Google Analytics SDK to your application. -2. **Configure SDKs:** + + +**Install SDKs:** Add both the ConfigCat SDK and the Google Analytics SDK to your application. + + +**Configure SDKs:** - **ConfigCat SDK:** Initialize with your ConfigCat SDK key. - **Google Analytics SDK:** Set up with your Google Analytics measurement ID. -3. **Integrate Feature Flag Evaluations:** + + +**Integrate Feature Flag Evaluations:** - During the initialization of the ConfigCat SDK, subscribe to the `flagEvaluated` hook. - Send feature flag evaluation data to Google Analytics using the `experience_impression` event name. Include the following parameter: - `exp_variant_string`: Construct this string to include the tool name (`configcat`), the feature flag's key, and its value. For example: `configcat-isMyAwesomeFeatureEnabled-true`. @@ -65,12 +71,17 @@ const configCatClient = configcat.getClient("#YOUR_SDK_KEY", PollingMode.AutoPol While our documentation primarily provides code examples for JavaScript-based SDKs, you can integrate with other languages by utilizing the Send Measurement Protocol events to Google Analytics endpoint. Here's how to set it up: -1. **Subscribe to the FlagEvaluated hook** in the ConfigCat SDK. -2. **Send an event to Google Analytics** using the `experience_impression` event name. Include the following event properties: + + +**Subscribe to the FlagEvaluated hook** in the ConfigCat SDK. + + +**Send an event to Google Analytics** using the `experience_impression` event name. Include the following event properties: - `exp_variant_string`: Format this string as `configcat--`. For example, `configcat-isMyAwesomeFeatureEnabled-true`. - `variant_id`: The evaluated feature flag's value or the variationId from the FlagEvaluated hook's EvaluationDetails. - `user_id` (optional): If tracking in a backend component and utilizing the user_id feature in Google Analytics, include this property to identify your user. Use the Identifier property from the User object in the FlagEvaluated hook, or another value that best describes your user. - + + @@ -79,10 +90,14 @@ For Text feature flags with lengthy values (e.g., JSON), send the `variationId` For more information about Variation IDs, see [Variation ID for analytics](/advanced/variation-id-for-analytics). ::: - -4. **Deploy your application** and wait for feature flag evaluations to occur. This process might take 1-2 days for the `experience_impression` events to populate in Google Analytics. - -5. **Define an audience** in Google Analytics using the `exp_variant_string` parameter with the same values you used in your events (e.g. `configcat-isMyAwesomeFeatureEnabled-true`) by following the guide [here](https://support.google.com/analytics/answer/9267572). This allows you to leverage feature flag evaluation events effectively. + + +**Deploy your application** and wait for feature flag evaluations to occur. This process might take 1-2 days for the `experience_impression` events to populate in Google Analytics. + + +**Define an audience** in Google Analytics using the `exp_variant_string` parameter with the same values you used in your events (e.g. `configcat-isMyAwesomeFeatureEnabled-true`) by following the guide [here](https://support.google.com/analytics/answer/9267572). This allows you to leverage feature flag evaluation events effectively. + + ### Example audiences reports diff --git a/website/docs/integrations/intellij.mdx b/website/docs/integrations/intellij.mdx index cb21695f1..2477d7721 100644 --- a/website/docs/integrations/intellij.mdx +++ b/website/docs/integrations/intellij.mdx @@ -4,6 +4,8 @@ title: JetBrains/IntelliJ Plugin - Manage your feature flags from JetBrains/Inte description: ConfigCat IntelliJ IDE Plugin. This is a step-by-step guide on how to use the ConfigCat JetBrains/IntelliJ Plugin to manage feature flags in your IDEs. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + ConfigCat's JetBrains/IntelliJ IDE plugin to manage feature flags from IDEs. Connect your ConfigCat Product and Config to your JetBrains/IntelliJ IDE. Find your Feature Flag's usages in your code easily. @@ -30,19 +32,43 @@ This guide will help you install the JetBrains/IntelliJ IDE Plugin and familiari ### Install within the IDE from Marketplace -1. In your IDE, open the **File** > **Settings/Preferences** menu. -1. Go to the **Plugin** page and select the **Marketplace** tab. -1. Search for **ConfigCat Feature Flags**. -1. **Install** the plugin. -1. Configure the plugin ([see below](#configure-extension)). + + +In your IDE, open the **File** > **Settings/Preferences** menu. + + +Go to the **Plugin** page and select the **Marketplace** tab. + + +Search for **ConfigCat Feature Flags**. + + +**Install** the plugin. + + +Configure the plugin ([see below](#configure-extension)). + + ### Install manually within the IDE -1. Download the latest release from [GitHub](https://github.com/configcat/intellij-plugin/releases/latest) or from [JetBrains Marketplace](https://plugins.jetbrains.com/plugin/26096-configcat-feature-flags). -1. In your IDE, open the **File** > **Settings/Preferences** menu. -1. Go to the **Plugin** page and open the **Gear Icon** menu. -1. Select the **Install plugin from disk...** option. -1. Configure the plugin ([see below](#configure-extension)). + + +Download the latest release from [GitHub](https://github.com/configcat/intellij-plugin/releases/latest) or from [JetBrains Marketplace](https://plugins.jetbrains.com/plugin/26096-configcat-feature-flags). + + +In your IDE, open the **File** > **Settings/Preferences** menu. + + +Go to the **Plugin** page and open the **Gear Icon** menu. + + +Select the **Install plugin from disk...** option. + + +Configure the plugin ([see below](#configure-extension)). + + ### Compatible IDEs The plugin is compatible with the following IDEs. Check the plugin [JetBrains Marketplace](https://plugins.jetbrains.com/plugin/26096-configcat-feature-flags) page for the full, detailed compatibility list. @@ -67,26 +93,45 @@ The plugin is compatible with the following IDEs. Check the plugin [JetBrains Ma ### Authentication -1. Get your API credentials for [ConfigCat Public Management API](https://app.configcat.com/my-account/public-api-credentials). -1. In your IDE, open the **File** > **Settings/Preferences** menu. -1. Search for **ConfigCat Feature Flags** page. -1. Fill out the **Basic auth user name** and **Basic auth password** inputs. + + +Get your API credentials for [ConfigCat Public Management API](https://app.configcat.com/my-account/public-api-credentials). + + +In your IDE, open the **File** > **Settings/Preferences** menu. + + +Search for **ConfigCat Feature Flags** page. + + +Fill out the **Basic auth user name** and **Basic auth password** inputs. + + + ### Advanced This section is for you if you use a dedicated hosted/[on-premise](https://configcat.com/on-premise/) ConfigCat instance. In that case, you can specify your custom ConfigCat URLs in the IDE. -1. In your IDE, open the **File** > **Settings/Preferences** menu. -1. Search for **ConfigCat Feature Flags** page. -1. Fill out the **Public Api Base URL** and **Dashboard Base URL** inputs. + + +In your IDE, open the **File** > **Settings/Preferences** menu. + + +Search for **ConfigCat Feature Flags** page. + + +Fill out the **Public Api Base URL** and **Dashboard Base URL** inputs. - `Public Api Base URL`: the base URL for the ConfigCat Public Management API. Defaults to: https://api.configcat.com. - `Dashboard Base URL`: the base URL for ConfigCat Dashboard. Defaults to: https://app.configcat.com. + + ## Usage of ConfigCat Feature Flags Plugin @@ -108,47 +153,96 @@ After you successfully configured your ConfigCat account in the **Settings**, yo #### Create a new Feature Flag - -1. Select the Config in the tree where you want to create your new flag. -1. Click the **+** button on the action bar to open the **Create Flag** dialog. -1. Select the setting type. -1. Enter the new Feature Flag name. -1. Enter the new Feature Flag key. -1. Add a hint to your Feature Flag (optional). -1. Select **OK** to confirm the Flag creation. + + +Select the Config in the tree where you want to create your new flag. + + +Click the **+** button on the action bar to open the **Create Flag** dialog. + + +Select the setting type. + + +Enter the new Feature Flag name. + + +Enter the new Feature Flag key. + + +Add a hint to your Feature Flag (optional). + + +Select **OK** to confirm the Flag creation. + + #### Copy a Feature Flag's key to the clipboard - -1. Select the Feature Flag in the tree whose key you want to copy. -1. Click the **Copy** button on the action bar to copy the key to the clipboard. + + +Select the Feature Flag in the tree whose key you want to copy. + + +Click the **Copy** button on the action bar to copy the key to the clipboard. + + #### Open your Feature Flags on the ConfigCat Dashboard - -1. In the tree, select the Feature Flag you want to open in the Dashboard. -1. Click the **Open Config in ConfigCat Dashboard** button on the action bar to open the Feature Flag in the Dashboard. + + +In the tree, select the Feature Flag you want to open in the Dashboard. + + +Click the **Open Config in ConfigCat Dashboard** button on the action bar to open the Feature Flag in the Dashboard. + + #### Find your Feature Flag's usages in your code - -1. Select the Feature Flag in the tree you want to search. -1. Click the **Find Usage** button on the action bar. -1. See the search results in the opened dialog. + + +Select the Feature Flag in the tree you want to search. + + +Click the **Find Usage** button on the action bar. + + +See the search results in the opened dialog. + + #### Create a new Config under a product - -1. Select the Products in the tree where you want to create your new config. -1. Click the **+** button on the action bar to open the **Create Config** dialog. -1. Enter a name for the new config. -1. Add a hint to your config (optional). -1. Select **OK** to confirm the Config creation. + + +Select the Products in the tree where you want to create your new config. + + +Click the **+** button on the action bar to open the **Create Config** dialog. + + +Enter a name for the new config. + + +Add a hint to your config (optional). + + +Select **OK** to confirm the Config creation. + + #### Open your Configs on the ConfigCat Dashboard -1. Select the Config which you want to open in the Dashboard. -1. Click the **Open Config in ConfigCat Dashboard** button on the action bar to open the Config in the Dashboard. + + +Select the Config which you want to open in the Dashboard. + + +Click the **Open Config in ConfigCat Dashboard** button on the action bar to open the Config in the Dashboard. :::info The actions are available by right click menu as well. ::: + + ### Help & Feedback Tab diff --git a/website/docs/integrations/jira.mdx b/website/docs/integrations/jira.mdx index 905a81b3d..46f4c805d 100644 --- a/website/docs/integrations/jira.mdx +++ b/website/docs/integrations/jira.mdx @@ -4,6 +4,8 @@ title: Jira Cloud Plugin - Manage feature flags from Jira description: ConfigCat Jira Cloud Plugin. This is a step-by-step guide on how to connect and manage feature flags from Jira Cloud boards. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + The ConfigCat Feature Flags Jira Cloud Plugin allows you to connect your Jira Issues and feature flags. Create or link existing flags to your Jira issues without leaving your Jira instance. Turn features On/Off right from a linked Issue on your Jira board. You can also easily modify the linked flags to edit or add new Targeting or Percentage Rules. @@ -16,10 +18,18 @@ This integration is for Jira Cloud. It does not work on Jira Data Center or Jira ## Installation -1. Add ConfigCat Feature Flags to your Jira Cloud instance. -2. Select **Configure**. -3. Copy your ConfigCat Public API credentials to the inputs. Read more about ConfigCat Public API credentials here. -4. Click **Authorize**. + + +Add ConfigCat Feature Flags to your Jira Cloud instance. + + +Select **Configure**. + + +Copy your ConfigCat Public API credentials to the inputs. Read more about ConfigCat Public API credentials here. + + +Click **Authorize**. :::info Every Jira user must authorize ConfigCat in Jira who wants to use the ConfigCat Feature Flags Plugin. @@ -29,77 +39,138 @@ Every Jira user must authorize ConfigCat in Jira who wants to use the ConfigCat Your browser does not support the video tag. + + ## Usage ### Linking existing feature flags -1. Navigate to any Issue on your Jira board. -2. Open the **ConfigCat Feature Flag** issue context. -3. On the **Link existing** tab, select a ConfigCat Product, Config, Environment, and Feature Flag to be linked to your Issue. -4. When linked, you can manage the selected feature flag from this Issue. + + +Navigate to any Issue on your Jira board. + + +Open the **ConfigCat Feature Flag** issue context. + + +On the **Link existing** tab, select a ConfigCat Product, Config, Environment, and Feature Flag to be linked to your Issue. + + +When linked, you can manage the selected feature flag from this Issue. + + + ### Creating new feature flags -1. Navigate to any Issue on your Jira board. -2. Open the **ConfigCat Feature Flag** issue context. -3. On the **Create and Link** tab, select a ConfigCat Product and Config where you want to create the feature flag. -4. Set up your feature flag. -5. Select which environment you would like to link to this item. -6. When linked, you can manage the selected feature flag from this Issue. + + +Navigate to any Issue on your Jira board. + + +Open the **ConfigCat Feature Flag** issue context. + + +On the **Create and Link** tab, select a ConfigCat Product and Config where you want to create the feature flag. + + +Set up your feature flag. + + +Select which environment you would like to link to this item. + + +When linked, you can manage the selected feature flag from this Issue. + + ### View and Edit linked feature flags -1. Open an Issue on your Jira board with a linked feature flag. -2. See the linked feature flags in the **Feature Flag (ConfigCat)** issue section. -3. You can manage the selected feature flag from this Issue. -4. You can add new Targeting Rules or Percentage Options to Feature Flags. -5. You can add new Targeting Rules with User, Segment or Prerequisite Conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) -6. You can remove Targeting Rules as well. + + +Open an Issue on your Jira board with a linked feature flag. + + +See the linked feature flags in the **Feature Flag (ConfigCat)** issue section. + + +You can manage the selected feature flag from this Issue. + + +You can add new Targeting Rules or Percentage Options to Feature Flags. + + +You can add new Targeting Rules with User, Segment or Prerequisite Conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) + + +You can remove Targeting Rules as well. + + ### Remove linked feature flags -1. Open an Issue on your Jira board with a linked feature flag. -2. Remove the linked feature flag by opening the **More menu** and selecting the **Remove from Issue** option. + + +Open an Issue on your Jira board with a linked feature flag. + + +Remove the linked feature flag by opening the **More menu** and selecting the **Remove from Issue** option. + + ### View flag status in Releases -1. Open an Issue on your Jira board with a linked feature flag. -2. Check the **Releases** field values in the issue **Details** section to see the linked feature flags status in the Issue. -3. Click it for a more detailed dialog. + + +Open an Issue on your Jira board with a linked feature flag. + + +Check the **Releases** field values in the issue **Details** section to see the linked feature flags status in the Issue. + + +Click it for a more detailed dialog. + + -1. Open a version in the Jira project's Release Hub page to see the related issues feature flag status. -2. Click it for a more detailed dialog. + + +Open a version in the Jira project's Release Hub page to see the related issues feature flag status. + + +Click it for a more detailed dialog. + + :::info This plugin doesn't implement the **Releases - Create/Connect feature flag** action. Instead, you can create or link @@ -108,7 +179,7 @@ feature flags from the ConfigCat Feature Flags section below the Details section ### View linked issues in ConfigCat -1. View linked issues next to your Feature Flags in ConfigCat and jump to the Jira Issue directly. +View linked issues next to your Feature Flags in ConfigCat and jump to the Jira Issue directly. + + + ## Usage ### Linking existing feature flags -1. Open any Item on your monday.com board. -2. Push the **Link existing feature flag** button. -3. Select a Product, Config, Environment, and Feature Flag to be linked to your monday.com Item. -4. When linked, you can manage the selected feature flag from this monday.com Item. + + +Open any Item on your monday.com board. + + +Push the **Link existing feature flag** button. + + +Select a Product, Config, Environment, and Feature Flag to be linked to your monday.com Item. + + +When linked, you can manage the selected feature flag from this monday.com Item. + + + ### Creating new feature flags -1. Open any Item on your monday.com board. -2. Push the **Create and link feature flag** button. -3. Select a Product and Config where you want to create the feature flag. -4. Set up your feature flag. -5. Select which environment you would like to link to this Item. -6. When linked, you can manage the selected feature flag from this monday.com Item. + + +Open any Item on your monday.com board. + + +Push the **Create and link feature flag** button. + + +Select a Product and Config where you want to create the feature flag. + + +Set up your feature flag. + + +Select which environment you would like to link to this Item. + + +When linked, you can manage the selected feature flag from this monday.com Item. + + ### View and Edit linked feature flags -1. Open any Item on your monday.com board. -2. See the linked feature flags in the **Feature Flag (ConfigCat)** view. -3. You can manage the selected feature flag from this Item. -4. You can add new Targeting Rules or Percentage Options to Feature Flags. -5. You can add new Targeting Rules with User, Segment or Prerequisite conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) -6. You can remove Targeting Rules as well. + + +Open any Item on your monday.com board. + + +See the linked feature flags in the **Feature Flag (ConfigCat)** view. + + +You can manage the selected feature flag from this Item. + + +You can add new Targeting Rules or Percentage Options to Feature Flags. + + +You can add new Targeting Rules with User, Segment or Prerequisite conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) + + +You can remove Targeting Rules as well. + + ### Remove linked feature flags -1. Open any Item on your monday.com board with a linked feature flag. -2. Remove the linked feature flag by opening the **More menu** and selecting the **Unlink** option. + + +Open any Item on your monday.com board with a linked feature flag. + + +Remove the linked feature flag by opening the **More menu** and selecting the **Unlink** option. + + ### View linked Items in ConfigCat -1. View the linked Item next to your Feature Flags in ConfigCat and jump to the monday.com Item directly. +View the linked Item next to your Feature Flags in ConfigCat and jump to the monday.com Item directly. + + + ## Usage ### Linking existing feature flags -1. Open any Card on your Trello board. -2. Push the **Link Feature Flag** button. -3. Select a ConfigCat Product, Config, Environment, and Feature Flag to be linked to your Card. -4. When linked, you can manage the selected feature flag from this Card. + + +Open any Card on your Trello board. + + +Push the **Link Feature Flag** button. + + +Select a ConfigCat Product, Config, Environment, and Feature Flag to be linked to your Card. + + +When linked, you can manage the selected feature flag from this Card. + + ### Creating new feature flags -1. Open any Card on your Trello board. -2. Push the **Create and Link Feature Flag** button. -3. Select a ConfigCat Product and Config where you want to create the feature flag. -4. Set up your feature flag. -5. Select which environment you would like to link to this item. -6. When linked, you can manage the selected feature flag from this Card. + + +Open any Card on your Trello board. + + +Push the **Create and Link Feature Flag** button. + + +Select a ConfigCat Product and Config where you want to create the feature flag. + + +Set up your feature flag. + + +Select which environment you would like to link to this item. + + +When linked, you can manage the selected feature flag from this Card. + + ### View and Edit linked feature flags -1. Open a Card on your Trello board with a linked feature flag. -2. See the linked feature flags in the **Feature Flag (ConfigCat)** section. -3. You can manage the selected feature flag from this Card. -4. Add new Percentage Options to Feature Flags or Targeting Rules. -5. You can add new Targeting Rules with User, Segment or Prerequisite conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) -6. You can remove Targeting Rules as well. + + +Open a Card on your Trello board with a linked feature flag. + + +See the linked feature flags in the **Feature Flag (ConfigCat)** section. + + +You can manage the selected feature flag from this Card. + + +Add new Percentage Options to Feature Flags or Targeting Rules. + + +You can add new Targeting Rules with User, Segment or Prerequisite conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) + + +You can remove Targeting Rules as well. + + ### Remove linked feature flags -1. Open a Card on your Trello board with a linked feature flag. -2. In the **ConfigCat** section, click the **⋮** ("More" menu) in the top right corner of the feature flag panel. -3. Remove the linked feature flag by selecting the **Remove from card** option. + + +Open a Card on your Trello board with a linked feature flag. + + +In the **ConfigCat** section, click the **⋮** ("More" menu) in the top right corner of the feature flag panel. + + +Remove the linked feature flag by selecting the **Remove from card** option. + + ### View linked Cards in ConfigCat -1. In ConfigCat, find your feature flag. -2. Locate the **Connected tickets** section in the top right corner of the feature flag panel. -3. Jump to the Trello cards directly by clicking the links in the **Connected tickets** section. + + +In ConfigCat, find your feature flag. + + +Locate the **Connected tickets** section in the top right corner of the feature flag panel. + + +Jump to the Trello cards directly by clicking the links in the **Connected tickets** section. + + diff --git a/website/docs/integrations/vscode.mdx b/website/docs/integrations/vscode.mdx index 967877a56..bb6471391 100644 --- a/website/docs/integrations/vscode.mdx +++ b/website/docs/integrations/vscode.mdx @@ -4,6 +4,8 @@ title: Visual Studio Code - Manage your feature flags from VSCode description: ConfigCat Visual Studio Code extension. This is a step-by-step guide on how to use the ConfigCat Visual Studio Code extension to manage feature flags in your project. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + ConfigCat's Visual Studio Code extension to manage feature flags from Visual Studio Code. Connect your ConfigCat Product and Config to your Visual Studio Code Workspace. Find your Feature Flag's usages in your code easily. @@ -31,23 +33,41 @@ This guide will help you with the Visual Studio Code Extensions installation and ## Install extension ### Install from Visual Studio Code Marketplace - -1. In the Visual Studio Marketplace, open the [ConfigCat Feature Flags Extension](https://marketplace.visualstudio.com/items?itemName=ConfigCat.configcat-feature-flags). -1. Click on the **Install** button. -1. [Configure extension](#configure-extension). + + +In the Visual Studio Marketplace, open the [ConfigCat Feature Flags Extension](https://marketplace.visualstudio.com/items?itemName=ConfigCat.configcat-feature-flags). + + +Click on the **Install** button. + + +[Configure extension](#configure-extension). + + ### Install within Visual Studio Code - -1. In Visual Studio Code, open the Extensions page, and search for ConfigCat Feature Flags. -1. Click on the **Install** button. -1. [Configure extension](#configure-extension). + + +In Visual Studio Code, open the Extensions page, and search for ConfigCat Feature Flags. + + +Click on the **Install** button. + + +[Configure extension](#configure-extension). + + ## Configure extension ### Authentication -1. Get your API credentials for [ConfigCat Public Management API](https://app.configcat.com/my-account/public-api-credentials). -1. Authenticate ConfigCat in Visual Studio Code by + + +Get your API credentials for [ConfigCat Public Management API](https://app.configcat.com/my-account/public-api-credentials). + + +Authenticate ConfigCat in Visual Studio Code by - clicking on the ConfigCat Feature Flags icon on the Activity Bar and clicking on any of the **Authenticate** buttons. - or running the **ConfigCat - Log In** command from the Command Palette. @@ -55,6 +75,8 @@ This guide will help you with the Visual Studio Code Extensions installation and Your browser does not support the video tag. + + ### Advanced @@ -84,34 +106,79 @@ After you successfully connect your ConfigCat Config to your Visual Studio Code #### View or Update your Feature Flag's value -1. Open the **Feature Flags & Settings** view. -1. Find the Flag and click the **View or Update Feature Flag values** icon next to the Flag name. -1. Select the Environment. -1. See the Feature Flag in the opened tab. -1. You can turn your features On / Off right from the opened tab. -1. You can add new Targeting Rules with User, Segment or Prerequisite conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) -1. You can add new Percentage Options to Feature Flags or Targeting Rules + + +Open the **Feature Flags & Settings** view. + + +Find the Flag and click the **View or Update Feature Flag values** icon next to the Flag name. + + +Select the Environment. + + +See the Feature Flag in the opened tab. + + +You can turn your features On / Off right from the opened tab. + + +You can add new Targeting Rules with User, Segment or Prerequisite conditions with a large selection of Comparators. [Read more about Targeting.](../targeting/targeting-overview.mdx) + + +You can add new Percentage Options to Feature Flags or Targeting Rules + + #### Create a new Feature Flag -1. Open the **Feature Flags & Settings** view. -1. Click the **+** in the view header. -1. Select the Setting type. -1. Enter the new Feature Flag name. -1. Enter the new Feature Flag key. -1. Add a hint to your Feature Flag (optional). -1. Select **Yes** to confirm the Flag creation. + + +Open the **Feature Flags & Settings** view. + + +Click the **+** in the view header. + + +Select the Setting type. + + +Enter the new Feature Flag name. + + +Enter the new Feature Flag key. + + +Add a hint to your Feature Flag (optional). + + +Select **Yes** to confirm the Flag creation. + + #### Copy a Feature Flag's key to the clipboard -1. Open the **Feature Flags & Settings** View. -1. Find the Flag and click the **Copy Key to clipboard** icon next to the Flag name. + + +Open the **Feature Flags & Settings** View. + + +Find the Flag and click the **Copy Key to clipboard** icon next to the Flag name. + + #### Find your Feature Flag's usages in your code - -1. Open the **Feature Flags & Settings** view. -1. Find the Flag and click the **Find usage** icon next to the Flag name. -1. See the search results in the opened tab. + + +Open the **Feature Flags & Settings** view. + + +Find the Flag and click the **Find usage** icon next to the Flag name. + + +See the search results in the opened tab. + + ### Products & Configs View @@ -129,23 +196,53 @@ Manage your products and configs on the **Products & Configs** view by performin #### Create a new Config under a product -1. Open the **Products & Configs** view. -1. In the products list, click the **+** icon next to the product where you want to create the new config. -1. Enter a name for the new Config. -1. Add a description to your Config (optional). -1. Connect the new config to your current Workspace (optional). + + +Open the **Products & Configs** view. + + +In the products list, click the **+** icon next to the product where you want to create the new config. + + +Enter a name for the new Config. + + +Add a description to your Config (optional). + + +Connect the new config to your current Workspace (optional). + + #### Connect a Config to your current Workspace -1. Open the **Products & Configs** view. -1. Find the Config you want to connect to your current Workspace under your product list. -1. Click the **Connector** icon next to the Config in the list. -1. You can see the Config's Feature Flags in the **Feature Flags & Setting** view. + + +Open the **Products & Configs** view. + + +Find the Config you want to connect to your current Workspace under your product list. + + +Click the **Connector** icon next to the Config in the list. + + +You can see the Config's Feature Flags in the **Feature Flags & Setting** view. + + #### Open your Configs on the ConfigCat Dashboard -1. Open the **Products & Configs** view. -1. Find the Config you want to connect to your current Workspace under your product list. -1. Click the **Open Config in ConfigCat Dashboard** icon next to the Config in the list. + + +Open the **Products & Configs** view. + + +Find the Config you want to connect to your current Workspace under your product list. + + +Click the **Open Config in ConfigCat Dashboard** icon next to the Config in the list. + + ### Help & Feedback View diff --git a/website/docs/integrations/zapier.mdx b/website/docs/integrations/zapier.mdx index 1fa50137b..c1321521b 100644 --- a/website/docs/integrations/zapier.mdx +++ b/website/docs/integrations/zapier.mdx @@ -4,6 +4,8 @@ title: Zapier Zap - Build feature flag workflows description: ConfigCat Zapier integration. This is a step-by-step guide on how to use the ConfigCat Zapier integration to connect manage features from thousands of Zapier apps. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + ## Connect ConfigCat to hundreds of other apps with Zapier ConfigCat's Zap lets you connect ConfigCat to 8,000+ other web services. Automated connections called Zaps, set up in minutes with no coding, can automate your day-to-day tasks and build workflows between apps that otherwise wouldn't be possible. @@ -14,26 +16,49 @@ Each Zap has one app as the **Trigger**, where your information comes from and w ## Setup ### Connect ConfigCat -1. Log in to your Zapier account or create a new account. -2. Navigate to **App Connections** from the side menu. -3. Click the **Add connection** button and search for **ConfigCat** in the **Add new connection** dialog. -4. Click the **Add connection** button to connect ConfigCat. -5. Get your API credentials for ConfigCat Public Management API. -6. Use the generated **Basic auth user name** and **Basic auth password** to connect your ConfigCat account to Zapier. - + + +Log in to your Zapier account or create a new account. + + +Navigate to **App Connections** from the side menu. + + +Click the **Add connection** button and search for **ConfigCat** in the **Add new connection** dialog. + + +Click the **Add connection** button to connect ConfigCat. + + +Get your API credentials for ConfigCat Public Management API. + + +Use the generated **Basic auth user name** and **Basic auth password** to connect your ConfigCat account to Zapier. zapier_auth + + ## Usage Once ConfigCat is connected, you can start creating an automation! Use a pre-made Zap or create your own with the Zap Editor. Creating a Zap requires no coding knowledge and you'll be walked step-by-step through the setup. Need inspiration? See everything that's possible with ConfigCat and Zapier. ### Setup ConfigCat Trigger -1. Create a new Trigger. -1. Select **ConfigCat** app, **Feature Flag & Setting value changed** as Trigger event and the connected account. -1. Select the Product for which you want to receive notifications about Feature Flag or Setting changes. -1. For more specific notifications, select a Config and/or Environment. - + + +Create a new Trigger. + + +Select **ConfigCat** app, **Feature Flag & Setting value changed** as Trigger event and the connected account. + + +Select the Product for which you want to receive notifications about Feature Flag or Setting changes. + + +For more specific notifications, select a Config and/or Environment. zapier_customize + + + ### ConfigCat fields ConfigCat provide the following fields to include in your flow: diff --git a/website/docs/integrations/zoho-flow.mdx b/website/docs/integrations/zoho-flow.mdx index 4fe38c563..c3d304075 100644 --- a/website/docs/integrations/zoho-flow.mdx +++ b/website/docs/integrations/zoho-flow.mdx @@ -4,6 +4,8 @@ title: Zoho Flow - Automate your feature flag workflows description: ConfigCat Zoho Flow integration. This is a step-by-step guide on how to use the ConfigCat Zoho Flow integration to manage features using Zoho Flow apps. --- +import { Steps, Step, Title } from '@site/src/components/Steps'; + ## Connect ConfigCat to 500+ apps with Zoho Flow ConfigCat's Zoho Flow integration helps you connect ConfigCat to 1000+ other web apps without any code. It helps you automate day-to-day tasks and build complex business workflows within minutes. @@ -14,57 +16,84 @@ You can set **triggers**, add **actions**, use **Delays and Decisions** to creat ## Setup -1. Log in to your Zoho Flow account or create a new one. - -2. Navigate to **My Flows** using the side menu. - -3. Click on **Create Flow**, fill the name and description boxes then click on **Create**. + + +Log in to your Zoho Flow account or create a new one. + + +Navigate to **My Flows** using the side menu. + + +Click on **Create Flow**, fill the name and description boxes then click on **Create**. + + -4. Select the **App** trigger by clicking it's **Configure** button. +Select the **App** trigger by clicking it's **Configure** button. zoho_trigger -5. Search for **ConfigCat**, select it and hit the **NEXT** button. + + +Search for **ConfigCat**, select it and hit the **NEXT** button. zoho_cc_search -6. On the **Choose ConfigCat Trigger** pane select the **Audit event occured** trigger. + + +On the **Choose ConfigCat Trigger** pane select the **Audit event occured** trigger. zoho_audit_trigger -7. On the next pane you have to connect the integration with your ConfigCat environment. Hit the **Connect** button. + + +On the next pane you have to connect the integration with your ConfigCat environment. Hit the **Connect** button. zoho_connect - -8. Get your API credentials for ConfigCat Dashboard. + + + +Get your API credentials for ConfigCat Dashboard. -9. Use the generated **Basic auth user name** and **Basic auth password** to connect your ConfigCat account to Zoho Flow. + + +Use the generated **Basic auth user name** and **Basic auth password** to connect your ConfigCat account to Zoho Flow. zoho_fill_form -10. On the next pane you have to select the ConfigCat [Product](../main-concepts.mdx#product), [Config](../main-concepts.mdx#config) and [Environment](../main-concepts.mdx#environment) you want to be notified about. The **Variable name** field is auto-generated by the system, you can leave it as is. Optionally, you can also set filter conditions to control exactly when should the trigger fire. + + +On the next pane you have to select the ConfigCat [Product](../main-concepts.mdx#product), [Config](../main-concepts.mdx#config) and [Environment](../main-concepts.mdx#environment) you want to be notified about. The **Variable name** field is auto-generated by the system, you can leave it as is. Optionally, you can also set filter conditions to control exactly when should the trigger fire. zoho_product_config_environment -11. Your trigger is set and will be called by ConfigCat. You can go ahead building your flows. See the list of available Zoho Flow Apps for inspiration. - + + +Your trigger is set and will be called by ConfigCat. You can go ahead building your flows. See the list of available Zoho Flow Apps for inspiration. + + ### Example on how to get Slack notifications on feature flag changes. -1. Use the **Send public/private channel message** action from the Slack app and drag it under the ConfigCat trigger. + + +Use the **Send public/private channel message** action from the Slack app and drag it under the ConfigCat trigger. zoho_slack_add - -2. Configure the Slack action to which channel and exactly what it should send. + + +Configure the Slack action to which channel and exactly what it should send. :::info You may have to connect the Zoho Flow Slack app to your Slack subscription if you didn't do it before. ::: zoho_slack_config - -3. Hit the `Test & Debug` button on the right top corner and wait for the results in your Slack workspace. You should get a message like this: + + +Hit the `Test & Debug` button on the right top corner and wait for the results in your Slack workspace. You should get a message like this: zoho_slack_config + + ## Need help? diff --git a/website/docs/sdk-reference/dotnet.mdx b/website/docs/sdk-reference/dotnet.mdx index ebb6ebd73..be42f1394 100644 --- a/website/docs/sdk-reference/dotnet.mdx +++ b/website/docs/sdk-reference/dotnet.mdx @@ -21,11 +21,7 @@ export const NetSchema = require('@site/src/schema-markup/sdk-reference/net.json ## Getting started - - - -### Install _ConfigCat SDK_ [NuGet package](https://www.nuget.org/packages/ConfigCat.Client) - +### 1. Install _ConfigCat SDK_ [NuGet package](https://www.nuget.org/packages/ConfigCat.Client) @@ -48,35 +44,20 @@ dotnet add package ConfigCat.Client To get the _ConfigCat SDK_ up and running in Unity, please refer to [this guide](./unity.mdx). ::: - - - -### Import package - +### 2. Import package ```csharp using ConfigCat.Client; ``` - - - - -### Create the _ConfigCat_ client with your _SDK Key_ - +### 3. Create the _ConfigCat_ client with your _SDK Key_ ```csharp var client = ConfigCatClient.Get("#YOUR-SDK-KEY#"); ``` - - - - - -### Get your setting value - +### 4. Get your setting value ```csharp var isMyAwesomeFeatureEnabled = await client.GetValueAsync("isMyAwesomeFeatureEnabled", false); @@ -92,12 +73,7 @@ else The _ConfigCat SDK_ also offers a synchronous API for feature flag evaluation. Read more [here](#snapshots-and-non-blocking-synchronous-feature-flag-evaluation). - - - - -### Dispose the _ConfigCat_ client - +### 5. Dispose the _ConfigCat_ client You can safely dispose all clients at once or individually and release all associated resources on application exit. @@ -107,9 +83,6 @@ ConfigCatClient.DisposeAll(); // disposes all clients client.Dispose(); // disposes a specific client ``` - - - ## Creating the _ConfigCat Client_ _ConfigCat Client_ is responsible for: diff --git a/website/docs/sdk-reference/unity.mdx b/website/docs/sdk-reference/unity.mdx index 302849768..38e6870ff 100644 --- a/website/docs/sdk-reference/unity.mdx +++ b/website/docs/sdk-reference/unity.mdx @@ -6,6 +6,7 @@ description: Using the ConfigCat SDK in Unity. This is a step-by-step guide on h import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; +import { Steps, Step, Title } from '@site/src/components/Steps'; export const UnitySchema = require('@site/src/schema-markup/sdk-reference/unity.json'); @@ -35,7 +36,9 @@ So, as a first step, you will need to get the assembly .dll files for `netstanda You can do this by downloading these packages and extracting the .dll files manually from the .nupkg files (which are actually plain ZIP files). Or, if you have [.NET](https://dotnet.microsoft.com) installed, you can take a shortcut: -1. Create a file named `Plugins.csproj` (anywhere in your file system) with the following content: + + +Create a file named `Plugins.csproj` (anywhere in your file system) with the following content: ```xml @@ -46,8 +49,14 @@ Or, if you have [.NET](https://dotnet.microsoft.com) installed, you can take a s ``` -1. Run `dotnet publish -c Release` in the same folder. -1. You will now have all the necessary .dll files in the `bin/Release/netstandard2.0/publish` folder. + + +Run `dotnet publish -c Release` in the same folder. + + +You will now have all the necessary .dll files in the `bin/Release/netstandard2.0/publish` folder. + + ### 2. Add the SDK assembly files to your Unity project diff --git a/website/docs/sdk-reference/unreal.mdx b/website/docs/sdk-reference/unreal.mdx index d3a188255..adb26dbe9 100644 --- a/website/docs/sdk-reference/unreal.mdx +++ b/website/docs/sdk-reference/unreal.mdx @@ -6,6 +6,7 @@ description: ConfigCat Unreal Engine SDK Reference. This is a step-by-step guide import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; +import { Steps, Step, Title } from '@site/src/components/Steps'; export const CPPSchema = require('@site/src/schema-markup/sdk-reference/cpp.json');