Level 75
Medium has other 2018 articles also, perhaps search through them. Good luck with this.
I am guessing you have already done a through Google search.
Also check GitHub for those types of apps, maybe you can find some code that will guide you.
Jan 6, 2019
5
Level 13
Building my first PWA, running into issues!
I'm trying to build my first ever PWA and have succeeded it to a great extent. I followed this tutorial: https://medium.com/codefield-community/laravel-pwa-from-webpack-mix-js-11c313d5d918.
The only issue so far is that - dynamic URLs don't work; and I've no clue how to make them work. I only tested with static urls (home, login, dashboard etc.).
I've few questions -
-
I used sw-precache; which is being replaced with workbox. Does anyone know how to make this work with workbox?
-
Offline capability is not absolutely essential for my app. I'm wondering if I should bother about dynamic URLs.
-
How could I test my PWA locally - say on my Android device? I checked port forwarding for USB connected devices; but couldn't get it to work. I'm not if it's the right approach.
Level 3
Answer 1. You can use workbox cli to generate your service worker file, if you need custom code in your service worker you can inject it too and workbox will generate sw code for you.
Answer 2. workbox will handle dynamic assets caching by default so you dont have worry about it.
Answer 3. this is working for me, navigate to more tool > remote device > select device and rule
Level 13
@vajid - thank you for reply.
-
Pardon my ignorance, but is the workbox meant only for creating the SW? Or does it do more?
-
That's a relief. I'll look into it.
-
I get NGINX bad request error. How do you view your local valet powered site on your Android device (in order to test PWA install screens and other functioning)? What ports are you using for mobile device and localhost?
Level 3
- Yes workbox is a cli tool by google to create SW and for offline capability
- PWA need https, so it wont run on your real advice from your local server without port forwarding and you can use any port, you just have to add rule
localhost:8080 localhost:8080
for more refer step 2 https://medium.com/progressive-web-apps/react-progressive-web-apps-part-1-1cf381421672
1 like
Level 13
Thank you, @vajid . I got the Workbox version running; but it still needs work as my service worker is failing. I'm going to explore this more and seek help here if I can't fix the problems on my own. Really appreciate your responses.
Please or to participate in this conversation.