ReactJS — PWA [Installation/Setup]

This is a ReactJS — PWA Boilerplate, created using create-react-app 🚧

What are Progressive Web Apps?

Note: Why use ReactJS?

How to Build a PWA 👷

⛽️ Following Technologies fuel the Progressive Web Apps:

  • service workers: A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don’t need a web page or user interaction.
  • web manifests: Or web app manifest provides information about a web application in a JSON text file, necessary for the web app to be downloaded and be presented to the user similarly to a native app (e.g., be installed on the home-screen of a device, providing users with quicker access and a richer experience). PWA manifests include its name, author, icon(s), version, description, and list of all the necessary resources (among other things).
  • application shell: An application shell (or app shell) architecture is one way to build a Progressive Web App that reliably and instantly loads on your users' screens, similar to what you see in native applications.

Let’s start building our ReactJS — PWA 🚀

How to Install a PWA on your Device

  • Mobile Users: find an ‘Add to Home screen’ button (in the notifications provided by the website or in the browser settings).
  • Desktop Users: go to the address bar and find the install button on the right.

 by the author.



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Rajesh Mishra

Rajesh Mishra


A coder by profession, sharing life experiences with the Words. Learning more about Productivity, Habits, Decision Making and ambitious towards self freedom.