Adds a service worker to Magento2 to enable PWA features

Related tags

Laravel magento2-pwa
Overview

Monsoon PWA

Adds icons, a web manifest file and a service-worker file to make magento 2 a PWA.

Main Features

  • Supports Magento Blank and Luma as well as Hyvä based themes.
    ⚠️ Hyvä is recommended to ensure fast performance.
    luma pwa results
    hyvä pwa results
  • Makes Magento Installable as a PWA.
  • A CMS Page can be configured for an offline page.
  • Add to Home screen prompt
  • Enable/Disable Offline Google Analytics.
  • Utilises the Browser's Cache API.
  • Service worker lifecycle management.

Installation

composer require monsoonconsulting/magento2-pwa

Configuration

To configure the module go to Stores > Configuration > Monsoon > PWA.
configuration options

Offline Page

In Stores > Configuration > Monsoon > PWA select the page you wish to use as your offline notification page.
Alternatively use the default one provided by this module.

Customisation

In your Magento theme, override the images and PWA app details found in:

  • Monsoon/Pwa/view/frontend/web/images/favicons
  • Monsoon/Pwa/view/frontend/web/manifest.icon

For generating the correct icons there are useful tools such as a favicon generator and maskable icon editor.

Configure Service Worker

Most PWA features can be adjusted added in the service-worker file.
Simply override Monsoon_Pwa/view/frontend/templates/service-worker.js.phtml in your theme to customise.

You might also like...
Adds a way to write php and run it directly in Laravels' Artisan Tinker.
Adds a way to write php and run it directly in Laravels' Artisan Tinker.

Adds a way to write php in PhpStorm/IDEA and run it directly as if through laravel artisan tinker - allowing you to quickly run a piece of code with a

Adds phone number functionality to Laravel based on the PHP port of Google's libphonenumber API by giggsey.

Laravel Phone Adds phone number functionality to Laravel based on the PHP port of Google's libphonenumber API by giggsey. Table of Contents Demo Insta

Adds a widget and REST endpoint for the purpose of displaying post revisions inline on the frontend.

Post History This widget allows visitors to easily diff posts against their earlier revisions, displaying diffs of HTML inline. It should be plug and

A package that adds view-composer like feature to Inertia.js Laravel adapter

Kinetic A package that adds view-composer like feature to Inertia.js Laravel adapter. Use to be able to share props based on the Inertia component nam

Adds phone number functionality to TYPO3 based on the PHP port of Google's libphonenumber API by giggsey

TYPO3 Phone Adds phone number functionality to TYPO3 based on the PHP port of Google's libphonenumber API by giggsey. Installation composer require si

Plugin for Filament Admin that adds a dropdown menu to the header to quickly create new items.
Plugin for Filament Admin that adds a dropdown menu to the header to quickly create new items.

Filament Quick Create Plugin for Filament Admin that adds a dropdown menu to the header to quickly create new items from any page. Installation Instal

This Laravel Nova package adds a Trumbowyg field to Nova's arsenal of fields.

Nova Trumbowyg Field This Laravel Nova package adds a Trumbowyg field to Nova's arsenal of fields. Requirements php: =8.0 laravel/nova: ^4.0 Installa

Evo is a Laravel package that leverages PHP 8 features.

Evo is a Laravel package that leverages PHP 8 features. It change the way you write Laravel app into something like this: #[RoutePrefix('users')] clas

Livewire DataTables components for back-end. Modular, easy to use, with tons of features.

Livewire DataTables Livewire DataTables components for back-end. Modular, easy to use, with tons of features. Inspired by Caleb's Livewire Screencasts

