> ## Documentation Index > Fetch the complete documentation index at: https://docs.adrop.io/llms.txt > Use this file to discover all available pages before exploring further. # Getting Started > Guide to integrating Adrop SDK into your React Native app. ## Overview The Adrop React Native SDK allows you to easily integrate various ad formats into your React Native app. ### Supported Ad Formats | Format | Description | | ---------------- | ---------------------------------------------------- | | Banner Ads | Rectangular ads displayed in a portion of the screen | | Native Ads | Ads that blend naturally with app content | | Interstitial Ads | Full-screen ads | | Rewarded Ads | Full-screen ads that provide rewards | | Popup Ads | Ads displayed in popup format | | Splash Ads | Ads displayed on app launch screen | *** ## Requirements ### React Native * React Native **0.71** or higher ### Android * API level **23** (Android 6.0) or higher * `compileSdkVersion` **34** * Kotlin **2.1.0** or higher * Gradle **8.7** or higher ### iOS * iOS **13.0** or higher * Swift **5.0** or higher *** ## Installation ### 1. Install Package ```bash npm theme={null} npm install adrop-ads-react-native ``` ```bash yarn theme={null} yarn add adrop-ads-react-native ``` ### 2. Android Setup Add the backfill ad repository to `android/settings.gradle.kts`. ```kotlin android/settings.gradle.kts theme={null} dependencyResolutionManagement { repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS) repositories { google() mavenCentral() maven { url = uri("https://artifact.bytedance.com/repository/pangle") } } } ``` Add the Kotlin plugin and backfill dependency to `android/app/build.gradle`. ```gradle android/app/build.gradle theme={null} apply plugin: "kotlin-android" dependencies { implementation 'io.adrop:adrop-ads-backfill:1.11.2' } ``` Add the backfill App ID to `android/app/src/main/AndroidManifest.xml`. ```xml android/app/src/main/AndroidManifest.xml theme={null}

