Overview

We are using Expo Push Notifications to send push notifications to your users.

Setup

Actually I handled this in codebase. If you interested, you can go to the @/hooks/usePushNotifications.ts file.

With this hook, your user can get notifications in background, on lock screen, and in notification center automatically.

You don’t need to do anything else but I want to give you some hints:

1

Go to your @/hooks/usePushNotifications file. You’ll see bunch of codes. But Important part is:

    const { expoPushToken, sendPushNotification, notification } = usePushNotification();
2

expoPushToken is your user’s push token. You can use this token to send push notifications to your user.

3

sendPushNotification is a function to send push notifications to your user.

4

notification is a hook to get the notification data.

Types

import * as Notifications from 'expo-notifications';

interface PushNotificationReturnType {
  expoPushToken: string | undefined;
  notification: Notifications.Notification | null;
  sendPushNotification: (expoPushToken: string) => Promise<void>;
}

Advanced

If you want to send advanced notifications, you should create Supabase Edge Functions. Let me tell you step by step. But I am not going to code this in this documentation. Because it is project specific.

1

I assumed you already set up Supabase and created your tables. Such as profiles, likes, comments, etc.

2

Go to Supabase Edge Function documentation. Which is: Supabase Edge Functions.

3

Click Get Started button and open your terminal.

    supabase init

You should have Supabase CLI installed. If you don’t have, follow the documentation.

4

Then you need to create a new Edge Function. Like:

    supabase functions new send-push-notification
5

Open your supabase/functions/send-push-notification folder. And you will see the index.ts file.

6

Now we need to integrate with Expo Push Notifications. You can follow this link: Sending Notifications

7

If you got stuck, you can watch this video:

8

Now you can use Edge Functions and send push notifications to your users.

Don’t forget to use webhooks.