OneSignal Push Notification Setup in React Native

Avatar photoByAdil

OneSignal Setup in React Native (Push Notification) Complete Guide

Push notification setup in React Native can feel confusing at first, especially when Firebase and OneSignal are both involved.

OneSignal uses Firebase Cloud Messaging to deliver Android notifications, so Firebase configuration is mandatory before starting.

Below is the short and correct setup flow for React Native CLI projects.

Basic requirements

A React Native CLI project already created.
Firebase project with Android app added.
Package name must match your React Native app.

Download google-services.json and place it inside: 

android/app/

Generate Firebase service account json from Firebase Service Accounts section.
This file is uploaded only in OneSignal dashboard.

Create OneSignal app

Create a new app in OneSignal dashboard.
Choose Mobile App.
Select SDK as React Native.
Upload Firebase service account json file.
Copy OneSignal App ID.

Install OneSignal SDK

npm install react-native-onesignal

Add OneSignal code

Inside App.js: 

import { useEffect } from "react";
import OneSignal from "react-native-onesignal";

useEffect(() => {
  OneSignal.setAppId("YOUR_ONESIGNAL_APP_ID");
  OneSignal.promptForPushNotificationsWithUserResponse();
}, []);

Rebuild the app

After adding Firebase and OneSignal configuration, rebuild the application. 

npx react-native run-android

Old installed app must be removed before installing new build.

Test subscribed users

Open the app once on a real device.

Go to OneSignal dashboard and click Test for subscribed users.

If device appears, setup is completed.

Final note

OneSignal push notification works smoothly in React Native when Firebase configuration and App ID are correct.

Most issues come from wrong package name, wrong json file, or missing rebuild.

Full step by step guide

For the complete setup including OneSignal dashboard flow, Firebase service account json, rebuild process, and troubleshooting, check the full guide on our this blog: Onesignal Setup Complete Guide

Similar Posts