With Firebase Cloud Messaging example

To demo how to implement firebase cloud messaging to send web push notification in next.js.

How to use

Using `create-next-app`

Execute create-next-app with npm or Yarn to bootstrap the example:

npm init next-app --example with-firebase-cloud-messaging with-firebase-cloud-messaging-app
# or
yarn create next-app --example with-firebase-cloud-messaging with-firebase-cloud-messaging-app

Download manually

Download the example:

curl https://codeload.github.com/vercel/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-firebase-cloud-messaging
cd with-firebase-cloud-messaging

Install it and run:

npm install
npm run dev
# or
yarn
yarn dev

Set your send id

set your messagingSenderId in static/firebase-messaging-sw.js and utils/webPush.js

Deploy it to the cloud with Vercel (Documentation).

How to send a notification

https://firebase.google.com/docs/cloud-messaging/js/first-message,

1.3 KiB Raw Blame History