My First Progressive Web App (PWA)

We learn the basics on Progressive Web Apps! What are they good for? Why do they exist? AND showing just how easy it is to get started!

🗿 MILESTONES
⏯ 00:10 What are progressive web apps PWA?
⏯ 16:35 FIKA TIME! ☕️
⏯ 20:35 PWA vs React Native
⏯ 24:02 building a very first minimal progressive web app on iOS

Repository with the code we use in the video

The editor is called Visual Studio Code and is free. Look for the Live Share extension to share your environment with friends.

DevTips is a weekly show for YOU who want to be inspired 👍 and learn 🖖 about programming. Hosted by David and MPJ - two notorious bug generators 💖 and teachers 🤗. Exploring code together and learning programming along the way - yay!

The recordings are done in a live stream with chat! Follow on Twitch to get notified:

DevTips has a sister channel called Fun Fun Function, check it out!

#pwa #manifest

[ginvgin]

I love this format because it show viewers like me what we undergone when learning new things, and things like how did you go by with the specific task or error.

More of this please and also please continue on the PWA topic.

[getorvillized]

to add icon on iOS:
<link rel="apple-touch-icon"
<link rel="icon" type="image/png"

[Ecker]

Love how Chrome uses gamification on developers, and it works. David is sold.

[malipetek]

Push notifications API is being abused so much.

[rw]

Love the format. You should definitely continue with PWAs doing more on service workers, offline mode, push notifications etc..

[maskman]

I basically turn all the web into pwa, works pretty well, haven't tried iphone yet, with pwa we don't need cordova unless you want to publish to app stores....

[markusgattol]

It can happen gradually as PWA is not a binary state i.e. you can go from a normal App to a PWA in steps...

[dilass]

I think one of the biggest issues here is probably browser support, because it would limit you how well you want to design your app ( CSS ) and how much functionality you can push into your app ( JavaScript ).

I also think WebAssembly will be a huge game changer with progressive apps and web apps in general as it enables users to export native app code used on existing iOS or Windows apps for example, but allows that code (probably C++ or whatever else) to be ported onto the web and complied at almost native speed

[timmy_]

To display the icon on ios i you need to add the ios specific html tags

[getorvillized]

Note: you can add ANY web site to your home screen on iOS with Safari. This does not mean that technically it is a PWA, but it does give you an icon to launch from the home screen, and it launches your page in Safari without the web browser chrome thus making it look more "native app-y"
to have it REALLY be a PWA you need to do the other stuff you guys were doing... to be able to do stuff like work offline, etc.

[adarshshukla]

Hope to get More video like tutorials of pwa
Thanks
love from india

[YetiGamersChannel]

The icon is seperate and has to be added to manifest with I think ref = touch-apple-icon and href this icon.

[iceniveth]

Spotify recently has pwa support. It adds shortcut on your windows desktop.

[OlleHellman]

I hope PWA is the next step of apps and webb

[rajashekhar]

please make a video on ReactJS + PWA + PUSH notifications

[roquefore]

Guessing that icon didnt workout because pwa need different icons for different screen resolutions and that's applephones one just didnt fit - you may see in a console, that pwa is getting 404's on some requests in the end

[Daniel-Condurachi]

is it doable an online store in a PWA? I have a possible customer that would like to have a new website, and iOS app to sell his products and also an Android app. doing a PWA would check all 3 boxes into one. Do you have any recommendations or guide for me?

[agentmirv]

Is David's Christmas foam snack marshmallows? Cause damn, now I want marshmallows.

[safuya]

FunFunForum is a PWA ;) Would have been a good example

[stepheningermany]

I think flutter will kill react native one google fuchsia comes out - one codebase for both apps - dart takes a bit of getting used to though