The tutorial includes setting up a Service Worker with Webpack and Workbox, making it work with TypeScript and ESLint, adding a manifest with icons for your home and splash screen, and finally, making your PWA compatible with iOS devices.

At the beginning of this year, I started working on a project in my company where I would transform a ReactJS application for booking events into a Progressive Web App. When I started to look into the topic, I couldn’t find a resource that explained all the things I needed to know to get started and that would cover the entire process of converting an existing ReactJS application into a Progressive Web App at a production-ready state.

I’ll first explain to you the things you need to know about Progressive Web Apps to get started and afterward, I’ll walk you, step by step, through the process of making your ReactJS app a Progressive Web App.

If you follow along with the tutorial and there are any open questions or you got stuck, don’t hesitate to contact me. You can find my contact information at the bottom of this page.

Prerequisites

This tutorial is for you if…

• you want to get into Progressive Web Apps but don’t know where to start.
• you want to get a better understanding of PWAs and of the terms around them.
• you want to make your React app a Progressive Web App.
• you are using Webpack for bundling your code.

#pwa #react #javascript