PWA React Course

15 Lessons
10 Students
Certificate of completion

Track:

Programming

Progressive Web Apps (PWAs) are experiences that combine the best of the web and apps. They use service workers, HTTPS, a manifest file and an app shell architecture to deliver native app experiences to web applications. In this tutorial, we'll build a PWA called PusherCoins .

To Register in Course you have to watch at least 30 Second of any lesson

What You'll Learn

Create responsive, fast-loading Progressive Web Apps (PWAs) using React and modern web technologies
Implement service workers, caching strategies, and offline support for seamless user experiences
Design and configure manifest files to enable app installation and home screen access on devices
Optimize React applications for performance, accessibility, and user engagement in PWA development
Utilize HTTPS and security best practices to ensure safe and trustworthy web applications
Build and deploy PWA features like push notifications and background sync for real-time updates
Apply best practices for app shell architecture to enhance load times and user interface consistency
Test and troubleshoot PWAs across different browsers and devices for optimal functionality

Course Content

15 Lessons • 2 h 18 m total

React PWA With Webpack And Workbox | Preaching | Progressive Web App | Workbox Webpack Plugin

8:56

2 Create a React Project from Scratch With Webpack 5 From Scratch 2021 | Babel | PWA

10:00

3 Setup a React app with Webpack and Babel | file loader | style loader | Babel config | PWA

7:25

4 Setup Webpack Dev Server | React Development and Production Server | npm serve | PWA

6:18

5 Use SVG Icons In React | Google fonts and styles | Create layout component | PWA Tutorial

10:09

6 Reach Router | Navigation in React | reach router | React Tutorial for Beginners | PWA

6:33

7 React Background Image Tutorial | Set a background Image With React Inline Styles | PWA

6:41

8 Adding Custom Environment Variables in React | Dot Env | Fetch data in React using axios

12:28

9 What Are Service Workers | Workbox Webpack Plugin | InjectManifest | PWA With Webpack And Workbox

8:19

10 Setup Workbox Webpack Plugin Configuration and manifest json | workbox webpack plugin | React

7:39

11 Service Worker Registration | Workbox Window | Cache update on application re deploy | React PWA

10:34

12 Workbox Precaching In React | Workbox Core | preCacheAndRoute | skipwaiting | React PWA Tutorial

14:42

13 Caching Google Fonts Using Workbox | StaleWhileRevalidate | CacheFirst Caching Strategies

12:08

14 Service Worker How to cache images | Ultimate Guide to PWAs with Workbox | React | CacheFirst

7:06

15 Caching Third Party API Response | Workbox | Handle Third Party Requests | Runtime caching

9:09

How to Get The Certificate

You must have an Account on the platform.
Complete all lessons.
Watch at least 50% of Lesson Duration.
Get your Certificate free 🎉 !

4.6 (152 reviews)

Overall rating

5.0 0%
4.0 0%
3.0 0%
2.0 0%
1.0 0%

Reviews

Be the First One Review This Course

PWA React Course Description

Progressive Web Apps (PWAs) are experiences that combine the best of the web and apps. They use service workers, HTTPS, a manifest file and an app shell architecture to deliver native app experiences to web applications. In this tutorial, we'll build a PWA called PusherCoins .

Focus on Learning, Not Ads

Experience the full power of Mindluster with Premium.
No distractions, just pure education.

Get Mindluster Premium

Cancel your subscription anytime