Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Laravel PWA Kit makes Laravel 8–12 apps installable, offline-ready, fast, and fully-featured Progressive Web Apps.

License

Notifications You must be signed in to change notification settings

devrabiul/laravel-pwa-kit

Laravel PWA Kit – Laravel to PWA in Minutes

Laravel PWA Kit is a powerful, easy-to-use Laravel package that transforms your web applications into Progressive Web Apps (PWAs). With this package, your Laravel apps can be installable, offline-ready, fast, and engaging, without writing complex service worker logic manually.

Latest Stable Version Total Downloads Monthly Downloads GitHub license Buy us a tree GitHub Repo stars


✨ Features

  • ⚙️ Automatic Manifest & Service Worker Generation – No manual setup needed.
  • 📲 Add-to-Home-Screen Install Prompt – Fully configurable toast notification.
  • 🖥️📱 Responsive & Cross-Platform – Works on mobile, tablet, and desktop.
  • 🔄 Laravel 8.x → 12.x Compatible – Supports latest Laravel versions.
  • 🛠️ Customizable – Modify icons, theme colors, app name, shortcuts via config.
  • Offline Ready – Supports offline pages and caching strategies.
  • 🔐 HTTPS Ready – Fully compatible with HTTPS-secured applications.
  • 🧩 Livewire & SPA Friendly – Works out-of-the-box with Livewire v3, Vue 3, and React.
  • 🌱 Treeware Package – Support environmental initiatives by contributing to tree planting.

🚀 Live Demo

👉 Try the Live Demo

Live Demo Thumbnail


🖼️ Screenshots / Demo

See Laravel PWA Kit in action:

install-toast.png offline-page.png installed-pwa.png

Descriptions:

  • Install Toast Prompt – The prompt displayed when users can add your app to the home screen.
  • Offline Page – Shown when the user is offline.
  • Installed PWA – Your Laravel app running as an installable Progressive Web App.

Live Demo: https://packages.rixetbd.com/laravel-pwa-kit


⚠️ Important

PWAs require HTTPS to work correctly. Make sure your application is hosted with HTTPS; otherwise, service workers and other PWA features will not function properly.

Note: For local development, you can use php artisan serve. Browsers allow service workers on localhost over HTTP, so you can test your PWA without HTTPS during development.


📦 Installation

Install via Composer:

composer require devrabiul/laravel-pwa-kit

Publish configuration and assets:

php artisan vendor:publish --provider="Devrabiul\PwaKit\PwaKitServiceProvider"

This publishes:

  • config/laravel-pwa-kit.php
  • manifest.json, sw.js, offline.html, and logo.png to both public and base directories.

⚙️ Configuration

Edit config/laravel-pwa-kit.php to customize your PWA:

return [
 'enable_pwa' => true,
 'install-toast-show' => true,
 'manifest' => [
 'name' => env('APP_NAME', 'Laravel'),
 'short_name' => 'LPT',
 'start_url' => '/',
 'theme_color' => '#FF5733',
 'background_color' => '#ffffff',
 'display' => 'standalone',
 'icons' => [
 [
 'src' => 'logo.png',
 'sizes' => '512x512',
 'type' => 'image/png',
 ]
 ],
 ],
 'livewire-app' => false,
];

🖥️ Usage

Include Assets in Blade

In <head>:

{!! PwaKit::head() !!}

Before </body>:

{!! PwaKit::scripts() !!}

Example Layout:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>My PWA App</title>
 {!! PwaKit::head() !!}
</head>
<body>
 <h1>Welcome to My PWA App</h1>
 {!! PwaKit::scripts() !!}
</body>
</html>

📲 Multiple Forced Install Buttons

You can add multiple buttons anywhere in your app to force the PWA install prompt. Use the .force-install-pwa-app class on any button and attach the install trigger:

<!-- Example Buttons -->
<button class="force-install-pwa-app">Install App</button>
<button class="force-install-pwa-app">Add to Home Screen</button>
// Trigger install prompt for multiple buttons
document.querySelectorAll(".force-install-pwa-app").forEach((btn) => {
 btn.onclick = triggerPWAInstall;
});

💡 Tip: triggerPWAInstall is the helper function provided by Laravel PWA Kit that opens the browser’s add-to-home-screen prompt. You can place as many buttons as you want in your UI.


Livewire Support

Enable in config/laravel-pwa-kit.php:

'livewire-app' => true,

