The Browser Notification API

Connect to your users OS-level notifications using Javascript

Ever wonder how to generate browser notifications that appear in the top-right of the browser, like this one?

Demo notification modal — macOS

You can accomplish this using the Javascript Notification API, a few simple methods that together allow you to control permissions and other options for your notification. The browser transfers your notification to your users operating system, allowing the notification to persist even when the browser window is closed. The notification itself can be created quite easily, in just a few lines of code.

This will generate a basic notification, if you’ve already granted permission to show notifications to this browser window. If not, it will do nothing. So how do we ask the browser for permission to show notifications? We’ll use the notification.requestPermission() method, which triggers a modal asking for the user’s permission to show notifications.

It returns a promise that resolves once the user has made their decision whether to allow or deny your…