In this book we are going to implement a Progressive Web App (PWA) using a step-by-step approach. This learning experience starts with an already crafted React application called Task List, created using the create-react-app tool with the cra-template-pwa template, which gives us a good starting point for building a progressive web app.

We will go into the details about how to make the web app installable and after that how to improve the user experience by adding offline support to the web app. To make the learning process smooth I will first add offline support for the read-only use cases of the application. After that, I will show how to provide full offline support by using the IndexedDB database and the Background Sync service. I will also explain how to update progressive web apps. How users get notified that there is a new release of the application waiting to be installed and how that actually happens.

Every successful framework or library provides something unique which gives developers a new tool for writing better software. In the case of React, that tool is called component. You might be thinking that you have been reading about components as the solution to your spaghetti software nightmare for the last 15 years without any success. You are not wrong. However, React is an exception. It provides the constructions and tools to build highly cohesive components to assemble your next application. In this book, we will study React core concepts, to end up being very practical describing how to split an application into components and to fully implement it. We explain the concepts creating three applications. We use React Material UI for the CRUD application, React Router v6 and a HTML theme to implement a Blog and React Bootstrap to implement a Task List application.