--- title: "Intégrer Adapty dans votre application Capacitor avec l'aide de l'IA" description: "Un guide étape par étape pour intégrer Adapty dans votre application Capacitor en utilisant Cursor, Context7, ChatGPT, Claude ou d'autres outils IA." --- Ce guide vous accompagne pas à pas dans l'intégration d'Adapty dans votre application Capacitor à l'aide d'un outil de codage IA — il vous suffit de lui fournir la bonne documentation Adapty dans le bon ordre. For a fully automated integration, use the [adapty-sdk-integration skill](https://github.com/adaptyteam/adapty-sdk-integration-skill): it runs the whole integration from your AI coding tool in one command. ## Avant de commencer : configuration du tableau de bord \{#before-you-start-dashboard-setup\} Adapty nécessite quelques étapes de configuration dans le tableau de bord avant d'écrire du code avec le SDK. Vous pouvez le faire avec un skill LLM interactif, ou manuellement via le Dashboard. ### Approche par compétence (recommandée) \{#skill-approach-recommended\} La compétence Adapty CLI permet à votre LLM de configurer votre application, vos produits, vos niveaux d'accès, vos paywalls et vos placements directement — sans ouvrir le Dashboard à chaque étape. Il vous suffit de [connecter vos stores](integrate-payments) dans le Dashboard. ``` npx skills add adaptyteam/adapty-cli --skill adapty-cli ``` Une fois la compétence ajoutée, exécutez `/adapty-cli` dans votre agent. Il vous guidera à chaque étape — y compris lorsqu'il faudra ouvrir le Dashboard pour connecter vos stores. ### Approche via le tableau de bord \{#dashboard-approach\} Si vous préférez tout configurer manuellement, voici ce dont vous avez besoin avant d'écrire du code. Votre LLM ne peut pas rechercher les valeurs du tableau de bord à votre place — vous devrez les fournir vous-même. 1. **Connectez vos stores** : Dans l'Adapty Dashboard, accédez à **App settings → General**. Connectez l'App Store et Google Play si votre application Capacitor cible les deux plateformes. C'est indispensable pour que les achats fonctionnent. [Connecter les stores](integrate-payments) 2. **Copiez votre clé SDK publique** : dans l'Adapty Dashboard, rendez-vous dans **App settings → General**, puis repérez la section **API keys**. Dans le code, c'est la chaîne que vous passez à `adapty.activate()`. 3. **Créez au moins un produit** : dans l'Adapty Dashboard, accédez à la page **Products**. Vous ne référencez pas les produits directement dans le code — Adapty les transmet via les paywalls. [Ajouter des produits](quickstart-products) 4. **Créez un paywall et un placement** : Dans l'Adapty Dashboard, créez un paywall sur la page **Paywalls**, puis assignez-le à un placement sur la page **Placements**. Dans le code, l'ID du placement est la chaîne que vous passez à `adapty.getFlow()`. [Créer un paywall](quickstart-paywalls) 5. **Configurez les niveaux d'accès** : Dans l'Adapty Dashboard, configurez chaque produit sur la page **Products**. Dans le code, la chaîne vérifiée est `profile.accessLevels['premium']?.isActive`. Le niveau d'accès `premium` par défaut convient à la plupart des applications. Si les utilisateurs payants ont accès à différentes fonctionnalités selon le produit (par exemple, un plan `basic` ou un plan `pro`), [créez des niveaux d'accès supplémentaires](assigning-access-level-to-a-product) avant de commencer à coder. :::tip Une fois que vous avez les cinq éléments, vous êtes prêt à écrire du code. Dites à votre LLM : « Ma clé SDK publique est X, mon identifiant de placement est Y » pour qu'il génère le code d'initialisation et de récupération de flow correct. ::: ### Configurez quand vous êtes prêt \{#set-up-when-ready\} Ces éléments ne sont pas obligatoires pour commencer à coder, mais vous en aurez besoin au fil de l'évolution de votre intégration : - **Tests A/B** : Configurez-les sur la page **Placements**. Aucune modification de code requise. [Tests A/B](ab-tests) - **Paywalls et placements supplémentaires** : Ajoutez d'autres appels `getFlow` avec des ID de placement différents. - **Intégrations analytiques** : Configurez-les sur la page **Integrations**. La configuration varie selon l'intégration. Consultez les [intégrations analytiques](analytics-integration) et les [intégrations d'attribution](attribution-integration). ## Alimentez votre LLM avec la documentation Adapty \{#feed-adapty-docs-to-your-llm\} ### Utiliser Context7 (recommandé) [Context7](https://context7.com) est un serveur MCP qui donne à votre LLM un accès direct à la documentation Adapty à jour. Votre LLM récupère automatiquement les bonnes docs en fonction de vos questions — aucun collage d'URL manuel nécessaire. Context7 fonctionne avec **Cursor**, **Claude Code**, **Windsurf** et d'autres outils compatibles MCP. Pour le configurer, exécutez : ``` npx ctx7 setup ``` Cela détecte votre éditeur et configure le serveur Context7. Pour une configuration manuelle, consultez le [dépôt GitHub Context7](https://github.com/upstash/context7). Une fois configuré, référencez la bibliothèque Adapty dans vos prompts : ``` Use the adaptyteam/adapty-docs library to look up how to install the Capacitor SDK ``` :::warning Même si Context7 supprime le besoin de coller manuellement des liens vers la documentation, l'ordre d'implémentation est important. Suivez le [guide d'implémentation](#implementation-walkthrough) ci-dessous étape par étape pour vous assurer que tout fonctionne. ::: ### Utilisez les docs en texte brut \{#use-plain-text-docs\} Vous pouvez accéder à n'importe quelle doc Adapty en texte brut Markdown. Ajoutez `.md` à la fin de son URL, ou cliquez sur **Copy for LLM** sous le titre de l'article. Par exemple : [adapty-cursor-capacitor.md](https://adapty.io/docs/fr/adapty-cursor-capacitor.md). Chaque étape du [guide d'implémentation](#implementation-walkthrough) ci-dessous inclut un bloc « Envoyer à votre LLM » avec des liens `.md` à coller. Pour accéder à plus de documentation en une seule fois, consultez les [fichiers d'index et sous-ensembles par plateforme](#plain-text-doc-index-files) ci-dessous. ## Implémentation pas à pas \{#implementation-walkthrough\} Le reste de ce guide vous accompagne à travers l'intégration d'Adapty dans l'ordre d'implémentation. Chaque étape inclut la documentation à envoyer à votre LLM, ce que vous devriez obtenir une fois terminé, et les problèmes courants. ### Planifiez votre intégration \{#plan-your-integration\} Avant de vous lancer dans le code, demandez à votre LLM d'analyser votre projet et de créer un plan d'implémentation. Si votre outil IA dispose d'un mode planification (comme le mode plan de Cursor ou de Claude Code), utilisez-le pour que le LLM puisse lire à la fois la structure de votre projet et la documentation Adapty avant d'écrire quoi que ce soit. Indiquez à votre LLM l'approche que vous utilisez pour les achats — cela détermine les guides qu'il devra suivre : - [**Adapty Flow Builder**](adapty-flow-builder) : vous créez des flows dans le builder no-code d'Adapty, et le SDK les affiche automatiquement. - [**Paywalls créés manuellement**](capacitor-making-purchases) : vous construisez votre propre interface de paywall dans le code, mais utilisez toujours Adapty pour récupérer les produits et gérer les achats. - [**Mode observateur**](observer-vs-full-mode) : vous conservez votre infrastructure d'achats existante et utilisez Adapty uniquement pour les analyses et les intégrations. Vous ne savez pas lequel choisir ? Consultez le [tableau comparatif dans le guide de démarrage rapide](capacitor-quickstart-paywalls). ### Installer et configurer le SDK \{#install-and-configure-the-sdk\} Ajoutez la dépendance du SDK Adapty via npm et activez-la avec votre clé SDK publique. C'est la base — rien d'autre ne fonctionne sans elle. **Guide :** [Installer et configurer le SDK Adapty](sdk-installation-capacitor) :::info Ce guide cible le SDK Adapty Capacitor v4 (beta) — l'API présentée dans le [quickstart](capacitor-quickstart-paywalls). La v4 est une version préliminaire, alors assurez-vous que votre LLM utilise la version exacte (`npm install @adapty/capacitor@4.0.1-beta.1`) plutôt que la dernière version stable 3.x. Consultez la [section d'installation du SDK 4.0](sdk-installation-capacitor#adapty-sdk-40-beta) et le [guide de migration](migration-to-capacitor-sdk-v4). ::: Envoyez ceci à votre LLM : ``` Read these Adapty docs before writing code: - https://adapty.io/docs/fr/sdk-installation-capacitor.md ``` :::tip[Checkpoint] - **Expected :** L'app se compile et s'exécute sur iOS et Android. La console affiche le log d'activation d'Adapty. - **Gotcha :** "Public API key is missing" → vérifiez que vous avez remplacé le placeholder par votre vraie clé depuis **App settings**. ::: ### Afficher les paywalls et gérer les achats \{#show-paywalls-and-handle-purchases\} Récupérez un paywall par identifiant de placement, affichez-le et gérez les événements d'achat. Les guides dont vous avez besoin dépendent de la façon dont vous gérez les achats. Testez chaque achat en sandbox au fur et à mesure — n'attendez pas la fin. Consultez [Tester les achats en sandbox](test-purchases-in-sandbox) pour les instructions de configuration. **Guides :** - [Activer les achats avec des flows (démarrage rapide)](capacitor-quickstart-paywalls) - [Récupérer les flows et paywalls](capacitor-get-pb-paywalls) - [Afficher les flows et paywalls](capacitor-present-paywalls) - [Gérer les événements](capacitor-handling-events) - [Répondre aux actions](capacitor-handle-paywall-actions) ``` Read these Adapty docs before writing code: - https://adapty.io/docs/fr/capacitor-quickstart-paywalls.md - https://adapty.io/docs/fr/capacitor-get-pb-paywalls.md - https://adapty.io/docs/fr/capacitor-present-paywalls.md - https://adapty.io/docs/fr/capacitor-handling-events.md - https://adapty.io/docs/fr/capacitor-handle-paywall-actions.md ``` :::tip[Checkpoint] - **Attendu :** Le flow s'affiche avec vos produits configurés. Appuyer sur un produit déclenche la boîte de dialogue d'achat sandbox. - **À surveiller :** Flow vide ou erreur `getFlow` → vérifiez que l'ID du placement correspond exactement à celui du tableau de bord et qu'une audience est bien assignée au placement. ::: **Guides :** - [Activer les achats dans votre paywall personnalisé (démarrage rapide)](capacitor-quickstart-manual) - [Récupérer les paywalls et les produits](fetch-paywalls-and-products-capacitor) - [Afficher un paywall conçu avec Remote Config](present-remote-config-paywalls-capacitor) - [Effectuer des achats](capacitor-making-purchases) - [Restaurer des achats](capacitor-restore-purchase) ``` Read these Adapty docs before writing code: - https://adapty.io/docs/fr/capacitor-quickstart-manual.md - https://adapty.io/docs/fr/fetch-paywalls-and-products-capacitor.md - https://adapty.io/docs/fr/present-remote-config-paywalls-capacitor.md - https://adapty.io/docs/fr/capacitor-making-purchases.md - https://adapty.io/docs/fr/capacitor-restore-purchase.md ``` :::tip[Checkpoint] - **Attendu :** Votre paywall personnalisé affiche les produits récupérés depuis Adapty. Appuyer sur un produit déclenche la boîte de dialogue d'achat sandbox. - **Problème fréquent :** Tableau de produits vide → vérifiez que le paywall a des produits assignés dans le tableau de bord et que le placement a une audience. ::: **Guides :** - [Présentation du mode Observer](observer-vs-full-mode) - [Implémenter le mode Observer](implement-observer-mode-capacitor) - [Signaler les transactions en mode Observer](report-transactions-observer-mode-capacitor) Envoyez ceci à votre LLM : ``` Read these Adapty docs before writing code: - https://adapty.io/docs/fr/observer-vs-full-mode.md - https://adapty.io/docs/fr/implement-observer-mode-capacitor.md - https://adapty.io/docs/fr/report-transactions-observer-mode-capacitor.md ``` :::tip[Checkpoint] - **Résultat attendu :** Après un achat sandbox via votre flux d'achat existant, la transaction apparaît dans l'**Event Feed** du tableau de bord Adapty. - **Piège courant :** Aucun événement → vérifiez que vous signalez bien les transactions à Adapty et que les notifications serveur sont configurées pour les deux stores. ::: ### Vérifier le statut de l'abonnement \{#check-subscription-status\} Après un achat, vérifiez le profil utilisateur pour un niveau d'accès actif afin de contrôler l'accès au contenu premium. **Guide :** [Vérifier le statut de l'abonnement](capacitor-check-subscription-status) Envoyez ceci à votre LLM : ``` Read these Adapty docs before writing code: - https://adapty.io/docs/fr/capacitor-check-subscription-status.md ``` :::tip[Checkpoint] - **Attendu :** Après un achat sandbox, `profile.accessLevels['premium']?.isActive` renvoie `true`. - **Point d'attention :** `accessLevels` vide après un achat → vérifiez que le produit a bien un niveau d'accès assigné dans le tableau de bord. ::: ### Identifier les utilisateurs \{#identify-users\} Associez les comptes utilisateurs de votre application aux profils Adapty pour que les achats persistent d'un appareil à l'autre. :::important Ignorez cette étape si votre application ne nécessite pas d'authentification. ::: **Guide :** [Identifier les utilisateurs](capacitor-quickstart-identify) Envoyez ceci à votre LLM : ``` Read these Adapty docs before writing code: - https://adapty.io/docs/fr/capacitor-quickstart-identify.md ``` :::tip[Checkpoint] - **Attendu :** Après avoir appelé `adapty.identify()`, la section **Profiles** du tableau de bord affiche votre identifiant utilisateur personnalisé. - **Attention :** Appelez `identify` après l'activation mais avant de récupérer les paywalls pour éviter une attribution de profil anonyme. ::: ### Préparer la mise en production \{#prepare-for-release\} Une fois votre intégration validée en sandbox, parcourez la checklist de mise en production pour vous assurer que tout est prêt. **Guide :** [Checklist de mise en production](release-checklist) Envoyez ceci à votre LLM : ``` Read these Adapty docs before releasing: - https://adapty.io/docs/fr/release-checklist.md ``` :::tip[Checkpoint] - **Attendu :** Tous les éléments de la liste de contrôle sont confirmés : connexions au store, notifications serveur, flux d'achat, vérifications du niveau d'accès et exigences de confidentialité. - **Point d'attention :** Notifications serveur manquantes → configurez les App Store Server Notifications dans **App settings → iOS SDK** et les Google Play Real-Time Developer Notifications dans **App settings → Android SDK**. ::: ## Fichiers d'index en texte brut \{#plain-text-doc-index-files\} Si vous souhaitez fournir à votre LLM un contexte plus large au-delà des pages individuelles, nous hébergeons des fichiers d'index qui listent ou regroupent toute la documentation Adapty : - [`llms.txt`](https://adapty.io/docs/fr/llms.txt) : Liste toutes les pages avec des liens `.md`. Un [standard émergent](https://llmstxt.org/) pour rendre les sites web accessibles aux LLMs. Notez que pour certains agents IA (par ex. ChatGPT), vous devrez télécharger `llms.txt` et le joindre à la conversation en tant que fichier. - [`llms-full.txt`](https://adapty.io/docs/fr/llms-full.txt) : L'intégralité de la documentation Adapty regroupée en un seul fichier. Très volumineux — à utiliser uniquement lorsque vous avez besoin d'une vue d'ensemble complète. - Fichiers spécifiques à Capacitor [`capacitor-llms.txt`](https://adapty.io/docs/fr/capacitor-llms.txt) et [`capacitor-llms-full.txt`](https://adapty.io/docs/fr/capacitor-llms-full.txt) : Sous-ensembles propres à la plateforme, moins lourds en tokens que le site complet.