How to set up push notifications for a React Native app
You will learn
Learn about using Klaviyo’s React Native SDK to send mobile push notifications.
What is an SDK?
An SDK provides all the necessary tools, libraries, and programs so that your app can talk to a third-party software (e.g., like a mobile push provider). The SDK framework must match the framework used to build your app.
What is React Native?
React Native is a hybrid framework that allows you to create mobile apps for both iOS and Android. It is written in JavaScript and allows you to utilize a single code base for both platforms. React Native apps look like any other apps.
Klaviyo’s React Native SDK allows you to connect Klaviyo to apps built with React Native.
Before you begin
Before you can set up push notifications for your React Native app, you must:
- Have your own React Native app for iOS, Android, or both.
- Install the React Native SDK in your mobile app.
You will also need to set up parts of the native iOS SDK and Android SDK where applicable as noted in the React Native SDK documentation.
Set up push notifications
Once you fulfill the requirements above, you have to connect Klaviyo to your iOS and Android apps.
For instructions on how to do so, see our setup guides for:
Test sending a push notification
After you have configured push notifications in your Klaviyo account and have confirmed that the Klaviyo React Native SDK is installed in your mobile app:
- Log into your mobile app, ideally with an email address or phone number that will make it easy to find your profile in Klaviyo.
- If prompted, enabled push notifications for your app. If you are not prompted, confirm that push notifications are enabled for the app in your device’s settings app.
- In Klaviyo, go to Audience > Profiles and find your test profile.
- Under Channel Consent, confirm that your profile is subscribed to mobile push notifications.
- Create a list or segment with only your profile.
- Send a push notification campaign to that list or segment.
- Confirm that the notification appears on the device.
- Tap the notification on your device to open your app.
- Check your profile’s Activity feed to confirm that you see both a Received Push event and an Opened Push event.
Troubleshooting
- Why do I not see a push token on my profile in Klaviyo? Similar to an email address for emails, push notifications are sent to push tokens. Your mobile app needs to forward a device’s push token to Klaviyo for you to be able to send push notifications to that device. Confirm with your app developer that they have implemented the code outlined in the Push Notifications section of our SDK documentation.
- Why are images not displaying for iOS push notifications? Rich media displays on iOS only if you add the Notification Service Extension to your app. Confirm with your app developer that they have implemented the code outlined in the Rich Notifications section of our SDK documentation.
- Why am I not seeing Opened Push events even when I tap on a notification? You need to add code to your mobile app to track Opened Push events in Klaviyo. Klaviyo can automatically handle this code for you, or your developer can manually add this code. Confirm with your app developer that they have implemented the code outlined in the Push Notifications section of our SDK documentation.
Additional resources
- Lean about push notification consent
- Learn how to use push notifications for campaigns.
- Check out how to use deep links in push notifications.
Additional resources
- How to set up iOS push notifications
Learn how to set up push notifications in your Klaviyo account. After you've completed the steps in this article you'll be able to send push notifications in your flows and campaigns.
- How to set up Android push notifications
Learn how to set up push notifications for Android in your Klaviyo account. After you've completed the steps in this article you'll be able to send push notifications in your flows and campaigns.
- Introduction to mobile push notifications
Get familiar with mobile push notifications, including what they are, what they look like, and what information you need to start sending.