Progressive web applications

It all began over 12 years ago at the event where Steve Job's announced the very first iPhone. It was an idea that native mobile applications, applications that user's would download would be over thrown by web sites.

What is a PWA?

PWA stands for progressive web app. It is an app built with web technologies we all know and love, like HTML, CSS, and Javascript, but with a feel and functionality that rivals that of a native app. Functionality such as push notifications, offline support and much more. Thanks to a couple of advancements in the web industry, you can turn almost any website into a PWA.

Many websites are already PWAs, like: twitter, pinterest, washingtonpost, uber. Which means all you need to do is add them to your home screen and they'll act like native applications.

What is the difference between a native app and a PWA?

A native app, like the ones you download from Apple's App store or Google's Play store, is often built with a programming language specific to that platform. For iOS apps, Swift and for Android apps, Java. So if you wanted an application that was compatible for iOS and Android, you would need to develop 2 separate applications in 2 separate programming languages. There's no easy way to build one and publish it to both stores.

With PWAs you can now develop a single application, built for the web; and have it work and feel like native apps for both iOS and Android. Since it is a website after all, this means it will work perfectly for any browser; this means on a computer as well!

What are the benefits of a PWA?

We talked about some of the plusses of PWAs in this article, but here’s a short overview:

• You don’t have to go through the process to get into different app stores
• You can build PWAs with common web technologies
• They are often cheaper to build
• Since you’re turning your site into an app, you’ll have fewer code-bases to maintain
• PWAs are responsive and work with many different screen sizes
• PWAs are smooth, fast and lightweight
• No need to hand off big chunks of money to Google and Apple
• They work offline, unlike your regular site
• PWAs are discoverable via search engines (which have a lot larger audience than app stores. Plus, if you want you can still get your PWAs distributed via app stores)
• You can use push notifications to re-engage users
• Installing a PWA can lead to higher engagement

Still, native apps win out sometimes. PWAs get deeper and deeper access to the operating system of a smartphone, but a native app can go deeper still. There are limits to what a PWA can do. For instance, PWAs are not the best choice when you want to build high-performance games.

How do you install a PWA?

First, you need to open a PWA into your browser, you can open one I am currently developing using the same web technologies I used to make this website:

https://my-pomodoro.netlify.app/

Second, you need to press that middle button on the bottom bar of your screen; like in the image below.

Lastly, you need to press "Add to Home Screen"

After that, you're done!