WeiTang
WeiTang

Reputation: 31

How do I implement PWA in React such that my application works offline

I am looking at implementing my web application as a PWA using React. The main feature that I want to implement is to cache JSON data fetched from API such that it works in offline mode. However, I do not know how to code the service worker in React.

Upvotes: 0

Views: 1093

Answers (1)

Mauro Stepanoski
Mauro Stepanoski

Reputation: 725

You can start reading the official doc here and you should figure out how you must configure your environment (webpack). If you could not understand it, you shoud read this medium article here or here.

You need to:

  1. Create the file manifest.json or generate it.
  2. Bind the manifest.json at the header section:

<link rel="manifest" href="%PUBLIC_URL%/manifest.json">

  1. Create a file registerServiceWorker.js, you can find help here
  2. Write your React App.
  3. Choose an offline strategy to store data (for example, you can use redux offline or redux persist).

Upvotes: 1

Related Questions