What is a progressive web app? Get started now! It is CANAAN!
A friend of mine from the “Yes Oga!” state, a Google Developer Expert for Web Technologies, Prosper Otemuyiwa says that “he has seen heaven and that progressive web apps are his heaven”. That sounds interesting!
Do you want know what I say? Oh well, for me,
I have reached the promised land. My promised land is building “progressive web apps”.
Progressive Web Apps are user experiences that have the reach of the web, a new way to deliver amazing user experiences on the web. They are;
Progressive
Works for every user, regardless of browser choice because it’s built with progressive enhancement as a core tenet.
Responsive and Connectivity independent
Fits any form factor: desktop, mobile, tablet, or whatever is next. Enhanced with service workers to work offline or on low-quality networks.
App-like
Feels like an app, because the app shell model separates the application functionality from application content.
Fresh and Safe
Always up-to-date thanks to the service worker update process. Served via HTTPS to prevent snooping and to ensure content hasn’t been tampered with.
Discoverable and Re-engageable
Is identifiable as an “application” thanks to W3C manifest and service worker registration scope, allowing search engines to find it. Makes re-engagement easy through features like push notifications.
Installable and Linkable
Allows users to add apps they find most useful to their home screen without the hassle of an app store. Easily share the application via URL, does not require complex installation.
Three main features of PWAs in depth
Reliable
They load instantly and never show the downasaur, even in uncertain network conditions.
When launched from the user’s home screen, service workers enable a Progressive Web App to load instantly, regardless of the network state.
A service worker, written in JavaScript, is like a client-side proxy and puts you in control of the cache and how to respond to resource requests.
By pre-caching key resources you can eliminate the dependence on the network, ensuring an instant and reliable experience for your users.
Fast
53% of users will abandon a site if it takes longer than 3 seconds to load! And once loaded, users expect them to be fast-no janky scrolling or slow-to-respond interfaces. A progressive web app takes care of that — Link
Engaging
They feel like a natural app on the device, with an immersive user experience. Progressive Web Apps are installable and live on the user’s home screen, without the need for an app store.
They offer an immersive full screen experience with help from a web app manifest file and can even re-engage users with web push notifications.
The Web App Manifest allows you to control how your app appears and how it’s launched.
You can specify home screen icons, the page to load when the app is launched, screen orientation, and even whether or not to show the browser chrome.
Why build a Progressive Web App?
Building a high-quality Progressive Web App has incredible benefits, making it easy to delight your users, grow engagement and increase usability.
And You got a helper! Lighthouse!
Lighthouse, an open-source, automated tool for improving the quality of your Progressive Web Apps, eliminates much of the manual testing that was previously required.
Demo Progressive Web Apps?
Here is my first ever progressive web app
DevFest Rift Valley Web App DevFest Nairobi Web App Share Your Story
Impala Developers Web App
More PWAs
DevFest Rift Valley Web App
DevFest Nairobi Web App
Share Your Story Web App
Ready to get started? CODELAB
What you will build
In this codelab, you’ll build a weather web app using Progressive Web App techniques. Your app will:
- Utilize and demonstrate the above principles of Progressive Web Apps.
- Use live weather data.
- Provide app-like interactions to allow the user to add cities.
God Luck! Please come have fun in the promised land. My canaan is Progressive Web Apps!
What next? Loved the article? Follow me, share, like, comment or even save it NOW!
#MeetMaye
Maye Edwin — Progressive Web Apps Developer, Advocate and Speaker | Developer Community Advocate | Developer & Contributor to — https://devfest.gdgmoi.com
Originally published at https://www.linkedin.com on November 29, 2017.