This ensures your service worker and toast behave correctly in Livewire SPA apps.


🛠️ Major Methods & Usage

Method Description Example
PwaKit::head() Generates <meta>, <link> and stylesheet tags for PWA. {!! PwaKit::head() !!}
PwaKit::scripts() Registers service worker, scripts, and install toast HTML. {!! PwaKit::scripts() !!}
PwaKit::updatePWALogo(Request $request) Handles logo upload, validates, and stores in public & base paths. $result = PwaKit::updatePWALogo($request);
createOrUpdate(array $manifest, bool $force = false) Programmatically create or update manifest.json. $pwa = new PwaKit(); $pwa->createOrUpdate($manifest);
update(array $manifestData) Updates manifest data safely. $pwa = new PwaKit(); $pwa->update($manifestData);

🛠️ Major Methods Usage Examples

1. PwaKit::head()

Generates all <meta>, <link> and stylesheet tags required for your PWA.

{{-- In the <head> section of your Blade template --}}
{!! PwaKit::head() !!}

2. PwaKit::scripts()

Registers the service worker, required scripts, and displays the install toast.

{{-- Before closing </body> tag --}}
{!! PwaKit::scripts() !!}

3. PwaKit::updatePWALogo(Request $request)

Handles logo upload, validates file type (PNG), enforces minimum dimensions (×ばつ512), and stores the logo in both the public and base directories.

  • The uploaded file must be sent with the key logo ($request['logo']).
use Illuminate\Http\Request;
use Devrabiul\PwaKit\Facades\PwaKit;
public function updateLogo(Request $request)
{
 // $request['logo'] contains the uploaded file
 $result = PwaKit::updatePWALogo($request);
 if ($result['status']) {
 return back()->with('success', $result['message']);
 } else {
 return back()->withErrors($result['errors'] ?? $result['error']);
 }
}

4. createOrUpdate(array $manifest, bool $force = false)

Programmatically creates or updates the manifest.json file.

use Devrabiul\PwaKit\Facades\PwaKit;
$manifest = [
 'appName' => env('APP_NAME', 'Laravel'),
 'name' => env('APP_NAME', 'Laravel'),
 'shortName' => env('APP_NAME', 'Laravel'),
 'short_name' => env('APP_NAME', 'Laravel'),
 'startUrl' => '/',
 'start_url' => '/',
 'scope' => '/',
 'author' => 'Rabiul Islam',
 'version' => '1.0',
 'description' => 'A description of your web app.',
 'orientation' => 'portrait',
 'dir' => 'auto',
 'lang' => 'en',
 'display' => 'standalone',
 'themeColor' => '#FF5733',
 'theme_color' => '#FF5733',
 'backgroundColor' => '#ffffff',
 'background_color' => '#FF5733',
 'icons' => [
 [
 'src' => 'logo.png',
 'sizes' => '512x512',
 'type' => 'image/png',
 ]
 ],
];
PwaKit::createOrUpdate($manifest, true); // true = force overwrite

💡 Benefits

  • ✅ Turn your Laravel web app into an installable PWA instantly.
  • ✅ Provides offline support, caching, and fast load times.
  • ✅ Reduces repetitive boilerplate code for service workers & manifest.
  • ✅ Fully customizable via configuration.
  • ✅ Works seamlessly with Blade, Livewire, Vue 3, and React.
  • ✅ Encourages modern web best practices.

🔧 Commands

  • Update Manifest:
php artisan pwa:update-manifest

⚠️ Requirements

  • Laravel 8.x to 12.x
  • PHP 8.0+
  • HTTPS (PWAs require secure contexts for service workers)
  • Optional: Livewire v3 for SPA support

🌱 Treeware

This package is Treeware. If you use it in production, then we ask that you buy the world a tree to thank us for our work. By contributing to the Treeware forest you’ll be creating employment for local families and restoring wildlife habitats.


🤝 Contributing

  1. Fork the repository.
  2. Make your changes.
  3. Submit a pull request.

Feature requests and bugs? Open an issue.


📄 License

MIT License – see LICENSE file.


📬 Contact

For support: 📧 Email: devrabiul@gmail.com 🌐 GitHub: devrabiul/laravel-pwa-kit

About

Laravel PWA Kit makes Laravel 8–12 apps installable, offline-ready, fast, and fully-featured Progressive Web Apps.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Packages

No packages published

AltStyle によって変換されたページ (->オリジナル) /