ReactJS — PWA [Installation/Setup]

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

What are Progressive Web Apps?

PWAs support functionality that is not available for regular websites. It includes offline work, push notifications, access to geolocation, camera, microphone, etc. A PWA can even work outside of a browser, using a native app shell that can launch at startup.

Some of the Popular PWAs:

Some pf the Popular PWAs using ReactJS:

Note: Why use ReactJS?

There is no particular reason to use ReactJS for building PWAs. It’s just my preference. You can use any Technology.

How to Build a PWA 👷

⛽️ Following Technologies fuel the Progressive Web Apps:

  • 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 🚀

https://gist.github.com/rajesh-tsg/7d7d4296dac62c4dece6761cd21dc4d9

How to Install a PWA on your Device

  • Desktop Users: go to the address bar and find the install button on the right.

References:

- Create React App : https://create-react-app.dev/docs/making-a-progressive-web-app
- Lighthouse Chrome Extension: https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=en
- Link to the Boilerplate GitHub Repository: https://github.com/rajesh-tsg/ReactJS-PWA-Boilerplate

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