--- title: "Интеграция Adapty в приложение React Native с помощью ИИ" description: "Пошаговый гайд по интеграции Adapty в приложение React Native с использованием Cursor, Context7, ChatGPT, Claude и других ИИ-инструментов." --- Этот гайд поможет вам интегрировать Adapty в приложение React Native с помощью LLM. Сначала вы настроите дашборд Adapty, а затем пройдёте каждый этап реализации, отправляя нужные ссылки на документацию своему LLM. В конце вы найдёте рекомендации по настройке ИИ-инструментов для работы с документацией Adapty. :::tip Скопируйте всю эту страницу в формате Markdown и вставьте в свой LLM, чтобы начать — нажмите **Copy for LLM** вверху страницы или откройте [версию в формате .md](https://adapty.io/docs/ru/adapty-cursor-react-native.md). LLM будет использовать ссылки на гайды и контрольные точки, чтобы провести вас через каждый этап. ::: ## Перед началом: настройка дашборда \{#before-you-start-dashboard-setup\} Перед написанием кода SDK требуется настройка дашборда. Это можно сделать с помощью интерактивного скилла для LLM или вручную через дашборд. ### Подход со скиллом (рекомендуется) \{#skill-approach-recommended\} Скилл Adapty CLI позволяет вашему LLM напрямую настраивать приложение, продукты, уровни доступа, пейволы и плейсменты — без необходимости открывать дашборд на каждом шаге. Вам нужно только [подключить сторы](integrate-payments) в дашборде. ``` npx skills add adaptyteam/adapty-cli --skill adapty-cli ``` После добавления скилла запустите `/adapty-cli` в агенте. Он проведёт вас через каждый шаг, включая моменты, когда нужно открыть дашборд для подключения сторов. ### Подход через дашборд \{#dashboard-approach\} Если вы предпочитаете настраивать всё вручную, вот что нужно сделать до написания кода. Ваш LLM не сможет самостоятельно найти значения из дашборда — вам придётся предоставить их самостоятельно. 1. **Подключите сторы**: В дашборде Adapty перейдите в **App settings → General**. Подключите App Store и Google Play, если приложение рассчитано на обе платформы. Без этого покупки не будут работать. [Подключить сторы](integrate-payments) 2. **Скопируйте публичный SDK-ключ**: В дашборде Adapty перейдите в **App settings → General** и найдите раздел **API keys**. В коде это строка, которую вы передаёте в `adapty.activate("YOUR_PUBLIC_SDK_KEY")`. 3. **Создайте хотя бы один продукт**: В дашборде Adapty перейдите на страницу **Products**. В коде вы не ссылаетесь на продукты напрямую — Adapty передаёт их через пейволы. [Добавить продукты](quickstart-products) 4. **Создайте пейвол и плейсмент**: В дашборде Adapty создайте пейвол на странице **Paywalls**, затем назначьте его плейсменту на странице **Placements**. В коде ID плейсмента — это строка, которую вы передаёте в `adapty.getPaywall("YOUR_PLACEMENT_ID")`. [Создать пейвол](quickstart-paywalls) 5. **Настройте уровни доступа**: В дашборде Adapty настройте их для каждого продукта на странице **Products**. В коде это строка, которую проверяют в `profile.accessLevels['premium']?.isActive`. Уровень доступа `premium` по умолчанию подходит для большинства приложений. Если платящие пользователи получают доступ к разным функциям в зависимости от продукта (например, план `basic` и план `pro`), [создайте дополнительные уровни доступа](assigning-access-level-to-a-product) до начала разработки. :::tip Когда все пять пунктов выполнены, можно приступать к написанию кода. Скажите своему LLM: «Мой публичный SDK-ключ — X, ID плейсмента — Y» — так он сможет сгенерировать правильный код инициализации и получения пейвола. ::: ### Настройте по мере готовности \{#set-up-when-ready\} Следующие шаги не обязательны для начала разработки, но понадобятся по мере развития интеграции: - **A/B-тесты**: Настраиваются на странице **Placements**. Изменений в коде не требуется. [A/B-тесты](ab-tests) - **Дополнительные пейволы и плейсменты**: Добавьте больше вызовов `getPaywall` с разными ID плейсментов. - **Аналитические интеграции**: Настраиваются на странице **Integrations**. Процесс настройки зависит от конкретной интеграции. См. [аналитические интеграции](analytics-integration) и [атрибуционные интеграции](attribution-integration). ## Передайте документацию Adapty вашему LLM \{#feed-adapty-docs-to-your-llm\} ### Используйте Context7 (рекомендуется) \{#use-context7-recommended\} [Context7](https://context7.com) — это MCP-сервер, который даёт вашему LLM прямой доступ к актуальной документации Adapty. LLM автоматически находит нужные документы на основе вашего запроса — не нужно вручную вставлять ссылки. Context7 работает с **Cursor**, **Claude Code**, **Windsurf** и другими MCP-совместимыми инструментами. Для настройки выполните: ``` npx ctx7 setup ``` Команда определит ваш редактор и настроит сервер Context7. Для ручной настройки см. [репозиторий Context7 на GitHub](https://github.com/upstash/context7). После настройки ссылайтесь на библиотеку Adapty в своих промптах: ``` Use the adaptyteam/adapty-docs library to look up how to install the React Native SDK ``` :::warning Даже если Context7 избавляет от необходимости вставлять ссылки на документы вручную, порядок реализации всё равно важен. Следуйте [пошаговому руководству по реализации](#implementation-walkthrough) ниже строго по порядку, чтобы всё работало корректно. ::: ### Используйте документацию в виде обычного текста \{#use-plain-text-docs\} Любой документ Adapty доступен в виде текста в формате Markdown. Добавьте `.md` в конец URL или нажмите **Copy for LLM** под заголовком статьи. Например: [adapty-cursor-react-native.md](https://adapty.io/docs/ru/adapty-cursor-react-native.md). Каждый этап в [пошаговом руководстве по реализации](#implementation-walkthrough) ниже содержит блок «Отправьте это своему LLM» со ссылками `.md` для вставки. Чтобы получить больше документации сразу, см. [индексные файлы и платформенные подборки](#plain-text-doc-index-files) ниже. ## Пошаговое руководство по реализации \{#implementation-walkthrough\} Оставшаяся часть гайда проведёт вас через интеграцию Adapty в правильном порядке. Каждый этап включает документы для отправки LLM, ожидаемый результат и типичные проблемы. ### Спланируйте интеграцию \{#plan-your-integration\} Прежде чем приступать к коду, попросите LLM проанализировать ваш проект и составить план реализации. Если ваш ИИ-инструмент поддерживает режим планирования (как в Cursor или Claude Code), используйте его — LLM сможет изучить структуру проекта и документацию Adapty до написания кода. Скажите LLM, какой подход к покупкам вы используете — это определяет, какие гайды ему нужно изучить: - [**Adapty Paywall Builder**](adapty-paywall-builder): Пейволы создаются в конструкторе Adapty без кода, а SDK отображает их автоматически. - [**Пейволы, созданные вручную**](react-native-making-purchases): Вы создаёте собственный UI пейвола в коде, но используете Adapty для получения продуктов и обработки покупок. - [**Observer mode**](observer-vs-full-mode): Вы сохраняете существующую инфраструктуру покупок и используете Adapty только для аналитики и интеграций. Не знаете, что выбрать? Прочитайте [сравнительную таблицу в quickstart](react-native-quickstart-paywalls). ### Установите и настройте SDK \{#install-and-configure-the-sdk\} Добавьте зависимость Adapty SDK с помощью npm (или yarn) и активируйте его с вашим публичным SDK-ключом. Это основа — без неё ничего остального не работает. У нас есть отдельные гайды по установке для Expo и bare React Native — выберите тот, который подходит для вашего проекта. **Гайды:** - [Установка с Expo](sdk-installation-react-native-expo) - [Установка с bare React Native](sdk-installation-react-native-pure) Отправьте это своему LLM (выберите подходящий вариант или отправьте оба): ``` Read these Adapty docs before writing code: - https://adapty.io/docs/ru/sdk-installation-react-native-expo.md - https://adapty.io/docs/ru/sdk-installation-react-native-pure.md ``` :::tip[Контрольная точка] - **Ожидаемый результат:** Приложение собирается и запускается на iOS и Android. В логах Metro bundler отображается сообщение об активации Adapty. - **Частая проблема:** «Public API key is missing» → убедитесь, что вы заменили заглушку на реальный ключ из App settings. ::: ### Покажите пейволы и обработайте покупки \{#show-paywalls-and-handle-purchases\} Получите пейвол по ID плейсмента, отобразите его и обработайте события покупки. Нужные гайды зависят от выбранного подхода к покупкам. Тестируйте каждую покупку в песочнице по мере работы — не откладывайте до конца. Инструкцию по настройке см. в [Тестирование покупок в песочнице](test-purchases-in-sandbox). **Гайды:** - [Включение покупок с помощью пейволов (quickstart)](react-native-quickstart-paywalls) - [Получение пейволов Paywall Builder и их конфигурации](react-native-get-pb-paywalls) - [Отображение пейволов](react-native-present-paywalls) - [Обработка событий пейвола](react-native-handling-events-1) - [Реакция на действия кнопок](react-native-handle-paywall-actions) Отправьте это своему LLM: ``` Read these Adapty docs before writing code: - https://adapty.io/docs/ru/react-native-quickstart-paywalls.md - https://adapty.io/docs/ru/react-native-get-pb-paywalls.md - https://adapty.io/docs/ru/react-native-present-paywalls.md - https://adapty.io/docs/ru/react-native-handling-events-1.md - https://adapty.io/docs/ru/react-native-handle-paywall-actions.md ``` :::tip[Контрольная точка] - **Ожидаемый результат:** Пейвол отображается с вашими настроенными продуктами. При нажатии на продукт появляется диалог покупки в песочнице. - **Частая проблема:** Пустой пейвол или ошибка `getPaywall` → проверьте, что ID плейсмента точно совпадает со значением в дашборде и плейсменту назначена аудитория. ::: **Гайды:** - [Включение покупок в кастомном пейволе (quickstart)](react-native-quickstart-manual) - [Получение пейволов и продуктов](fetch-paywalls-and-products-react-native) - [Отображение пейвола, созданного с помощью Remote Config](present-remote-config-paywalls-react-native) - [Совершение покупок](react-native-making-purchases) - [Восстановление покупок](react-native-restore-purchase) Отправьте это своему LLM: ``` Read these Adapty docs before writing code: - https://adapty.io/docs/ru/react-native-quickstart-manual.md - https://adapty.io/docs/ru/fetch-paywalls-and-products-react-native.md - https://adapty.io/docs/ru/present-remote-config-paywalls-react-native.md - https://adapty.io/docs/ru/react-native-making-purchases.md - https://adapty.io/docs/ru/react-native-restore-purchase.md ``` :::tip[Контрольная точка] - **Ожидаемый результат:** Ваш кастомный пейвол отображает продукты, полученные из Adapty. При нажатии на продукт появляется диалог покупки в песочнице. - **Частая проблема:** Пустой массив продуктов → убедитесь, что в дашборде пейволу назначены продукты и плейсменту назначена аудитория. ::: **Гайды:** - [Обзор Observer mode](observer-vs-full-mode) - [Реализация Observer mode](implement-observer-mode-react-native) - [Передача транзакций в Observer mode](report-transactions-observer-mode-react-native) Отправьте это своему LLM: ``` Read these Adapty docs before writing code: - https://adapty.io/docs/ru/observer-vs-full-mode.md - https://adapty.io/docs/ru/implement-observer-mode-react-native.md - https://adapty.io/docs/ru/report-transactions-observer-mode-react-native.md ``` :::tip[Контрольная точка] - **Ожидаемый результат:** После покупки в песочнице через существующий платёжный процесс транзакция отображается в **Event Feed** дашборда Adapty. - **Частая проблема:** Нет событий → убедитесь, что вы передаёте транзакции в Adapty и серверные уведомления настроены для обоих сторов. ::: ### Проверьте статус подписки \{#check-subscription-status\} После покупки проверьте профиль пользователя на наличие активного уровня доступа, чтобы открыть доступ к премиум-контенту. **Гайд:** [Проверка статуса подписки](react-native-check-subscription-status) Отправьте это своему LLM: ``` Read these Adapty docs before writing code: - https://adapty.io/docs/ru/react-native-check-subscription-status.md ``` :::tip[Контрольная точка] - **Ожидаемый результат:** После покупки в песочнице `profile.accessLevels['premium']?.isActive` возвращает `true`. - **Частая проблема:** Пустой `accessLevels` после покупки → проверьте, что продукту в дашборде назначен уровень доступа. ::: ### Идентифицируйте пользователей \{#identify-users\} Привяжите аккаунты пользователей вашего приложения к профилям Adapty, чтобы покупки сохранялись на всех устройствах. :::important Пропустите этот шаг, если в вашем приложении нет авторизации. ::: **Гайд:** [Идентификация пользователей](react-native-quickstart-identify) Отправьте это своему LLM: ``` Read these Adapty docs before writing code: - https://adapty.io/docs/ru/react-native-quickstart-identify.md ``` :::tip[Контрольная точка] - **Ожидаемый результат:** После вызова `adapty.identify("your-user-id")` в разделе **Profiles** дашборда отображается ваш кастомный ID пользователя. - **Частая проблема:** Вызывайте `identify` после активации, но до получения пейволов, чтобы избежать атрибуции к анонимному профилю. ::: ### Подготовьтесь к выпуску \{#prepare-for-release\} Когда интеграция работает в песочнице, пройдите по чеклисту выпуска, чтобы убедиться, что всё готово к продакшену. **Гайд:** [Чеклист выпуска](release-checklist) Отправьте это своему LLM: ``` Read these Adapty docs before releasing: - https://adapty.io/docs/ru/release-checklist.md ``` :::tip[Контрольная точка] - **Ожидаемый результат:** Все пункты чеклиста подтверждены: подключение сторов, серверные уведомления, процесс покупки, проверка уровней доступа и требования к конфиденциальности. - **Частая проблема:** Отсутствуют серверные уведомления → настройте App Store Server Notifications в **App settings → iOS SDK** и Google Play Real-Time Developer Notifications в **App settings → Android SDK**. ::: ## Индексные файлы с документацией в виде обычного текста \{#plain-text-doc-index-files\} Если вам нужно дать LLM более широкий контекст, выходящий за рамки отдельных страниц, мы публикуем индексные файлы, которые содержат список или объединяют всю документацию Adapty: - [`llms.txt`](https://adapty.io/docs/ru/llms.txt): Список всех страниц со ссылками `.md`. [Формирующийся стандарт](https://llmstxt.org/) для обеспечения доступности сайтов для LLM. Обратите внимание, что для некоторых ИИ-агентов (например, ChatGPT) нужно скачать `llms.txt` и загрузить его в чат как файл. - [`llms-full.txt`](https://adapty.io/docs/ru/llms-full.txt): Вся документация Adapty, объединённая в один файл. Очень большой — используйте только когда нужна полная картина. - Подборки для React Native: [`react-native-llms.txt`](https://adapty.io/docs/ru/react-native-llms.txt) и [`react-native-llms-full.txt`](https://adapty.io/docs/ru/react-native-llms-full.txt): Платформенные подборки, которые экономят токены по сравнению с полным сайтом.