React Native setup tutorial

This walkthrough reproduces the Expo example located at sdks/react-native/example-expo so you can adapt it to your own navigation stack.

Before you start

• LinkMe app with iOS + Android identifiers filled in
• Expo Router or React Navigation project running React Native 0.72+ (or Expo SDK 50+)
• Node.js 18+

1. Configure your LinkMe app

1. In the portal, open Apps → Your app.
2. Confirm the iOS bundle ID and Android package match what Expo/React Native will build.
3. Generate an API key and copy the appId and appKey.
4. Toggle Pasteboard for Deferred Links (iOS) if you install expo-clipboard.

2. Install packages

npm install @li-nk.me/react-native-sdk
npx expo install expo-clipboard # optional but recommended on iOS

Package: @li-nk.me/react-native-sdk

3. Configure Expo / linking

app.json

{
  "expo": {
    "scheme": "yourapp",
    "plugins": [
      [
        "@li-nk.me/react-native-sdk/plugin/app.plugin.js",
        {
          "hosts": ["links.yourco.com"],
          "associatedDomains": ["links.yourco.com"],
          "schemes": ["yourapp"]
        }
      ]
    ],
    "ios": { "bundleIdentifier": "com.yourco.app" },
    "android": { "package": "com.yourco.app" }
  }
}

Bare React Native projects should follow the native setup guides for Associated Domains (iOS) and App Links (Android) before continuing.

4. Initialize LinkMe in your root layout

import { useEffect } from 'react';
import { useRouter } from 'expo-router';
import {
  configure,
  getInitialLink,
  claimDeferredIfAvailable,
  onLink,
  track,
} from '@li-nk.me/react-native-sdk';

export function useLinkMe() {
  const router = useRouter();

  useEffect(() => {
    let unsubscribe: { remove: () => void } | null = null;

    (async () => {
      await configure({
        baseUrl: 'https://links.yourco.com',
        appId: process.env.EXPO_PUBLIC_LINKME_APP_ID!,
        appKey: process.env.EXPO_PUBLIC_LINKME_APP_KEY,
        debug: __DEV__,
      });

      unsubscribe = onLink((payload) => {
        if (payload?.path) router.replace(payload.path as never);
      });

      const initial = await getInitialLink();
      if (initial?.path) {
        router.replace(initial.path as never);
      } else {
        const deferred = await claimDeferredIfAvailable();
        if (deferred?.path) router.replace(deferred.path as never);
      }

      await track('open');
    })();

    return () => unsubscribe?.remove();
  }, [router]);
}

Call useLinkMe() from app/_layout.tsx (Expo Router) or inside your root navigator. If you prefer React Navigation, wire the same hook inside your navigation container and use navigation.navigate(payload.path).

5. Wire platform-specific extras

• iOS: Install expo-clipboard and enable the pasteboard toggle in the portal for deterministic first-install claims. Apple will show a one-time “pasted from…” banner—this is expected.
• Android: No extra modules needed; the SDK uses the Play Install Referrer automatically. Ensure your release keystore fingerprint is saved in LinkMe so App Links verify.

6. Run the sample app

Clone or open sdks/react-native/example-expo, copy .env.example to .env, set your keys, and run npx expo start. The example demonstrates onboarding flows, analytics tracking, and both direct/deferred routing.

Next steps

• Consult the Android and iOS SDK references for every method signature.
• Read the Deferred Deep Linking Guide to understand how the JS SDK mirrors the native behavior. // Example: Map to Firebase Analytics // analytics().logEvent('campaign_details', { // source: payload.utm.source, // medium: payload.utm.medium, // campaign: payload.utm.campaign, // term: payload.utm.term, // content: payload.utm.content, // }); } }

Deep Linking Configuration

The Expo config plugin automatically configures:

• iOS: Associated Domains (applinks:<your-domain>) and optional custom URL schemes
• Android: HTTPS App Links intent filters and optional custom schemes

No manual native configuration required.