Get SDK

Perkox React Native Offerwall SDK: Complete Integration Tutorial

Perkox Team

·

Offerwall Placement Strategy

Perkox React Native Offerwall SDK: Complete Integration Tutorial

Perkox React Native Offerwall SDK: The Complete Integration Tutorial

This tutorial walks through integrating the Perkox offerwall into a React Native app step by step – from installing the native module to validating rewards server-side. Perkox is the only offerwall platform with a native React Native SDK, so you get native performance without WebViews or hand-rolled bridges.

What You Will Build

By the end of this tutorial, your React Native app will: initialize the Perkox SDK at launch, open the offerwall from a button tap, receive reward events in JavaScript, and credit users server-side through validated postbacks.

Prerequisites

  • React Native 0.70+ (bare workflow or expo-dev-client)
  • A Perkox publisher account with an approved app (your app must be live on Google Play or the App Store)
  • Your App ID and SDK Key from the Perkox dashboard
  • A backend endpoint that can receive postbacks

Step 1: Install the Native Module

Android: add the Perkox AAR to android/app/libs/ and reference it in build.gradle:

dependencies {
    implementation files('libs/perkox-android-sdk-release.aar')
    implementation 'androidx.appcompat:appcompat:1.6.1'
}

iOS: add the local Swift Package (PerkoxOfferwall.xcframework) in Xcode via Add Package Dependencies → Add Local. The extracted folder must sit next to your .xcodeproj.

Step 2: Register the Native Module

Android – create PerkoxModule.kt in your MainApplication package:

class PerkoxModule(reactContext: ReactApplicationContext) :
    ReactContextBaseJavaModule(reactContext) {

    override fun getName() = "PerkoxModule"

    @ReactMethod
    fun showOfferwall(appId: String, sdkKey: String, playerId: String) {
        val offerwall = PerkoxOfferwall.create(appId, sdkKey, playerId)
        offerwall.launch(currentActivity)
    }
}

iOS – create PerkoxModule.swift:

@objc(PerkoxModule)
class PerkoxModule: NSObject {
    @objc
    func showOfferwall(_ appId: String, sdkKey: String, playerId: String) {
        let offerwall = PerkoxOfferwall.create(
            appId: appId, sdkKey: sdkKey, playerId: playerId)
        DispatchQueue.main.async {
            offerwall.launch(viewController: UIApplication.shared
                .keyWindow?.rootViewController)
        }
    }
}

Step 3: Call the Offerwall from JavaScript

import { NativeModules, NativeEventEmitter } from 'react-native';

const { PerkoxModule } = NativeModules;
const emitter = new NativeEventEmitter(PerkoxModule);

// Open the offerwall
PerkoxModule.showOfferwall('YOUR_APP_ID', 'YOUR_SDK_KEY', 'player_123');

// Listen for rewards
emitter.addListener('onReward', (reward) => {
  console.log('Reward:', reward.amount, reward.status);
});

Step 4: Configure Server-Side Postbacks

SDK events are UI feedback only. The authoritative credit happens when Perkox fires a signed postback to your backend after validating the conversion. Configure your postback URL in the Perkox Publisher Dashboard:

https://yourdomain.com/perkox/postback?user_id={player_id}&click_id={click_id}&offer_id={offer_id}&reward={reward_amount}&status={status}

Your backend must: verify the signature, check the timestamp, deduplicate by click_id, handle all four statuses (pending, approved, rejected, reversed), and return HTTP 200.

Step 5: Test Before Launch

  • Run a test offer through the sandbox environment
  • Verify the reward event fires in JavaScript
  • Confirm your postback endpoint receives and processes the callback
  • Test the rejected and reversed statuses – most revenue leaks come from ignoring them

Common Pitfalls

  • Managed Expo cannot load custom native modules – use expo-dev-client or a bare workflow
  • Random playerIds break postbacks – use stable internal user IDs from your backend
  • Crediting from SDK callbacks – never do this; always credit from validated postbacks
  • Channel name mismatches – the native module name must match exactly

Frequently Asked Questions

Does Perkox work with Expo?
Yes, through expo-dev-client custom builds. Managed Expo (expo-go) cannot load custom native modules.

How is this different from a WebView offerwall?
The native module renders the offerwall natively – 2-4x faster open-to-first-offer, platform-standard UX, and reliable rewards.

Can I use it alongside AdMob?
Yes – AdMob handles CPM ads, the Perkox offerwall handles CPA/CPI revenue. Complementary layers.

What revenue can React Native apps expect?
Offerwall CPA/CPI conversions typically generate $20-$100+ eCPM – 3-5x typical rewarded video.

Start Monetizing with Perkox

Register as a Perkox publisher and integrate the React Native offerwall SDK today. Read the documentation

Perkox provides rewarded monetization infrastructure – SDKs, tracking, analytics, and reward validation – for mobile apps and games across Android, iOS, Unity, Flutter, React Native, and Web.

Related Articles

Start monetizing your app with Perkox.

One SDK. Android, iOS, React Native, Flutter, Unity. A premium reward layer for your non-paying users — live in about 10 minutes.

Get Started

Related articles