Udemy

React Progressive Web App With Workbox and Webpack Tutorial

Enroll Now
  • 6,417 Students
  • Updated 10/2022
4.6
(71 Ratings)
CTgoodjobs selects quality courses to enhance professionals' competitiveness. By purchasing courses through links on our site, we may receive an affiliate commission.

Course Information

Registration period
Year-round Recruitment
Course Level
Study Mode
Duration
2 Hour(s) 9 Minute(s)
Language
English
Taught by
Imran Sayed
Rating
4.6
(71 Ratings)
1 views

Course Overview

React Progressive Web App With Workbox and Webpack Tutorial

Learn how to create a React PWA app from scratch with Workbox

This course targets all:  beginners, intermediate and advanced.
It teaches you on how to create a React PWA app from scratch with Workbox. You will learn the following in this course:

  • Intro to React PWA With Webpack And Workbox

  • Create a React Project from Scratch With Webpack 5 From Scratch

  • Setup a React app with Webpack and Babel

  • Setup Webpack Dev Server | React Development and Production Server

  • Using SVG Icons In React | Google fonts and styles | Create layout component

  • Reach Router | Navigation in React

  • React Background Image | Set a background Image With React Inline Styles

  • Adding Custom Environment Variables in React with Dot Env

  • Fetch data in React using axios

  • What Are Service Workers | Workbox Webpack Plugin | InjectManifest

  • Setup Workbox Webpack Plugin Configuration and manifest.json

  • Service Worker Registration | Workbox Window | Cache update on application re-deploy

  • Workbox Precaching In React | Workbox Core | preCacheAndRoute | skipwaiting

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

  • Service Worker: How to cache images

  • You will also learn about how a Runtime caching is done in React PWA app using Workbox

    In this collection, you'll learn what makes a Progressive Web App special, how they can affect your business, and how to build them.
    A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction. Today, they already include features like push notifications and background sync.

Course Content

  • 6 section(s)
  • 15 lecture(s)
  • Section 1 Introduction
  • Section 2 React Application Setup with Webpack
  • Section 3 Creating Components, Adding SVGS, Images, Styles, Routing
  • Section 4 Fetching Data from Third Party API and ENV Variables
  • Section 5 Introduction to Workbox, Service Workers and Caching | Setup and Registration
  • Section 6 Caching At Runtime and Caching Strategies

What You’ll Learn

  • Creating a custom React PWA with Webpack and Workbox.
  • React PWA with Workbox

Reviews

  • A
    Abhijit
    1.0

    Not update. Most of the configurations are not working.

  • A
    Arno Nico Van der Walt
    5.0

    I'm progressing nicely thanks for the speed in teaching

  • J
    Jolly Ann Dolloso
    5.0

    Very insightful!

  • P
    PATEL KARMESH AKSHAYBHAI
    5.0

    I got a lot of new information from that course.

Start FollowingSee all

We use cookies to enhance your experience on our website. Please read and confirm your agreement to our Privacy Policy and Terms and Conditions before continue to browse our website.

Read and Agreed