PHPackages                             jonnx/laravel-pwa - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. jonnx/laravel-pwa

ActiveLibrary[Utility &amp; Helpers](/categories/utility)

jonnx/laravel-pwa
=================

turn your laravel application into a progressive web app

1.1.0(4mo ago)06.6k—0.7%MITBlade

Since Dec 5Pushed 4mo agoCompare

[ Source](https://github.com/Jonnx/laravel-pwa)[ Packagist](https://packagist.org/packages/jonnx/laravel-pwa)[ RSS](/packages/jonnx-laravel-pwa/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (2)Dependencies (3)Versions (4)Used By (0)

Laravel PWA Package
===================

[](#laravel-pwa-package)

Turn your Laravel application into a Progressive Web App (PWA) with push notifications and more.

Dependencies
------------

[](#dependencies)

Installation
------------

[](#installation)

1. **Install the package via Composer:**

```
composer require jonnx/laravel-pwa
```

2. Add Push Subscription Trait to User Model

```
use NotificationChannels\WebPush\HasPushSubscriptions;
...
class User extends Authenticatable
{
    use HasPushSubscriptions

```

3. **Publish the config and components:**

```
php artisan vendor:publish --force --tag=laravel-pwa-config
php artisan vendor:publish --force --tag=laravel-pwa-components
php artisan webpush:vapid
php artisan vendor:publish --provider="NotificationChannels\WebPush\WebPushServiceProvider" --tag="migrations"
php artisan migrate
```

Usage
-----

[](#usage)

- Add the PWA head and scripts to your layout:

```
@laravelPwaHead
@laravelPwaScripts
```

### PWA Install Banners

[](#pwa-install-banners)

This package provides two install banners to help users install your PWA:

- `` — Displays a banner and prompts the user to install the app using the browser's native install prompt (supported in Chrome, Edge, and most Android browsers). The banner only appears if the app is not already installed and the browser supports the install prompt.
- `` — Displays a banner with manual installation instructions for browsers that do not support the native install prompt (such as Safari on iOS and macOS). The banner automatically detects the user's platform and provides tailored instructions (e.g., "Add to Home Screen" for iOS, "Add to Dock" for macOS Safari).

Include these components in your layout to provide a seamless install experience for all users:

```

```

### Push Notification Setup

[](#push-notification-setup)

#### Vapid Keys

[](#vapid-keys)

To enable push notifications, you need to generate VAPID API keys:

```
php artisan webpush:vapid
```

This will generate the required keys and update your `.env` and `config/pwa.php` files. Make sure to configure your environment and PWA settings accordingly.

#### User Model Push Subscription Trait

[](#user-model-push-subscription-trait)

This trait automatically establishes the relationship from the user model to many push subscriptions. This way a user can opt-in to push notifications on multiple devices and receive notifications everywhere.

```
use NotificationChannels\WebPush\HasPushSubscriptions;
...
class User extends Authenticatable
{
    use HasPushSubscriptions

```

#### Web Push Subscription Handler

[](#web-push-subscription-handler)

Use the push notification subscription handler Livewire component. This captures the subscription data and automatically saves it to the user on the back-end so that you can use the subscription to send notifications anytime.

```
@livewire('push-notification-subscription-handler')
```

#### User Permission Banner

[](#user-permission-banner)

Push notifications require active user opt-in on all browsers. Include this components in your layout to provide a seamless opt-in experience.

```

```

#### Testing Push Notifications

[](#testing-push-notifications)

To simplify testing and debugging during setup, this package provides a component to test push notifications with. Include this component in any of your pages and click the button. A test push notification should appear on each of your user's subscribed devices.

Here is how it works:

- The component renders a simple button.
- When clicked, it triggers the `sendTestNotification` method in its Livewire class.
- The method sends a test push notification to all devices currently subscribed for the authenticated user.
- This allows you to verify that push notification setup, browser permissions, and subscription storage are working correctly.

```
@livewire('push-notification-test-button')
```

#### Creating Your Own Push Notifications

[](#creating-your-own-push-notifications)

##### Simple

[](#simple)

This package provides a helper class you can use to create your own notifications quickly. the service worker is already setup to open the url on the user's device when they click the notification.

```
$user->notify(new Notification(
    title: 'Test Push Notification',
    body: 'This is a test push notification from Laravel PWA package. Clicking it will take you to the settings page.',
    openUrl: url('/settings')
));

```

##### Advanced

[](#advanced)

The class we provide is just a simplified wrapper around `DeclarativeWebPushMessage`. To learn more about this, checkout the documentation here:

Customizing Banner Components
-----------------------------

[](#customizing-banner-components)

The setup steps publish the banner components to a folder in your project so you can easily tweak appearance, position and more. The files are located in the `resources/views/pwa` folder.

Major Library Dependencies
--------------------------

[](#major-library-dependencies)

LibraryPurpose[laravel/webpush](https://github.com/web-push-libs/laravel-web-push)Handles browser push notifications, VAPID key management, and subscription storage.[livewire/livewire](https://laravel-livewire.com/)Enables reactive components for subscription handling and real-time UI updates.[alpinejs](https://alpinejs.dev/)Provides lightweight frontend interactivity for banners and install prompts.[notification-channels/webpush](https://github.com/laravel-notification-channels/webpush)Adds push notification support to Laravel's notification system.These libraries are required to:

- Manage push notification subscriptions and permissions.
- Provide real-time, interactive UI components for banners and prompts.
- Integrate with browser APIs for PWA installation and notifications.

---

For more details, see the package documentation or open an issue if you need help.

Contributing
------------

[](#contributing)

Contributions are welcome! To contribute to this package:

1. Fork the repository and create your branch from `main`.
2. Make your changes, following PSR standards and best practices.
3. Add or update tests as needed.
4. Submit a pull request with a clear description of your changes.

If you have ideas, feature requests, or find bugs, please open an issue.

###  Health Score

39

—

LowBetter than 86% of packages

Maintenance77

Regular maintenance activity

Popularity25

Limited adoption so far

Community6

Small or concentrated contributor base

Maturity37

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~39 days

Total

2

Last Release

124d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/223ceec567c8ac8fba483b2c9d52f538ea0d9a1cb02a90dc5d75e933df164663?d=identicon)[Jonnx](/maintainers/Jonnx)

---

Top Contributors

[![Jonnx](https://avatars.githubusercontent.com/u/1399475?v=4)](https://github.com/Jonnx "Jonnx (105 commits)")

### Embed Badge

![Health badge](/badges/jonnx-laravel-pwa/health.svg)

```
[![Health](https://phpackages.com/badges/jonnx-laravel-pwa/health.svg)](https://phpackages.com/packages/jonnx-laravel-pwa)
```

###  Alternatives

[livewire/flux

The official UI component library for Livewire.

9475.0M86](/packages/livewire-flux)[livewire/volt

An elegantly crafted functional API for Laravel Livewire.

4205.3M84](/packages/livewire-volt)[jantinnerezo/livewire-alert

This package provides a simple alert utilities for your livewire components.

8041.2M20](/packages/jantinnerezo-livewire-alert)[leandrocfe/filament-apex-charts

Apex Charts integration for Filament PHP.

4861.2M8](/packages/leandrocfe-filament-apex-charts)[spatie/laravel-livewire-wizard

Build wizards using Livewire

4061.0M4](/packages/spatie-laravel-livewire-wizard)[spatie/laravel-dashboard

A dashboard for Laravel

568156.1k94](/packages/spatie-laravel-dashboard)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
