Know all about Progressive Web Apps

Nikhil Pradeep
Aug 12 · 11 min read
Use of Mobile Internet users ratio
Use of Mobile Internet users ratio
Growth Ratio of Mobile Users (millions)

We will be Covering the following Sessions in this Article:

What is a Web App?

What is PWA?

What are the Characteristics of PWA?

What is a Service Worker?

What is a Service Worker in PWA
What is a Service Worker in PWA
Working Procedure of a Service Worker

The Working Procedure of PWA.

Google Search of Twitter
Pop up from the website on Mobile view
Dialogue box appearing on Twitter
Installed as an App on Mobile
App view of Twitter from Mobile

What are the Challenges faced with PWA?

What are the Requirements to implement PWA on a website?

HTTPS Connection in PWA.

Use of Manifest File in PWA.

{
"short_name": "Maps",
"name": "Google Maps",
"icons": [
{
"src": "/images/icons-192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "/images/icons-512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": "/maps/?source=pwa",
"background_color": "#3367D6",
"display": "standalone",
"scope": "/maps/",
"theme_color": "#3367D6"
}

Some Frameworks and Tools used to develop PWA.

Angular JS for PWA
Angular JS for PWA
Build PWA with React
Build PWA with React
Lighthouse for PWA
Lighthouse for PWA
Workbox for pwa
Workbox for pwa

Some Top Companies Implemented PWA.

PWA of Uber
PWA of Uber
PWA of Instagram
PWA of Instagram
Forbes brings PWA
Forbes brings PWA

Conclusion.

Nikhil Pradeep

Written by

Hey! in my opinion, a Bio means less than what the post does. Designer, Programmer and a Tech Savvy :) :)

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade