Progressive Web App (PWA) using React

Develop a progressive web application using React.

Progressive Web Application

Overview

In this article, let’s develop a progressive web application using React.

From Wikipedia,

A progressive web application (PWA) is a type of application software delivered through the web, built using common web technologies including HTML, CSS and JavaScript. It is intended to work on any platform that uses a standards-compliant browser, including both desktop and mobile devices.

Setup

Let’ start by creating a progressive web application using create-react-app and the PWA template.

npx create-react-app react-pwa-app --template cra-template-pwa

I use the Javascript template. For Typescript, use cra-template-pwa-typescript.

I am going to leverage the sample code I developed in my previous article to display a dynamic grid with user details and dropdowns of countries and cities.

React Grid with Dynamic Dropdown and Selection