``` Please contact Adrop to get your App ID. ### 3. iOS Setup Modify `ios/Podfile`. ```ruby ios/Podfile theme={null} use_frameworks! target 'YourApp' do # Other dependencies... # Backfill ad SDK pod 'adrop-ads-backfill' end ``` Install pods. ```bash theme={null} cd ios && pod install --repo-update && cd .. ``` ### 4. Info.plist Configuration Add the following settings to `ios/YourApp/Info.plist` for backfill ads. * **GADApplicationIdentifier**: App ID for backfill ads * **SKAdNetworkItems**: Required for ad conversion tracking on iOS 14+ ```xml Info.plist theme={null} GADApplicationIdentifier ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy SKAdNetworkItems SKAdNetworkIdentifier cstr6suwn9.skadnetwork SKAdNetworkIdentifier 4fzdc2evr5.skadnetwork SKAdNetworkIdentifier 4pfyvq9l8r.skadnetwork SKAdNetworkIdentifier 2fnua5tdw4.skadnetwork SKAdNetworkIdentifier ydx93a7ass.skadnetwork SKAdNetworkIdentifier 5a6flpkh64.skadnetwork SKAdNetworkIdentifier p78axxw29g.skadnetwork SKAdNetworkIdentifier v72qych5uu.skadnetwork SKAdNetworkIdentifier ludvb6z3bs.skadnetwork SKAdNetworkIdentifier cp8zw746q7.skadnetwork SKAdNetworkIdentifier v9wttpbfk9.skadnetwork SKAdNetworkIdentifier lr83yxwka7.skadnetwork SKAdNetworkIdentifier 578prtvx9j.skadnetwork SKAdNetworkIdentifier 7ug5zh24hu.skadnetwork SKAdNetworkIdentifier wg4vff78zm.skadnetwork SKAdNetworkIdentifier mj797d8u6f.skadnetwork SKAdNetworkIdentifier 8s468mfl3y.skadnetwork SKAdNetworkIdentifier 4dzt52r2t5.skadnetwork SKAdNetworkIdentifier vhf287vqwu.skadnetwork SKAdNetworkIdentifier c6k4g5qg8m.skadnetwork SKAdNetworkIdentifier 5tjdwbrq8w.skadnetwork SKAdNetworkIdentifier 294l99pt4k.skadnetwork SKAdNetworkIdentifier mqn7fxpca7.skadnetwork SKAdNetworkIdentifier g6gcrrvk4p.skadnetwork SKAdNetworkIdentifier tl55sbb4fm.skadnetwork SKAdNetworkIdentifier s39g8k73mm.skadnetwork SKAdNetworkIdentifier a2p9lx4jpn.skadnetwork SKAdNetworkIdentifier k6y4y55b64.skadnetwork SKAdNetworkIdentifier 488r3q3dtq.skadnetwork SKAdNetworkIdentifier 9rd848q2bz.skadnetwork SKAdNetworkIdentifier glqzh8vgby.skadnetwork SKAdNetworkIdentifier 5lm9lj6jb7.skadnetwork SKAdNetworkIdentifier 97r2b46745.skadnetwork SKAdNetworkIdentifier zmvfpc5aq8.skadnetwork SKAdNetworkIdentifier 3sh42y64q3.skadnetwork SKAdNetworkIdentifier mlmmfzh3r3.skadnetwork SKAdNetworkIdentifier 3rd42ekr43.skadnetwork SKAdNetworkIdentifier 2u9pt9hc89.skadnetwork SKAdNetworkIdentifier m8dbw4sv7c.skadnetwork SKAdNetworkIdentifier 238da6jt44.skadnetwork SKAdNetworkIdentifier 4468km3ulz.skadnetwork SKAdNetworkIdentifier 4w7y6s5ca2.skadnetwork SKAdNetworkIdentifier a8cz6cu7e5.skadnetwork SKAdNetworkIdentifier 77y3x8wds4.skadnetwork SKAdNetworkIdentifier n9x2a789qt.skadnetwork SKAdNetworkIdentifier hs6bdukanm.skadnetwork SKAdNetworkIdentifier f7s53z58qe.skadnetwork SKAdNetworkIdentifier 9t245vhmpl.skadnetwork SKAdNetworkIdentifier mp6xlyr22a.skadnetwork SKAdNetworkIdentifier prcb7njmu6.skadnetwork SKAdNetworkIdentifier kbd757ywx3.skadnetwork SKAdNetworkIdentifier k674qkevps.skadnetwork SKAdNetworkIdentifier t38b2kh725.skadnetwork SKAdNetworkIdentifier feyaarzu9v.skadnetwork SKAdNetworkIdentifier 5f5u5tfb26.skadnetwork SKAdNetworkIdentifier 424m5254lk.skadnetwork SKAdNetworkIdentifier e5fvkxwrpn.skadnetwork SKAdNetworkIdentifier 3qy4746246.skadnetwork SKAdNetworkIdentifier klf5c3l5u5.skadnetwork SKAdNetworkIdentifier zq492l623r.skadnetwork SKAdNetworkIdentifier 22mmun2rn5.skadnetwork SKAdNetworkIdentifier av6w8kgt66.skadnetwork SKAdNetworkIdentifier v79kvwwj4g.skadnetwork SKAdNetworkIdentifier 44jx6755aq.skadnetwork SKAdNetworkIdentifier 32z4fx6l9h.skadnetwork SKAdNetworkIdentifier w9q455wk68.skadnetwork SKAdNetworkIdentifier xga6mpmplv.skadnetwork SKAdNetworkIdentifier f38h382jlk.skadnetwork SKAdNetworkIdentifier yclnxrl5pm.skadnetwork SKAdNetworkIdentifier x44k69ngh6.skadnetwork SKAdNetworkIdentifier ppxm28t8ap.skadnetwork SKAdNetworkIdentifier f73kdq92p3.skadnetwork SKAdNetworkIdentifier 5l3tpt7t6e.skadnetwork SKAdNetworkIdentifier wzmmz9fp6w.skadnetwork SKAdNetworkIdentifier pwa73g5rt2.skadnetwork SKAdNetworkIdentifier 9nlqeag3gk.skadnetwork SKAdNetworkIdentifier 6yxyv74ff7.skadnetwork SKAdNetworkIdentifier uw77j35x4d.skadnetwork SKAdNetworkIdentifier 54nzkqm89y.skadnetwork SKAdNetworkIdentifier 44n7hlldy6.skadnetwork SKAdNetworkIdentifier 6964rsfnh4.skadnetwork SKAdNetworkIdentifier 6g9af3uyq4.skadnetwork SKAdNetworkIdentifier 6v7lgmsu45.skadnetwork SKAdNetworkIdentifier 7fmhfwg9en.skadnetwork SKAdNetworkIdentifier a7xqa6mtl2.skadnetwork SKAdNetworkIdentifier 84993kbrcf.skadnetwork SKAdNetworkIdentifier bxvub5ada5.skadnetwork SKAdNetworkIdentifier 79pbpufp6p.skadnetwork SKAdNetworkIdentifier 9vvzujtq5s.skadnetwork SKAdNetworkIdentifier 7rz58n8ntl.skadnetwork SKAdNetworkIdentifier 3qcr597p9d.skadnetwork SKAdNetworkIdentifier 737z793b9f.skadnetwork SKAdNetworkIdentifier 89z7zv988g.skadnetwork SKAdNetworkIdentifier c3frkrj4fj.skadnetwork SKAdNetworkIdentifier 275upjj5gd.skadnetwork SKAdNetworkIdentifier 3l6bd9hu43.skadnetwork SKAdNetworkIdentifier 52fl2v3hgk.skadnetwork SKAdNetworkIdentifier 6p4ks3rnbw.skadnetwork SKAdNetworkIdentifier apzhy3va96.skadnetwork SKAdNetworkIdentifier 9b89h5y424.skadnetwork SKAdNetworkIdentifier 523jb4fst2.skadnetwork SKAdNetworkIdentifier b9bk5wbcq9.skadnetwork SKAdNetworkIdentifier cg4yq2srnc.skadnetwork SKAdNetworkIdentifier cj5566h2ga.skadnetwork SKAdNetworkIdentifier 24zw6aqk47.skadnetwork SKAdNetworkIdentifier 74b6s63p6l.skadnetwork SKAdNetworkIdentifier 8m87ys6875.skadnetwork SKAdNetworkIdentifier 24t9a8vw3c.skadnetwork SKAdNetworkIdentifier 6xzpu9s2p8.skadnetwork SKAdNetworkIdentifier cs644xg564.skadnetwork SKAdNetworkIdentifier dbu4b84rxf.skadnetwork SKAdNetworkIdentifier ejvt5qm6ak.skadnetwork SKAdNetworkIdentifier mtkv5xtk9e.skadnetwork SKAdNetworkIdentifier kbmxgpxpgc.skadnetwork SKAdNetworkIdentifier hb56zgv37p.skadnetwork SKAdNetworkIdentifier pwdxu55a5a.skadnetwork SKAdNetworkIdentifier r45fhb6rf7.skadnetwork SKAdNetworkIdentifier t6d3zquu66.skadnetwork SKAdNetworkIdentifier u679fj5vs4.skadnetwork SKAdNetworkIdentifier dzg6xy7pwj.skadnetwork SKAdNetworkIdentifier g28c52eehv.skadnetwork SKAdNetworkIdentifier mls7yz5dvl.skadnetwork SKAdNetworkIdentifier vcra2ehyfk.skadnetwork SKAdNetworkIdentifier rx5hdcabgc.skadnetwork SKAdNetworkIdentifier qwpu75vrh2.skadnetwork SKAdNetworkIdentifier rvh3l7un93.skadnetwork SKAdNetworkIdentifier x5l83yy675.skadnetwork SKAdNetworkIdentifier m5mvw97r93.skadnetwork SKAdNetworkIdentifier xy9t38ct57.skadnetwork SKAdNetworkIdentifier g2y4y55b64.skadnetwork SKAdNetworkIdentifier gta9lk7p23.skadnetwork SKAdNetworkIdentifier n6fk4nfna4.skadnetwork SKAdNetworkIdentifier qu637u8glc.skadnetwork SKAdNetworkIdentifier y5ghdn5j9k.skadnetwork SKAdNetworkIdentifier y45688jllp.skadnetwork SKAdNetworkIdentifier ggvn48r87g.skadnetwork SKAdNetworkIdentifier m297p6643m.skadnetwork SKAdNetworkIdentifier qqp299437r.skadnetwork SKAdNetworkIdentifier hdw39hrw9y.skadnetwork SKAdNetworkIdentifier krvm3zuq6h.skadnetwork SKAdNetworkIdentifier cwn433xbcr.skadnetwork SKAdNetworkIdentifier ns5j362hk7.skadnetwork SKAdNetworkIdentifier su67r6k2v3.skadnetwork SKAdNetworkIdentifier z959bm4gru.skadnetwork SKAdNetworkIdentifier x8uqf25wch.skadnetwork SKAdNetworkIdentifier n38lu8286q.skadnetwork SKAdNetworkIdentifier fz2k2k5tej.skadnetwork SKAdNetworkIdentifier ecpz2srf59.skadnetwork SKAdNetworkIdentifier bvpn9ufa9b.skadnetwork SKAdNetworkIdentifier 6rd35atwn8.skadnetwork SKAdNetworkIdentifier ln5gz23vtd.skadnetwork SKAdNetworkIdentifier tmhh9296z4.skadnetwork SKAdNetworkIdentifier sczv5946wb.skadnetwork SKAdNetworkIdentifier dkc879ngq3.skadnetwork SKAdNetworkIdentifier 87u5trcl3r.skadnetwork SKAdNetworkIdentifier fq6vru337s.skadnetwork SKAdNetworkIdentifier f2zub97jtl.skadnetwork SKAdNetworkIdentifier thzdn4h5nc.adattributionkit SKAdNetworkIdentifier raa6f494kr.adattributionkit SKAdNetworkIdentifier 6lz2ygh3q6.adattributionkit SKAdNetworkIdentifier m2jqnlggk3.adattributionkit SKAdNetworkIdentifier pg7ctvrt6f.adattributionkit SKAdNetworkIdentifier 77y3x8wds4.adattributionkit SKAdNetworkIdentifier 55644vm79v.skadnetwork SKAdNetworkIdentifier nzq8sh4pbs.skadnetwork SKAdNetworkIdentifier 55y65gfgn7.skadnetwork SKAdNetworkIdentifier 252b5q8x7y.skadnetwork SKAdNetworkIdentifier 47vhws6wlr.skadnetwork SKAdNetworkIdentifier 4mn522wn87.skadnetwork SKAdNetworkIdentifier 577p5t736z.skadnetwork SKAdNetworkIdentifier 7953jerfzd.skadnetwork SKAdNetworkIdentifier 7bxrt786m8.skadnetwork SKAdNetworkIdentifier 7fbxrn65az.skadnetwork SKAdNetworkIdentifier 8c4e2ghe7u.skadnetwork SKAdNetworkIdentifier 8r8llnkz5a.skadnetwork SKAdNetworkIdentifier 9yg77x724h.skadnetwork SKAdNetworkIdentifier ce8ybjwass.skadnetwork SKAdNetworkIdentifier dt3cjx1a9i.skadnetwork SKAdNetworkIdentifier eh6m2bh4zr.skadnetwork SKAdNetworkIdentifier gta8lk7p23.skadnetwork SKAdNetworkIdentifier gvmwg8q7h5.skadnetwork SKAdNetworkIdentifier hjevpa356n.skadnetwork SKAdNetworkIdentifier jk2fsx2rgz.skadnetwork SKAdNetworkIdentifier n66cz3y3bx.skadnetwork SKAdNetworkIdentifier pu4na253f3.skadnetwork SKAdNetworkIdentifier r8lj5b58b5.skadnetwork SKAdNetworkIdentifier s69wq72ugq.skadnetwork SKAdNetworkIdentifier v4nxqhlyqp.skadnetwork SKAdNetworkIdentifier vutu7akeur.skadnetwork SKAdNetworkIdentifier z24wtl6j62.skadnetwork SKAdNetworkIdentifier z4gj7hsk7h.skadnetwork SKAdNetworkIdentifier x8jxxk4ff5.skadnetwork SKAdNetworkIdentifier x8yj322td6.skadnetwork ``` If your Info.plist already contains a `SKAdNetworkItems` key, do not add a new one — merge only the array (``) entries. Duplicate keys cause iOS to use only the first array. Please contact Adrop for the full SKAdNetworkItems list and App ID. ### 2. Create Config Plugin Create a `plugins/withAdropService.js` file in the project root. This Expo config plugin automatically generates `adrop_service.json` in native projects when running `npx expo prebuild`. * Android: `android/app/src/main/assets/adrop_service.json` * iOS: `ios/{projectName}/adrop_service.json` ```javascript plugins/withAdropService.js theme={null} const { withDangerousMod } = require('@expo/config-plugins') const fs = require('fs') const path = require('path') function withAdropServiceAndroid(config, props) { return withDangerousMod(config, [ 'android', async (config) => { const projectRoot = config.modRequest.projectRoot const androidAssetsPath = path.join(projectRoot, 'android', 'app', 'src', 'main', 'assets') if (!fs.existsSync(androidAssetsPath)) fs.mkdirSync(androidAssetsPath, { recursive: true }) const serviceConfig = { app_key: props.android?.appKey || props.appKey || '' } fs.writeFileSync(path.join(androidAssetsPath, 'adrop_service.json'), JSON.stringify(serviceConfig, null, 2)) return config }, ]) } function withAdropServiceIOS(config, props) { return withDangerousMod(config, [ 'ios', async (config) => { const projectRoot = config.modRequest.projectRoot const projectName = config.modRequest.projectName const iosPath = path.join(projectRoot, 'ios', projectName) if (!fs.existsSync(iosPath)) fs.mkdirSync(iosPath, { recursive: true }) const serviceConfig = { app_key: props.ios?.appKey || props.appKey || '' } fs.writeFileSync(path.join(iosPath, 'adrop_service.json'), JSON.stringify(serviceConfig, null, 2)) return config }, ]) } module.exports = function withAdropService(config, props = {}) { config = withAdropServiceAndroid(config, props) config = withAdropServiceIOS(config, props) return config } ``` ### 3. Configure app.json Register the following two plugins in the `plugins` section of `app.json`. ```json app.json theme={null} { "expo": { "plugins": [ [ "expo-build-properties", { "android": { "compileSdkVersion": 35, "targetSdkVersion": 35, "minSdkVersion": 24 }, "ios": { "deploymentTarget": "15.1" } } ], [ "./plugins/withAdropService", { "android": { "appKey": "" }, "ios": { "appKey": "" } } ] ] } } ``` * **expo-build-properties**: Requires Android `minSdkVersion` 24 or higher, iOS `deploymentTarget` 15.1 or higher * **withAdropService**: Pass the `appKey` issued from the Adrop console for each platform *** ## Initialization Initialize the SDK when your app starts. This is typically done in `App.tsx` or `index.js`. ```tsx App.tsx theme={null} import { Adrop } from 'adrop-ads-react-native'; // Initialize on app start Adrop.initialize(false); // false: test mode, true: production mode ``` ### Initialization Options ```tsx theme={null} Adrop.initialize( production, // boolean: whether production mode targetCountries, // string[]?: target country code array (optional) useInAppBrowser // boolean?: whether to use iOS in-app browser (optional) ); ``` **Parameters** | Parameter | Type | Required | Description | | ----------------- | ---------- | -------- | ------------------------------------------------------- | | `production` | `boolean` | Y | `true`: production mode, `false`: test mode | | `targetCountries` | `string[]` | N | Country codes to display ads (e.g., `['KR', 'US']`) | | `useInAppBrowser` | `boolean` | N | Whether to use in-app browser on iOS (default: `false`) | **Example** ```tsx theme={null} // Basic initialization (test mode) Adrop.initialize(false); // Production mode + specific country targeting Adrop.initialize(true, ['KR', 'JP', 'US']); // Production mode + iOS in-app browser Adrop.initialize(true, undefined, true); ``` *** ## Theme Settings Set the UI theme for ads. ```tsx theme={null} import { Adrop, AdropTheme } from 'adrop-ads-react-native'; // Set theme Adrop.setTheme(AdropTheme.auto); // Follow system settings Adrop.setTheme(AdropTheme.light); // Light mode Adrop.setTheme(AdropTheme.dark); // Dark mode ``` | Theme | Description | | ------------------ | --------------------------------------------- | | `AdropTheme.auto` | Automatically switch based on system settings | | `AdropTheme.light` | Light mode | | `AdropTheme.dark` | Dark mode | *** ## User Identifier Settings Set the user identifier (UID) for targeted advertising. ```tsx theme={null} import { Adrop } from 'adrop-ads-react-native'; Adrop.setUID('user_123'); ``` UID is transmitted after being hashed with SHA-256. Do not directly pass personal information such as email or phone number. *** ## Test Unit IDs Use the following test unit IDs during development and testing. | Format | Test Unit ID | | ---------------- | ---------------------------------- | | Banner (320x50) | `PUBLIC_TEST_UNIT_ID_320_50` | | Banner (320x100) | `PUBLIC_TEST_UNIT_ID_320_100` | | Native | `PUBLIC_TEST_UNIT_ID_NATIVE` | | Interstitial | `PUBLIC_TEST_UNIT_ID_INTERSTITIAL` | | Rewarded | `PUBLIC_TEST_UNIT_ID_REWARDED` | | Popup (Bottom) | `PUBLIC_TEST_UNIT_ID_POPUP_BOTTOM` | | Popup (Center) | `PUBLIC_TEST_UNIT_ID_POPUP_CENTER` | | Splash | `PUBLIC_TEST_UNIT_ID_SPLASH` | ```tsx theme={null} // Banner ad test const testBannerUnitId = 'PUBLIC_TEST_UNIT_ID_320_50'; ``` Be sure to replace with actual unit IDs before production deployment. *** ## Error Codes Error codes that may occur in the SDK. | Error Code | Description | | --------------------------------------- | ---------------------------- | | `AdropErrorCode.network` | Network error | | `AdropErrorCode.internal` | Internal error | | `AdropErrorCode.initialize` | SDK initialization error | | `AdropErrorCode.invalidUnit` | Invalid unit ID | | `AdropErrorCode.notTargetCountry` | Not a target country | | `AdropErrorCode.inactive` | Inactive ad | | `AdropErrorCode.adNoFill` | No ads to display | | `AdropErrorCode.adDuplicated` | Duplicate load request | | `AdropErrorCode.adLoading` | Loading in progress | | `AdropErrorCode.adEmpty` | Empty ad | | `AdropErrorCode.adShown` | Ad already shown | | `AdropErrorCode.adHideForToday` | Ad hidden for today | | `AdropErrorCode.adLandscapeUnsupported` | Landscape mode not supported | | `AdropErrorCode.backfillNoFill` | Backfill ad not available | ```tsx theme={null} import { AdropErrorCode } from 'adrop-ads-react-native'; // Error handling example if (errorCode === AdropErrorCode.adNoFill) { console.log('No ads available to display.'); } ``` *** ## Troubleshooting ### iOS Build Error If you encounter Swift version compatibility issues, add the following to the `post_install` block in `ios/Podfile`. ```ruby ios/Podfile theme={null} post_install do |installer| installer.pods_project.targets.each do |target| target.build_configurations.each do |config| config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES' end end end ``` ### Android Build Error If the Kotlin version doesn't match, check the Kotlin version in `android/build.gradle`. ```gradle android/build.gradle theme={null} buildscript { ext { kotlinVersion = '2.1.0' } } ``` *** ## Next Steps Implement banner ads Implement native ads Implement interstitial ads Implement rewarded ads Display web ads in WebView GDPR/CCPA consent management Implement popup ads Configure splash ads Set up user and context targeting Complete API reference Full implementation examples