Show & Tell von heute: Verlinke uns in den Kommentaren zu deinem allerersten Design! — Um beim Thema PWAs zu bleiben, beschloss ich, die Dinge zu vereinfachen und mich von Frameworks/Bibliotheken wie Angular, React und Vue fernzuhalten. Stattdessen erstellen wir eine einfache Vanilla-js-App (Basic Javascript) und machen sie mit Hilfe der Workbox-CLI von Google zu einer PWA. Dies sollte dazu beitragen, das Verständnis und die Arbeit mit Progressive Web Apps zu vereinfachen. Github-Repo für dieses Projekt: – – – – – – – – – – – – – – – – – – – – – Abonnieren Sie wöchentlich NEUE VIDEOS! Meine Seite: Mein persönlicher FB-Account: Coursetro FB: Coursetros Twitter: Join my Discord! ^-Chat mit mir und anderen – – – – – – – – – – – – – – – – – – – – – Wer ist Gary Simon? Nun, ich bin ein Full-Stack-Entwickler mit mehr als 2 Jahrzehnten Erfahrung und bringe Leuten bei, wie man entwirft und programmiert. Ich habe über 100 Kurse für große Marken wie LinkedIn,, Pluralsight und Envato Network erstellt. Jetzt konzentriere ich all meine Zeit und Energie auf diesen Kanal und meine Website Komm zu meinem Discord-Server oder füge mich in den sozialen Medien hinzu und sag Hallo! .

Kommentare (34)

  • DesignCourse Antworten

    SMASH THAT SUBSCRIBE BUTTON! – Here's what I think is one of my first designs ever.. late 90's: 😂😂😂

    25. Juli 2018 um 16:47
  • Manly Stump Antworten

    OK I've followed along with this perfectly and everything is working except when I hit "Add to homescreen" on the App Manifest tab nothing happens! 🙁 Any idea why that might be?

    24. Januar 2019 um 13:30
  • matt baker Antworten

    background sync example ????

    9. Februar 2019 um 8:22
  • Ganesh Tiwari Antworten

    service worker not getting added after adding the script at end of html document

    18. Februar 2019 um 18:32
  • Tom Hermans Antworten

    Thanks. This was very clear. And thanks to latest chrome update I have a working app on my computer. Pointless users app from some dummy JSON on the interwebs, BUT A WORKING APP nevertheless 😀

    2. April 2019 um 21:39
  • Mohammed Shopan Antworten

    It is very good from google , how can i add my app in google play store

    3. April 2019 um 10:31
  • Parth solanki Antworten

    can i get your email address ? i have query regarding pwa

    16. Mai 2019 um 6:46
  • Abhilash Raj Antworten

    Hi Simon, Wassup , I really love the way you teach , it's amazing as I am new to PWA , I want to know how I can make a static and dynamic website into PWA. Because as you told in the video , it's all about getting data from API, If you any course or special classes about this , I love to purchase that course as well.

    23. Mai 2019 um 14:51
  • Abhilash Raj Antworten

    Hi Simon, Is it possible to remove website or Localhost link from the Desktop shortcut App icon that I have created using PWA. Please do reply.

    24. Mai 2019 um 9:35
  • Hamza Faqhi Antworten

    im unable to access through local host

    25. Juni 2019 um 17:38
  • Manuel Arturo Izquierdo Antworten

    Trying to induce the Ballmer peak (wine + coding) ?? See: 🙂

    18. Juli 2019 um 16:42
  • SHILPA SAREEN Antworten

    Can we secure the cache data in any way? Like Encryption of cache data? How risky is to save static content and api response data into cache memory?

    27. Juli 2019 um 16:42
  • tsering paljor Antworten

    How to add fetch-eventlistener to google workbox. In order to get beforeinstallprompt for pwa A2HS

    19. August 2019 um 3:15
  • Omer Hussain Antworten

    Hi! i didn't get that notification for adding it to shelf or home… I wonder why, did I miss something?

    28. August 2019 um 11:04
  • Vladimir Brasil Antworten

    Wow: perfect! Very clear, very concise. Wow!

    13. September 2019 um 22:38
  • Helmar Bachle Antworten 22. September 2019 um 12:56
  • Belmiris Antworten

    Thank you. Here's my first website I did like a decade ago.

    29. Oktober 2019 um 14:59
  • debr1126 Antworten

    Can't open localhost:1336 – it says corrupted content error. Opening index.html looks good though.

    3. November 2019 um 23:08
  • et ng Antworten

    i did all the above manually without Workbox… It takes days to understand PWA codes and research, including manually sizing Manifest icons.. You just did in 30min!

    27. November 2019 um 8:27
  • Eric Standlee Antworten 25. Dezember 2019 um 20:57
  • aungkoung 007 Antworten

    Hi. Are those refresh needed for just development? Or do users need to refresh their page?

    30. Dezember 2019 um 23:46
  • Mykel Chang Antworten

    It could have been better.
    You're not explaining all the files you create.
    You look way too much on your cheatsheet, like you were basically rewriting all the tutorial.

    5. Januar 2020 um 23:39
  • Wrushasen Dakhane Antworten

    Getting below error. workbox 4.3.1.
    Error: That is not a valid source service worker file. Please try again with a file containing 'self.__WB_MANIFEST'.

    6. Februar 2020 um 0:41
  • Refayet Ullah Antworten

    Hi Simon, I had to pass "self.__WB_MANIFEST" as follows for injection to work, just my comment workbox.precaching.precacheAndRoute([self.__WB_MANIFEST]);

    10. April 2020 um 23:41
  • Lukasz Glowacz Antworten

    Great tutorial. One remark: it seems that in some cases Workbox 5.x causes problems. For me reverting to 4.3.1 did the trick. Thanks!

    12. Mai 2020 um 9:38
  • Eduardo A. F. Antworten

    Hello Gary. About caching endpoints what about dinamical endpoints. For example i have a list of products <domain>/products and I can request <domain>/products?s=some-text-to-filter this last one is related to a search form how can I configure wb in order to perform a search offline?

    20. Mai 2020 um 20:33
  • Albert S Antworten

    Doesent work, because of new version of workbox (date:22th May 20)? All the files generate by WB look totaly diffent from video. After WB content is not cached, tried to download repo and after WB setup same result, site not cashing.

    22. Mai 2020 um 10:09
  • Edgar John Antworten

    If anyone else has problems with workbox 5.* I found that
    works at 22:43

    30. Juni 2020 um 2:37
  • Scuba Reese Antworten

    Brother you should really quit drinking because it's bad for your mind and body.

    2. August 2020 um 0:30
  • A Pall Antworten

    (2021-01-06) browser 'Service Worker' features are still experimental unfortunately!

    6. Januar 2021 um 18:58
  • JeanAlesiagain3 Antworten

    Great tutorial. But please don't say "crap" anymore

    20. Januar 2021 um 15:46
  • Stijn Hommes Antworten

    What good stuff? You're teaching people how to code malicious spam! Do you feel no shame?

    1. Februar 2021 um 6:03
  • cmartinez89 Antworten

    For those following along this tutorial now, it will throw an error when trying to use command injectManifest. All you need to do is replace the empty array ([ ]) with self.__WB_MANIFEST like so: workbox.precaching.precacheAndRoute(self.__WB_MANIFEST)

    9. März 2021 um 18:06
  • Jack Tyson Antworten

    Nothing works anymore. I tried following the tutorial. import statements don't work in custom service-worker files and the docs don't mention apart from 'use a webpack'. How do I use a webpack? I searched everywhere on the Internet I can't get workbox working.

    2. Mai 2021 um 20:38

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.