How to create a progressive web app- iBeris Software

Sasikumar Eazthaimuthu
Jul 10 · 2 min read

Before diving into the learning for PWA building methods, let's have a basic understanding of progressive web app.

Google Developers on its fundamental codelab states that “Progressive Web Apps provide an installable, app-like experience on desktop and mobile that are built and delivered directly via the web. They’re web apps that are fast and reliable. And most importantly, they’re web apps that work in any browser. If you’re building a web app today, you’re already on the path towards building a Progressive Web App”.

What you’ll need

A recent version of Chrome (74 or later) PWAs are just web apps and work in all browsers, but we’ll be using a few features of the Chrome DevTools to better understand what’s happening at the browser level, and use it to test the install experience.

Knowledge of HTML, CSS, JavaScript, and Chrome DevTools. — Codelab, Google

What is Lighthouse?

Google defines as “Lighthouse is an easy to use tool to help improve the quality of your sites and pages. It has audits for performance, accessibility, progressive web apps, and more. Each audit has a reference doc explaining why the audit is important, as well as how to fix it.”

Your First Progressive Web App
In this codelab, you’ll build a Progressive Web App, which loads quickly, even on flaky networks, has an icon on the homescreen, and loads as a top-level, full-screen experience. START

Debugging Service Workers
In this codelab, you’ll learn how to debug a service worker using the new DevTools Application panel. You’ll also learn how to simulate a Push notification to verify your subscription is properly setup. START

Your First Offline Web App
Learn how to integrate a service worker into an existing application to make the application work offline. START

Adding Web Push Notifications
In this codelab, you will learn how to enable push messaging and notifications for web apps and sites. START

Find and Fix Web App Performance Issues
This codelab will help you learn to identify and fix web app performance bottlenecks. START

Your First Multi-Device Site
The web is accessible on a huge range of devices, from small-screen phones to big-screen televisions. Each device presents its own benefits and constraints. As a web developer, you are expected to support a full range of devices. START

Create Frictionless Payments
In this codelab, you will learn how to implement Payment Request API onto an existing e-commerce website. START

For PWA services, kindly contact iBeris software, a UAE based company having its office at India and other places.