# Indicateurs de fonctionnalité
{% hint style="warning" %}
L'utilisation de contenu adaptatif avec des feature flags nécessite l'ajout de code à votre application.
Actuellement, l'aide GitBook ne prend en charge que les configurations basées sur React.
{% endhint %}
GitBook fournit des fonctions d'aide et des intégrations pour des fournisseurs de services de feature flags populaires comme [**LaunchDarkly**](#launchdarkly) et [**Reflag**](#reflag).
Ceci vous permet de lire les feature flags auxquels les utilisateurs ont accès dans votre produit, pendant qu'ils lisent votre documentation. C'est utile si vous devez afficher une documentation pour des fonctionnalités qui ne sont disponibles qu'à un groupe spécifique de personnes.
### LaunchDarkly
LaunchDarkly vous permet d'envoyer l'accès aux feature flags sous forme de claims via le [`launchdarkly-react-client-sdk`](https://launchdarkly.com/docs/sdk/client-side/react/react-web) et le [`@gitbook/adaptive`](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/fr/publishing-documentation/adaptive-content/enabling-adaptive-content/broken-reference) package.
Si vous utilisez déjà les feature flags LaunchDarkly dans votre produit, il y a de fortes chances que vous ayez déjà configuré ce package.
Pour transmettre ces feature flags à GitBook en tant que claims, suivez ces étapes :
{% stepper %}
{% step %}
**Installer l'intégration LaunchDarkly**
Pour commencer, vous devrez d'abord [installer l'intégration LaunchDarkly](https://app.gitbook.com/integrations/launchdarkly) dans votre site GitBook.
{% endstep %}
{% step %}
**Configurez votre projet et vos clés d'accès**
Ajoutez votre clé de projet et votre jeton d'accès de service depuis vos [paramètres LaunchDarkly](https://app.launchdarkly.com/settings) à la configuration de l'intégration.
{% endstep %}
{% step %}
**Installez et ajoutez l'aide GitBook à votre application**
Après avoir configuré l'intégration LaunchDarkly, vous devrez installer l'aide au contenu adaptatif GitBook dans votre application.
```bash
npm install @gitbook/adaptive
```
{% endstep %}
{% step %}
**Configurez votre application**
Vous devrez utiliser le `withLaunchDarkly` helper avec le SDK React de LaunchDarkly pour transmettre le contexte à GitBook.
import { render } from 'react-dom';
import { withLaunchDarkly } from '@gitbook/adaptive';
import { asyncWithLDProvider, useLDClient } from 'launchdarkly-react-client-sdk';
import MyApplication from './MyApplication';
function PassFeatureFlagsToGitBookSite() {
const ldClient = useLDClient();
React.useEffect(() => {
if (!ldClient) {
return;
}
return withLaunchDarkly(ldClient);
}, [ldClient]);
return null;
}
(async () => {
const LDProvider = await asyncWithLDProvider({
clientSideID: 'client-side-id-123abc',
context: {
kind: 'user',
key: 'user-key-123abc',
name: 'Sandy Smith',
email: 'sandy@example.com'
},
options: { /* ... */ }
});
render(
<LDProvider>
<PassFeatureFlagsToGitBookSite />
<MyApplication />
</LDProvider>,
document.getElementById('reactDiv'),
);
})();
{% endstep %}
{% step %}
**Vérifiez votre schéma de visiteur**
Un [schéma de visiteur](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/fr/publishing-documentation/adaptive-content/enabling-adaptive-content/..#set-your-visitor-schema) est requis afin que vos claims puissent être lus sur votre site publié. L'installation et la configuration de l'intégration LaunchDarkly devraient définir automatiquement votre schéma de visiteur pour vous.
{% endstep %}
{% step %}
**Personnalisez votre contenu**
Après avoir défini votre schéma de visiteur, vous êtes prêt à adapter l'expérience de votre documentation aux utilisateurs visitant votre site, en utilisant les feature flags auxquels l'utilisateur a accès.
Toute valeur de feature flag disponible dans LaunchDarkly sera exposée comme faisant partie du schéma de visiteur sous le `visitor.claims.unsigned.launchdarkly` objet. En savoir plus sur les claims non signés [ici](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/fr/publishing-documentation/adaptive-content/enabling-adaptive-content/..#set-an-unsigned-claim).
Rendez-vous sur [adapter votre contenu](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/fr/publishing-documentation/adaptive-content/adapting-your-content) pour en savoir plus sur la personnalisation de votre documentation pour vos utilisateurs.
{% endstep %}
{% endstepper %}
### Reflag
Reflag vous permet d'envoyer l'accès aux feature flags sous forme de claims via le [`@reflag/react-sdk`](https://www.npmjs.com/package/@reflag/react-sdk) et le [`@gitbook/adaptive`](https://github.com/GitbookIO/integrations/tree/main/packages/adaptive) package.
Si vous utilisez déjà les feature flags Reflag dans votre produit, il y a de fortes chances que vous ayez déjà configuré ce package.
Pour transmettre ces feature flags à GitBook en tant que claims, suivez ces étapes :
{% stepper %}
{% step %}
**Installer l'intégration Reflag**
Pour commencer, vous devrez d'abord [installer l'intégration Reflag](https://app.gitbook.com/integrations/bucket) dans votre site GitBook.
{% endstep %}
{% step %}
**Configurez votre clé secrète**
Ajoutez votre clé secrète depuis vos [paramètres Reflag](https://app.reflag.com/envs/current/settings/app-environments) à la configuration de l'intégration.
{% endstep %}
{% step %}
**Installez l'aide GitBook dans votre application**
Après avoir configuré l'intégration Reflag, vous devrez installer l'aide au contenu adaptatif GitBook dans votre application.
```bash
npm install @gitbook/adaptive
```
{% endstep %}
{% step %}
**Configurez votre application**
Vous devrez utiliser le `withReflag` helper avec le SDK React de Reflag pour transmettre le contexte à GitBook.
import { withReflag } from '@gitbook/adaptive';
import { ReflagProvider, useClient } from '@reflag/react-sdk';
import MyApplication from './MyApplication';
function PassFeatureFlagsToGitBookSite() {
const client = useClient();
React.useEffect(() => {
if (!client) {
return;
}
return withReflag(client);
}, [client]);
return null;
}
export function Application() {
const currentUser = useLoggedInUser();
const appConfig = useAppConfig();
return (
<ReflagProvider
publishableKey={appConfig.reflagCom.publishableKey}
user={{
id: currentUser.uid,
email: currentUser.email ?? undefined,
name: currentUser.displayName ?? '',
}}
company={{
id: currentUser.company.id,
}}
>
<PassFeatureFlagsToGitBookSite />
<MyApplication />
</ReflagProvider>
);
}
{% endstep %}
{% step %}
**Vérifiez votre schéma de visiteur**
Un [schéma de visiteur](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/fr/publishing-documentation/adaptive-content/enabling-adaptive-content/..#set-your-visitor-schema) est requis afin que vos claims puissent être lus sur votre site publié. L'installation et la configuration de l'intégration Reflag devraient définir automatiquement votre schéma de visiteur pour vous.
{% endstep %}
{% step %}
**Personnalisez votre contenu**
Après avoir défini votre schéma de visiteur, vous êtes prêt à adapter l'expérience de votre documentation aux utilisateurs visitant votre site, en utilisant les feature flags auxquels l'utilisateur a accès.
Toute valeur de feature flag disponible dans Reflag sera exposée comme faisant partie du schéma de visiteur sous le `visitor.claims.unsigned.reflag` objet. En savoir plus sur les claims non signés [ici](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/fr/publishing-documentation/adaptive-content/enabling-adaptive-content/..#set-an-unsigned-claim).
Rendez-vous sur [adapter votre contenu](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/fr/publishing-documentation/adaptive-content/adapting-your-content) pour en savoir plus sur la personnalisation de votre documentation pour vos utilisateurs.
{% endstep %}
{% endstepper %}
{% hint style="info" %}
Les valeurs des feature flags sont évaluées côté client, évitez donc d'utiliser cette méthode pour transmettre des données sensibles ou critiques pour la sécurité.
{% endhint %}