Skip to content

Push notifications

This document provides a comprehensive guide on how to implement push notifications in your application. Push notifications are messages sent by a server to a client application, typically used to inform users about updates, reminders, or other important information.

FCM Setup

To set up Firebase Cloud Messaging (FCM) for push notifications, follow these steps:

  1. Create a Firebase Project: Go to the Firebase Console and create a new project. Opt-out all analytics features if you do not need them.
  2. Add Firebase to Your App: Add web app to your Firebase project and register your app.
  3. Obtain FCM Credentials: Navigate to Project Settings > Service Accounts > Firebase Admin > Generate new private key. Download the JSON file and store it securely.
  4. Set env variable GOOGLE_APPLICATION_CREDENTIALS to the path of the downloaded JSON file.
  5. Generate WebPush certificate: Set it as FCM_APP_VAPID_KEY env variable.
  6. Grab other config values: Grab other config values from Project Settings > General > Your apps > Firebase SDK snippet > Config and set them as env variables:
  7. FCM_APP_API_KEY
  8. FCM_APP_AUTH_DOMAIN
  9. FCM_APP_STORAGE_BUCKET
  10. FCM_APP_PROJECT_ID
  11. FCM_APP_MESSAGING_SENDER_ID
  12. FCM_APP_APP_ID
  13. FCM_APP_MEASUREMENT_ID

Django Integration

To integrate FCM with your Django application, you can use the fcm-django package. Follow these steps:

  1. Install the Package: Run the following command to install fcm-django:
uv add fcm-django

  1. Update settings.py: Add fcm_django to your INSTALLED_APPS in settings.py:

  2. Initialize Firebase: Add the following code to your settings.py to initialize Firebase:

from firebase_admin import initialize_app

FIREBASE_APP = initialize_app()
FCM_DJANGO_SETTINGS = {
    "DELETE_INACTIVE_DEVICES": True,
}

Flow

  • User logs in to the platform.
  • The client applications retrieve a token from FCM.
  • The client sends the token to the backend to create or update a device entry in the database.
  • The client registers a service worker to handle incoming push notifications.

Handling Push Notifications in the Client

Foreground Notifications

When the app is open and in focus, push messages are handled using the onMessage method from Firebase Messaging. In main app component App.tsx.

Background Notifications

When the app is in the background or closed, push messages are handled by the service worker (firebase-messaging-sw.js). The service worker listens for background messages and displays system notifications to the user.

This setup ensures users receive notifications whether the app is active or not.

App notifications

App notifications are used to inform users about various events within the application. These notifications can be triggered by different actions, such as receiving a new message, a job update, or other relevant activities.

Internal notifications

To ensure event driven data refetch on the client side we use internal notifications. They are sent via FCM data messages and handled in the app code. For example when a new message is created in a conversation we send an internal notification type SYNC_MESSAGES to all conversation participants except the author of the message. The client app listens for these notifications and triggers data refetch when such notification is received.