Comments
  • Installability: Page does not work offline

    Installability: Page does not work offline

    Hello,

    First want to say much appreciation of you bringing this to us Magento users. It was a cinch to install and the PWA does indeed work. Not sure why the major complicated hassle required with the "PWA Studio" (creating a separate theme, installing things like node, etc. etc.) when all that is required really is a service worker.

    Unless, my issue stems from this not being the "PWA Studio" in which case will be disappointing to say the least (as I can't figure out PWA studio and don't have time to).

    My issue: as the title states, in Chrome DevTools under the Application tab it says "Installability: Page does not work offline". I resolved a few other errors like id missing (just added to the manifest.json file) and changing the "any maskable" to just "maskable" per web.dev suggestions. But the page not working offline error is stumping me. I have all settings to cache in the Magento admin (Cache Static Assets: Yes, Cache Media Assets: Yes, Cache Google Fonts: Yes. I left "Enable Skip Waiting" set to no, and "Enable clients.claim" set to no).

    Is there any particular step needed to make it work offline? I don't get the little "Add to home" banner popup in the mobile browser (though clicking the three dots then clicking "Install" does work) nor do I get the little "Install" icon in the desktop chrome URL bar that normally appears if the PWA works properly. Also if I disable network/wifi on my phone, the PWA does not work - it says offline. For the "Offline page" I chose my homepage.

    Any help with this would be super appreciated. And thanks again for bringing this as an alternative to the PWA Studio.

    not reproducible 
    opened by FadedOut 15
  • "Add to Home Screen" button Close or Minimize option

    Is your feature request related to a problem? Please describe. When customers browse the store the "Add to home screen" button is there on every page - annoying anyone that don't want to install the app (and taking up screen space).

    Describe the solution you'd like A "close" option for the "Add to Home Screen" button (or maybe a toggle down option or something) would be super helpful for them. Also, with a cookie so it remembers that they closed the button

    Thank you!

    enhancement good first issue 
    opened by FadedOut 0
Releases(1.1.1)
Owner
Monsoon Consulting
Monsoon Consulting
A simple laravel package to enable cascade deleting on polymorphic relations.

Morph Cascade Delete A simple laravel package to enable cascade deleting on polymorphic relations. Installation Install with composer composer requi

Moataz Hajres 18 May 15, 2022
A package can enable DKIM for your Laravel mails.

TobyMaxham Laravel DKIM This package can be used to add a DKIM signature to your outgoing mails. Instead of changing the default Laravel Mailer, Larav

Tobias Maxham 2 Apr 14, 2022
Enable/disable query logger in Laravel/Lumen

Enable/disable query logger in Laravel/Lumen

Ngoc Linh Pham 5 Nov 2, 2022
A laravel service provider for the netsuite-php library service

netsuite-laravel A PHP supplemental package to the ryanwinchester/netsuite-php package to add the NetSuite service client to the service container of

NetsuitePHP 6 Nov 9, 2022
📦 Adds Laravel Packages Support to Lumen and Vendor Publish Artisan Command.

Laravel Package Support for Lumen: Makes Lumen compatible with Laravel Packages. You can use any Laravel Packages in Lumen by installing Larasupport Package.

Irfaq Syed 127 Dec 17, 2022
A Laravel package that adds a simple image functionality to any Laravel model

Laraimage A Laravel package that adds a simple image functionality to any Laravel model Introduction Laraimage served four use cases when using images

Hussein Feras 52 Jul 17, 2022
Composer package which adds support for HTML5 elements using Laravels Form interface (e.g. Form::date())

Laravel HTML 5 Inputs Composer package which adds support for HTML5 elements by extending Laravel's Form interface (e.g. Form::date()) Adds support fo

Small Dog Studios 11 Oct 13, 2020
Joy VoyagerDatatable module adds Yajra DataTable to Voyager.

Joy VoyagerDatatable This Laravel/Voyager module adds Yajra Async/Ajax DataTable to Voyager. By ?? Ramakant Gangwar. Prerequisites Composer Installed

Ramakant Gangwar 10 Dec 19, 2022
This package adds syntax definitions for the Laravel Blade engine.

Laravel Blade Highlighter This package adds syntax definitions for the Laravel Blade engine. Works with various Sublime Text version, for older/specif

Eric Percifield 393 Dec 24, 2022
This package adds support for verifying new email addresses: when a user updates its email address, it won't replace the old one until the new one is verified.

Laravel Verify New Email Laravel supports verifying email addresses out of the box. This package adds support for verifying new email addresses. When

Protone Media 300 Dec 30, 2022