Create desktop notifications with Alpine JS 📣
npm install alpinejs-desktop-notify



This plugin extends Alpine JS to enable desktop notifications in your web
applications. With a simple API, you can create native browser notifications to
enhance user experience and engagement.
- Easy integration with Alpine JS
- Customizable notification content
- Permission checking
- Alert users of important events even when they're in another tab
- Notify users when background tasks complete
- Create reminder systems for web applications
- Enhance chat applications with new message notifications
The plugin provides a straightforward way to leverage the Web Notifications API
within the Alpine JS framework, making it easy to implement desktop
notifications without complex JavaScript.
``html
defer
src="https://unpkg.com/alpinejs-desktop-notify@latest/dist/notifications.min.js"
>
`
`shell
yarn add -D alpinejs-desktop-notify
npm install -D alpinejs-desktop-notify
`
`js
import Alpine from 'alpinejs'
import notifications from 'alpinejs-desktop-notify'
Alpine.plugin(notifications)
Alpine.start()
`
`html`
x-data
@click="$notify({ title: 'New message', body: 'Hello there 👋' })"
>
Notify
` html`
_You can also pass icon` in the object._