# Expo Deep Linking with Redirectly

> Add deferred deep linking to Expo apps with Redirectly. Configure deep links in app.json, set up EAS Build, and handle link events with TypeScript examples.

- Canonical: https://redirectly.app/integrations/expo
- Site: [Redirectly](https://redirectly.app) — deferred deep linking for Flutter & React Native

Complete guide to implementing deferred deep linking in Expo apps. Learn how to configure app.json, set up EAS Build, and handle deep link events with TypeScript code examples.

## How Redirectly works with Expo

Redirectly provides deferred deep linking for Expo apps by handling the link resolution server-side. When users click a Redirectly link before your app is installed, Redirectly tracks the install attribution and delivers the deep link to your app on first launch—no native code required.

### Why Expo developers choose Redirectly

- **No native code:** Works with Expo Go and EAS builds
- **Deferred linking:** Capture installs and route users to the right screen
- **Real-time analytics:** Track which links drive installs and usage
- **Custom subdomains:** Use your own domain for branded links

### Typical implementation flow

1. User clicks a Redirectly link before installing your app
2. Redirectly captures the install event and stores the deep link data
3. User installs and launches your app
4. Your app fetches deep link data from Redirectly and navigates accordingly

## Configure app.json for deep linking

First, configure your app.json to handle deep links. This tells Expo which domain scheme to listen for.

```jsonc
// app.json
{
  "expo": {
    "name": "MyApp",
    "slug": "myapp",
    "scheme": "myapp",
    "plugins": [
      [
        "expo-redirect-scheme",
        {
          "scheme": "myapp",
          "prefix": "https://myapp.redirectly.app/"
        }
      ]
    ]
  }
}
```

Replace `myapp` with your app name and `myapp.redirectly.app` with your Redirectly subdomain.

## EAS Build setup for production

When using EAS Build, you need to configure deep linking for both iOS and Android using eas.json and native configuration.

```text
// eas.json
{
  "build": {
    "production": {
      "ios": {
        "buildType": "app-store",
        "scheme": "myapp"
      },
      "android": {
        "buildType": "app-bundle"
      }
    }
  }
}

// ios/Podfile - add to post_install
post_install do |installer|
  installer.pods_project.targets.each do |target|
    target.build_configurations.each do |config|
      config.build_settings['GCC_PREPROCESSOR_DEFINITIONS'] ||= [
        '$(inherited)',
        'REDIRECT_SCHEME=myapp://'
      ]
    end
  end
end
```

## Handle deep links with TypeScript

Set up event listeners to handle deep links when your app launches or is already running.

```typescript
// hooks/useDeepLinking.ts
import { useEffect } from 'react'
import * as Linking from 'expo-linking'

interface DeepLinkData {
  path: string
  params: Record<string, string | string[]>
}

export function useDeepLinking(
  onDeepLink: (data: DeepLinkData) => void
) {
  useEffect(() => {
    // Handle initial URL (app launched from cold state)
    const getInitialURL = async () => {
      const url = await Linking.getInitialURL()
      if (url != null) {
        const { hostname, path, queryParams } =
          Linking.parse(url)
        onDeepLink({
          path: path || '/',
          params: queryParams || {}
        })
      }
    }

    getInitialURL()

    // Handle URL when app is already running
    const listener = Linking.addEventListener(
      'url',
      ({ url }) => {
        const { path, queryParams } = Linking.parse(url)
        onDeepLink({
          path: path || '/',
          params: queryParams || {}
        })
      }
    )

    return () => listener.remove()
  }, [onDeepLink])
}
```

Then use this hook in your main app component to handle navigation:

```tsx
// App.tsx
import { useDeepLinking } from './hooks/useDeepLinking'
import { NavigationContainer } from '@react-navigation/native'

export default function App() {
  useDeepLinking(({ path, params }) => {
    // Navigate to the deep linked screen
    console.log('Deep link received:', { path, params })

    // Example: product/123 → navigate to ProductScreen
    if (path?.startsWith('product/')) {
      const productId = path.split('/')[1]
      navigation.navigate('ProductScreen', { id: productId })
    }
  })

  return (
    <NavigationContainer linking={linking}>
      {/* Your app navigation */}
    </NavigationContainer>
  )
}
```

## Key benefits & best practices

### Trackable marketing campaigns

Create distinct Redirectly links for each marketing channel. Measure which campaigns drive the most installs and re-engagements. Track attribution data in your Redirectly dashboard.

### Referral programs

Use deep link parameters to track referrer IDs. When a user installs via a referral link, your app receives the referrer information and can update their profile accordingly.

### Email verification flows

Send email verification links that automatically open your app and confirm the email. Deep link parameters carry the verification token, no manual copy-paste needed.

### Password reset & magic links

Create secure reset links that deep link directly to the reset flow. Redirectly handles deferred linking so users see the reset screen even on first install.

## Next steps

Ready to add deferred deep linking to your Expo app?

- [Flutter Deferred Deep Linking Guide](https://redirectly.app/flutter-deferred-deep-linking.md)
- [React Native Deep Linking](https://redirectly.app/react-native-deferred-deep-linking.md)
- [All Redirectly Integrations](https://redirectly.app/integrations.md)
- [Deep Linking for Onboarding](https://redirectly.app/blog/app-onboarding-deferred-deep-linking.md)

---

Full site index for AI agents: https://redirectly.app/llms.txt