Skip to content

soundgym/react-native-kakao-ad

Repository files navigation

RNKakaoAd NPM version NPM downloads

react-native-kakao-ad

React-Native KakaoAd SDK, (Not official)

Setup

  • Android

Add below dependencies to your project/android/build.gradle

allprojects {
    repositories {
+       google()
+       jcenter()
+       maven { url 'https://devrepo.kakao.com/nexus/content/groups/public/' }
    }
}

How to use

import React from "react";
import { TouchableOpacity, AppState, AppStateStatus, Platform } from "react-native";
import KakaoAd, { CurrencyCode } from "react-native-kakao-ad";

const App = () => {
    const appState = React.useRef<AppStateStatus>(AppState.currentState);
    
    React.useEffect(() => {
        KakaoAd.init("your-track-id");
        AppState.addEventListener("change", appStateHandler);
        
        return () => AppState.removeEventListener("change", appStateHandler);
    }, []);
    
    const appStateHandler = (nextAppState: AppStateStatus) => {
        if (appState.current.match(/inactive|background/) && nextAppState === "active") {
            Platform.OS === "ios" && KakaoAd.activate();
        }
        
        appState.current = nextAppState;
    };

    const logAllEvents = () => {
        KakaoAd.logRegistration();
        KakaoAd.logSearch({ searchString: "search-test" });
        KakaoAd.logViewContent({ contentId: "test-id" });
        KakaoAd.logViewCart();
        KakaoAd.logSignUp();
        KakaoAd.logPurchase({ currency: CurrencyCode.KRW }, [{ name: "test", price: 100, quantity: 1 }]);
    };

    return <TouchableOpacity style={{ width: 300, height: 300, backgroundColor: "green" }} onPress={logAllEvents} />;
};