Push Notifications in React Native: The Complete 2026 Guide

npx expo install expo-notifications expo-device expo-constants
eas build --profile development --platform ios

import * as Notifications from 'expo-notifications';
import * as Device from 'expo-device';
import Constants from 'expo-constants';
import { Platform } from 'react-native';

export async function registerForPushNotificationsAsync() {
  if (!Device.isDevice) throw new Error('Physical device required');

  if (Platform.OS === 'android') {
    await Notifications.setNotificationChannelAsync('default', {
      name: 'Default',
      importance: Notifications.AndroidImportance.HIGH,
      vibrationPattern: [0, 250, 250, 250],
    });
  }

  const { status: existing } = await Notifications.getPermissionsAsync();
  let final = existing;
  if (existing !== 'granted') {
    const { status } = await Notifications.requestPermissionsAsync();
    final = status;
  }
  if (final !== 'granted') throw new Error('Permission denied');

  const projectId = Constants.expoConfig?.extra?.eas?.projectId;
  return (await Notifications.getExpoPushTokenAsync({ projectId })).data;
}

import { Expo } from 'expo-server-sdk';

const expo = new Expo();

export async function sendPush(tokens: string[], title: string, body: string) {
  const messages = tokens
    .filter(Expo.isExpoPushToken)
    .map((to) => ({ to, sound: 'default', title, body, data: { url: '/inbox/42' } }));

  const chunks = expo.chunkPushNotifications(messages);
  for (const chunk of chunks) {
    await expo.sendPushNotificationsAsync(chunk);
  }
}

npm install @react-native-firebase/app @react-native-firebase/messaging
cd ios && pod install

import messaging from '@react-native-firebase/messaging';
import { Platform, PermissionsAndroid } from 'react-native';

export async function registerForPushNotifications() {
  if (Platform.OS === 'android' && Platform.Version >= 33) {
    await PermissionsAndroid.request(
      PermissionsAndroid.PERMISSIONS.POST_NOTIFICATIONS,
    );
  }
  const status = await messaging().requestPermission();
  if (status === messaging.AuthorizationStatus.DENIED) {
    throw new Error('Permission denied');
  }
  return messaging().getToken();
}

import { GoogleAuth } from 'google-auth-library';

async function getAccessToken() {
  const auth = new GoogleAuth({
    keyFile: 'service-account.json',
    scopes: ['https://www.googleapis.com/auth/firebase.messaging'],
  });
  const client = await auth.getClient();
  const { token } = await client.getAccessToken();
  return token;
}

export async function sendFcmV1(token: string, title: string, body: string) {
  const accessToken = await getAccessToken();
  const projectId = process.env.FIREBASE_PROJECT_ID;

  const res = await fetch(
    `https://fcm.googleapis.com/v1/projects/${projectId}/messages:send`,
    {
      method: 'POST',
      headers: {
        Authorization: `Bearer ${accessToken}`,
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        message: {
          token,
          notification: { title, body },
          data: { url: '/inbox/42' },
          android: { priority: 'HIGH', notification: { channel_id: 'default' } },
          apns: { payload: { aps: { sound: 'default', 'interruption-level': 'time-sensitive' } } },
        },
      }),
    },
  );
  return res.json();
}

import notifee, { AndroidStyle, AndroidImportance } from '@notifee/react-native';
import messaging from '@react-native-firebase/messaging';

messaging().setBackgroundMessageHandler(async (msg) => {
  const channelId = await notifee.createChannel({
    id: 'chat',
    name: 'Chat',
    importance: AndroidImportance.HIGH,
  });

  await notifee.displayNotification({
    title: msg.data?.title,
    body: msg.data?.body,
    android: {
      channelId,
      style: {
        type: AndroidStyle.MESSAGING,
        person: { name: msg.data?.sender, icon: msg.data?.avatar },
        messages: [{ text: msg.data?.body, timestamp: Date.now() }],
      },
      actions: [
        { title: 'Reply', pressAction: { id: 'reply' }, input: true },
        { title: 'Mark read', pressAction: { id: 'mark-read' } },
      ],
    },
  });
});

const lastResponse = Notifications.useLastNotificationResponse();
useEffect(() => {
  const url = lastResponse?.notification.request.content.data?.url;
  if (url) router.push(url);
}, [lastResponse]);

useEffect(() => {
  messaging().getInitialNotification().then((msg) => {
    if (msg?.data?.url) router.push(msg.data.url);
  });
}, []);