Course Introduction: Progressive Web Apps in React with create-react-app

Instructor: [00:00] Hello, and welcome to this course about how to create a progressive web app with React using create-react-app. With create-react-app, we can make a progressive web app, or a PWA, that caches the static resources used in our app, which will make it load faster, especially on slow connections.

[00:18] However, we can also go so much further. Throughout this course, we'll create a to-do list PWA that starts out with just the basic configuration, but then we'll override that config and develop a fully custom PWA service worker, using Workbox. All without needing to eject from create-react-app.

[00:35] Throughout the project, we'll look at how to run the app completely offline, how to cache dynamic assets as well as static ones, and how to use the features of Workbox to create a custom service worker that does exactly what we want it to. We'll also look at how you can actually install a PWA to a mobile device home screen.

[00:53] Including how you can change the app icon, app name, and splash screen, and we'll look at some design considerations that you should consider when developing a PWA to give your users the best experience possible. 

[01:06] Finally, we'll explore how you can use a PWA to access device-specific features as well, like the camera, and even how to add push notification support for Android and Chrome. Even though making a PWA means that you can get closer to a traditional native app experience, it's also important to know that not all device features are supported in PWAs.

[01:28] However, it may be a good choice for your app, even if you're just taking advantage of the loading time speed-up available by caching the resources used in your app. I'm excited to show you how to build a fully-featured, offline operating, progressive web app, using create-react-app.