> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Tutoriel de configuration du SDK et des feature flags

> Configurez le SDK Kameleoon et configurez les feature flags en suivant cette checklist pas a pas couvrant l'integration du SDK, la configuration de l'application Kameleoon et le mode hybride optionnel.

<Warning>
  Verifiez toujours la [documentation du SDK](../../feature-experimentation/get-started/overview) pour vous assurer des noms de methodes corrects. Les methodes ci-dessous proviennent du **SDK Node.js**. Certaines fonctionnalites ou methodes peuvent ne pas etre disponibles dans tous les SDK.
</Warning>

***

## Vue d'ensemble de la checklist SDK

Ce guide fournit une checklist pas a pas pour [configurer et utiliser le SDK Kameleoon](#configuration-unique-dans-le-sdk), [configurer les feature flags](#configuration-unique-dans-l’application-kameleoon), et eventuellement [activer le mode hybride](#2-mode-hybride-optionnel) (SDK + `engine.js`).

***

## 1. Bases

### Configuration unique (dans le SDK)

#### Etape 1 – Installer, configurer et initialiser le SDK

* Installez le SDK et configurez-le, en faisant attention a :
  * `updateInterval` : Definit la frequence a laquelle le SDK recupere la derniere configuration depuis Kameleoon.
  * `trackingInterval` : Definit la frequence a laquelle le SDK envoie les donnees suivies a Kameleoon.
* Creez un nouveau `KameleoonClient` et appelez `initialize()` pour charger la configuration.
* **SDK PHP uniquement :** Installez une [tache cron](../../sdks/web-sdks/php-sdk#using-the-php-sdk-without-a-cron-job) pour collecter les donnees.

***

#### Etape 2 – Definir le visitor code

* Utilisez `getVisitorCode()` ou une methode personnalisee pour definir le cookie `kameleoonVisitorCode`.

***

#### Etape 3 (Optionnel) – Activer l'[expérimentation cross-device](../../cross-device-experimentation) et la [cle de bucketing personnalisee](../../sdks/web-sdks/nodejs-sdk#utilisation-d’une-clé-de-bucketing-personnalisée)

* **Expérimentation cross-device :** Partagez le meme `kameleoonVisitorCode` entre les appareils.
* **Cle de bucketing personnalisee :** Affichez la meme variation a un groupe defini de visiteurs (par exemple, des utilisateurs de la meme organisation).

***

#### Etape 4 – Gerer le consentement

* Si une expérience requiert le consentement, appelez `setLegalConsent()`. *(Non necessaire si le type de feature flag utilise les Delivery Rules.)*

***

#### Etape 5 – Envoyer des donnees predefinies

* Utilisez `addData()` pour cibler :

  * Appareil
  * Navigateur
  * URL de la page
  * Autres criteres predefinis

* Appelez `flush()` pour envoyer les donnees a Kameleoon. *(Note : `flush` est egalement appele implicitement par `isFeatureActive`, `getVariation` et `trackConversion`.)*

***

#### Etape 6 – Exclure et marquer les bots

* Excluez les bots des resultats en utilisant `addData()` avec le type `userAgent`.
* Pour marquer les bots internes, passez `curl/8.0` a `userAgent` dans `addData()`.

***

### Configuration unique (dans l'[application Kameleoon](https://app.kameleoon.com))

#### Etape 7 – Creer un feature flag

* Creez un nouveau feature flag dans l'application Kameleoon.
* Ajoutez au moins une **regle** (Delivery ou Experiment) au **Rollout Planner**.

***

#### Etape 8 – Definir le segment

* **Option 1 :** Cibler tous les visiteurs dans l'application Kameleoon et implementer une logique personnalisee dans le SDK.
* **Option 2 (Recommandee) :** Utiliser un segment Kameleoon dans l'application Kameleoon.
  * Assurez-vous d'utiliser `addData()` dans le SDK pour envoyer les donnees utilisees pour le ciblage (URL de la page, appareil, navigateur, etc.).

***

#### Etape 9 – Associer des objectifs au flag

* Associez au moins un objectif pour suivre les conversions.

***

#### Etape 10 – Activer le flag

* Activez le flag (**on**) dans l'application Kameleoon pour commencer a delivrer les variations.

***

### Configuration pour chaque flag (dans le SDK)

#### Etape 11 – Verifier l'activation de la fonctionnalite

* Appelez `isFeatureActive()` pour verifier si un visiteur est cible :

  * Renvoie `false` si la variation est "off"
  * Renvoie `true` si elle est active

* Appelez `getVariation()` pour recuperer la cle de variation.

***

#### Etape 12 – Suivre les conversions et definir des donnees personnalisees

* Appelez `trackConversion()` avec les parametres pertinents pour suivre les objectifs.
* Optionnellement, utilisez `addData()` pour le ciblage et la segmentation personnalises.

***

#### Etape 13 (Optionnel) – Utiliser les [donnees collectees precedemment](../targeting-and-segmentation/native-segmentation#when-is-getremotevisitordata-required) ou des [donnees externes](../targeting-and-segmentation/use-external-data-to-target-users)

* **Donnees collectees precedemment :** Appelez `getRemoteVisitorData()` pour reutiliser les conditions collectees ou prechargees.
* **Donnees externes :** Utilisez la **Data API** pour collecter des donnees externes et les recuperer dans le SDK via `getRemoteData()`.

***

## 2. Mode hybride (Optionnel)

Suivez ces etapes uniquement si vous utilisez le [**mode hybride**](./hybrid-experimentation) (SDK cote client + `engine.js`).

### Configuration unique (dans le SDK)

#### Etape 1 – Installer engine.js

* Ajoutez le script `engine.js` au front-end.

***

#### Etape 2 – Gerer le consentement front-end

Si le consentement est requis, gerez-le en utilisant :

* L'**API d'activation**
* Le `kameleoonQueue` via Tag Manager
* Un snippet de code direct :

```js theme={null}
window.kameleoonQueue.push(['Kameleoon.API.Core.enableLegalConsent', 'BOTH']); 
// or
window.kameleoonQueue.push(['Kameleoon.API.Core.disableLegalConsent', 'BOTH']);
```

***

#### Etape 3 – Synchroniser le visitor code

Si le consentement est **requis**, synchronisez le cookie visitor code entre le SDK et le front-end :

```js theme={null}
window.kameleoonQueue.push({
  level: "IMMEDIATE",
  command: () => Kameleoon.API.Visitor.setVisitorCode("<USER_ID>")
});
```

***

### Optionnel : envoyer des donnees a des outils externes (mode hybride)

#### Configuration unique (dans l'[application Kameleoon](https://app.kameleoon.com))

##### Etape 1 – Activer l'integration tierce

* Dans la section **Integrations** de l'application Kameleoon, activez l'outil d'analyse que vous souhaitez utiliser (par exemple, GA4).

***

#### Configuration pour chaque flag (dans l'application Kameleoon)

##### Etape 2 – Activer l'integration

* Dans le **Feature Flag Dashboard**, activez l'outil pour le type de regle choisi (Experiment ou Delivery).
* Assurez-vous que l'integration est activee dans l'environnement correct (Production, Development ou Staging).

***

#### Configuration pour chaque flag (dans le SDK)

##### Etape 3 – Recuperer le code de suivi

* Appelez `getEngineTrackingCode()` dans le code SDK dans les **5 secondes** suivant l'activation de la fonctionnalite (`isFeatureActive` ou `getVariation`).

***

##### Etape 4 – Injecter le code de suivi dans la page

Inserez le code renvoye dans le HTML :

```js theme={null}
window.kameleoonQueue = window.kameleoonQueue || [];
window.kameleoonQueue.push(['Experiments.assignVariation', 244200, 962266]);
window.kameleoonQueue.push(['Experiments.trigger', 244200, true]);
```

***

##### Etape 5 – Verifier la transmission des evenements

* Sur la page ciblee, inspectez les elements de la page pour confirmer l'injection du code.
* Pour GA4, verifiez que l'evenement est envoye dans le `dataLayer`.
* Dans l'onglet **Network**, confirmez que l'evenement est envoye au bon outil d'analyse (GA4 devrait afficher un evenement "collect").