Skip to main content

Getting Started

Requirements

  • React Native: 0.60+
  • Node.js: 16+
  • TypeScript: 4.0+ (optional but recommended)
  • iOS: iOS 12.0+
  • Android: API level 21+

Install the SDK

Install the package using npm or yarn:
npm install gameball-react-native@^3.1.0

Install Dependencies

The SDK depends on react-native-webview for the profile widget. Install it:
npm install react-native-webview

iOS Setup

Navigate to the iOS folder and install pods:
cd ios && pod install && cd ..
Make sure your iOS deployment target is at least 12.0 in ios/Podfile:
platform :ios, '12.0'

Android Setup

Ensure INTERNET permission is declared in android/app/src/main/AndroidManifest.xml:
<uses-permission android:name="android.permission.INTERNET" />
Your android/app/build.gradle should have minimum SDK version 21:
android {
    defaultConfig {
        minSdkVersion 21
        targetSdkVersion 34
    }
}

ProGuard Configuration (Android)

If using ProGuard, add to android/app/proguard-rules.pro:
-keep class com.gameballsdk.** { *; }
-keepnames class * extends com.gameballsdk.**
-dontwarn com.gameballsdk.**

Metro Configuration

Add to your metro.config.js:
const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');

const config = {
  resolver: {
    assetExts: ['bin', 'txt', 'jpg', 'png', 'json', 'woff', 'woff2', 'ttf', 'otf'],
  },
};

module.exports = mergeConfig(getDefaultConfig(__dirname), config);

Verify Installation

Import the package in your code to verify:
import { GameballApp } from 'gameball-react-native';
If there are no import errors, you’re ready to initialize the SDK!

Troubleshooting

Common Issues

Symptoms: Profile widget doesn’t appear when calledSolutions:
  • Ensure react-native-webview is properly installed and linked
  • Check that the API key is valid and the customer is initialized
  • Verify network connectivity
  • Check console for error messages
Symptoms: Pod installation or build failuresSolutions:
  • Clean build folder: cd ios && xcodebuild clean
  • Reinstall pods: cd ios && pod install --repo-update
  • Ensure iOS deployment target is at least 12.0
  • Try pod deintegrate && pod install
Symptoms: Gradle build failuresSolutions:
  • Clean gradle cache: cd android && ./gradlew clean
  • Verify minimum SDK version is 21
  • Check React Native version compatibility
  • Ensure all dependencies are properly installed
Symptoms: Type definition errorsSolutions:
  • Ensure TypeScript version is 4.0+
  • Run npx tsc --noEmit to check type errors
  • Verify type definitions are imported correctly
  • Clear TypeScript cache if needed
Symptoms: Asset loading errors or bundling failuresSolutions:
  • Clear Metro cache: npx react-native start --reset-cache
  • Ensure Metro configuration includes necessary asset extensions
  • Check metro.config.js configuration

Debug Logging

For detailed debug logging during development:
# iOS
npx react-native run-ios --verbose

# Android
npx react-native run-android --verbose
Use the --verbose flag when running your app to see detailed SDK logs and network operations during development.

Next Steps