How can we help?

Overview

Expo is a widely-used framework for building React Native applications. The Cordial Expo SDK simplifies the process of developing, building, and deploying mobile apps across iOS and Android apps that have been developed with the Expo framework.

1. Install the React Native SDK

Add the React Native SDK to your project by running the following command:

npm install @cordialinc/react-native-sdk

2. Install the Cordial Expo SDK

Add the Cordial Expo SDK to your project by running the following command:

expo install @cordialinc/expo-module

3. Install additional dependencies

Install additional dependencies required for notifications:

expo install expo-notifications

4. Configuration

Add the necessary configurations to your app.json file:

{
  "expo": {
    "ios": {
      "bundleIdentifier": "com.you.app.bundleIdentifier",
      "entitlements": {
        "com.apple.developer.usernotifications.time-sensitive": true
      },
      "associatedDomains": [
          "domain1.com"
      ]
    },
    "android": {
      "googleServicesFile": "./assets/google-services.json",
      "intentFilters": [
          {
            "autoVerify": true,
            "action": "VIEW",
            "data": {
              "scheme": "https",
              "host": "domain1.com"
            },
            "category": [
              "BROWSABLE", "DEFAULT"
            ]
          }
        ]
    },
    "plugins": [
      [ "@cordialinc/expo-module",
        {
          "accountKey": "your_account_key",
          "channelKey": "your_channel_key",
          "eventsStreamURL": "your_events_stream_url",
          "messageHubURL": "your_message_hub_url",
          "vanityDomains": [
            "domain1.com"
          ],
          "androidPackage": "com.your.app.package"
        }
      ]
    ]
  }
}

Key/value definitions

• accountKey - Cordial account key.
• channelKey - Key of the mobile channel within the Cordial account.
• eventsStreamURL, messageHubURL - The URLs to connect to Cordial. Reach out to your CSM for these URLs.
• associatedDomains - Required for the app to open deep links from specified domains on iOS.
• intent-filters - Required for the app to open deep links from specified domains on Android.
• googleServicesFile - The path to your google-services.json that connects to the Firebase project for Android.
• vanityDomains - A list of tracking domains Cordial uses to wrap the deep links.
• androidPackage - your Android app's package.
• ios.bundleIdentifier - your iOS app's bundle identifier.

5. Use the SDK from JS/TS

For further instructions on how to use the SDK from the JavaScript/TypeScript part of your app, visit our React Native SDK documentation.

Explicitly specify React Native SDK and native SDKs versions

By default, Expo SDK will use the latest versions of React Native SDK, iOS SDK and Android SDK. If you need to specify explicitly which version to use, follow the instructions below.

Expo SDK

Update the application’s package.json:

"@cordialinc/expo-module": "1.0.0"

React Native SDK

Update the application's package.json:

"@cordialinc/react-native-sdk": "1.6.1"

Native Android SDK

Add androidSdkVersion to the application’s app.json:

{
  "expo": {
    ...
    "plugins": [
      ...
      [
        "@cordialinc/expo-module",
        {
          ...
          "androidSdkVersion": "4.17.0"
        }
      ]
    ]
  }
}

Native iOS SDK

Add iosSdkVersion to the application's app.json:

{
  "expo": {
    ...
    "plugins": [
      ...
      [
        "@cordialinc/expo-module",
        {
          ...
          "iosSdkVersion": "4.7.1"
        }
      ]
    ]
  }
}

Configure Android push notification icon

1. Add the icon to the app's assets folder. The file should be either xml or png.
2. Configure the icon in app.json:

{
     "expo": {
       ...
       "plugins": [
         ...
         [
           "@cordialinc/expo-module",
           {
             ...
             "androidPushNotificationIcon": "icon_file.png" // or "file.xml"
           }
         ]
       ]
     }
}

SDK compatibility matrix

Refer to the sections above for instructions on setting each SDK version in your app.