Beginners guide to Web Push Notifications

Beginners guide to Web Push Notifications

If you use a smartphone you will have come across Push notifications several times. The same philosophy that underlies these notifications is also present in modern browsers.

Let's now see a panoramic to everything you need to get started.

Website (Frontend)

First we need to ask the user to allow the use of notifications. If the user agrees, the browser will provide us with useful information to be able to subsequently send the notifications.

Once you have this information available, you will have to send it to your backend server for it to be saved or updated.

This is an example in JavaScript code useful for this purpose:

Server (Backend)

On your backend server you will need to create the necessary APIs for your website to send you the user's subscription data. Furthermore you will have to create the logics to be able to send, when necessary, your notification to all registered users.

This is an example written in GO to be able to send notifications to your users:

Service Worker

When your backend server sends a notification request, it will be taken over by your Service Worker. In addition to receiving the notification, the Worker takes care of all the logics for its management, from visualization to interaction.

This is a simple example of a Service Worker:

Conclusions

This introduction only wants to provide an overview of the notions needed to add a notification system to your website. For those wishing to learn more .