Skip to main content

Deep Linking in React Native

ยท 4 min read
Full Stack Developer
Last updated on May 6, 2026

deep linking in react

Deep linking lets a React Native app open directly to a specific screen from an external URL. It is useful for passwordless login links, push notifications, marketing campaigns, referral invites, order tracking, chat threads, and content shared from the web.

Quick Answerโ€‹

For most modern React Native apps, use React Navigation's linking prop on NavigationContainer, configure native URL handling on iOS and Android, and test every route from a cold start and while the app is already open.

Use a custom scheme such as myapp://orders/123 for development and internal links. Use HTTPS universal links and Android App Links for production-facing links because they are domain verified and can fall back to your website when the app is not installed.

Link typeExampleBest for
Custom schememyapp://profile/42Local testing, internal links, quick app-only flows.
iOS Universal Linkhttps://example.com/profile/42Production links on iOS with web fallback.
Android App Linkhttps://example.com/profile/42Production links on Android with domain verification.

Custom schemes are easy to set up, but they are not domain verified. For customer-facing links, use HTTPS links and prove ownership of the domain through the platform-specific association files.

Mega Bundle Sale is ON! Get ALL of our React Native codebases at 90% OFF discount ๐Ÿ”ฅ

Get the Mega Bundle

Configure React Navigationโ€‹

React Navigation handles many edge cases for you: initial links, links received while the app is already running, nested route matching, and fallback UI while it resolves the first URL.

import * as React from 'react';
import { NavigationContainer } from '@react-navigation/native';

const linking = {
prefixes: ['myapp://', 'https://example.com'],
config: {
screens: {
Home: '',
Profile: 'users/:id',
Order: 'orders/:orderId',
Settings: 'settings',
},
},
};

export function AppNavigation() {
return (
<NavigationContainer linking={linking}>
{/* your stack, tabs, or drawer navigator */}
</NavigationContainer>
);
}

Keep the route map close to your navigation tree. If you rename a screen or nest it under a new navigator, update the linking config in the same change.

Configure iOSโ€‹

For a custom URL scheme, add a URL Type in Xcode or in Info.plist:

<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>myapp</string>
</array>
</dict>
</array>

For Universal Links:

  1. Enable the Associated Domains capability in Xcode.
  2. Add a domain entry such as applinks:example.com.
  3. Host an apple-app-site-association file on your domain.
  4. Validate every incoming URL before using route parameters.

Apple calls out universal links as a potential entry point into your app, so do not let a URL perform sensitive actions directly. Open a screen, load trusted server state, and ask for confirmation when the action is destructive.

Configure Androidโ€‹

For a custom scheme, add an intent filter in the activity that hosts React Native:

<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="myapp" />
</intent-filter>

For Android App Links, use HTTPS and add domain verification:

<intent-filter android:autoVerify="true">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="https" android:host="example.com" />
</intent-filter>

Then publish the matching Digital Asset Links file at:

https://example.com/.well-known/assetlinks.json

Test both "app closed" and "app already running" states.

xcrun simctl openurl booted "myapp://users/123"
adb shell am start -W \
-a android.intent.action.VIEW \
-d "myapp://users/123" \
com.example

For production HTTPS links, test with real domains, not only local schemes. iOS and Android cache association results, so reinstall the app or reset simulator state when debugging failed domain verification.

Common Problemsโ€‹

If the app opens but the wrong screen appears, your React Navigation linking config probably does not match the navigator structure.

If Android asks which app should open the link, App Links verification is not complete or the domain is not covered by assetlinks.json.

If iOS opens Safari instead of the app, confirm the Associated Domains entitlement, the apple-app-site-association file, and the path patterns.

If the deep link contains user-controlled parameters, validate them before using them in Firestore queries, payments, profile updates, or destructive actions.

Useful Referencesโ€‹

Looking for a custom mobile application?

Our team of expert mobile developers can help you build a custom mobile app that meets your specific needs.

Get in Touch

Conclusionโ€‹

Deep linking is no longer just a navigation detail. For production apps, it is part of onboarding, notifications, marketing attribution, support workflows, and account security. Start with a small route map, add domain-verified HTTPS links before launch, and keep deep link testing in your release checklist.