Progressive Web Apps (PWA) - The Complete Guide

Table of contents

1. Chapter 1 : Getting Started
   1. About this Course
   2. What are Progressive Web Apps?
   3. PWAs vs Native Mobile Apps
   4. A Demo PWA What We'll Build in this Course
   5. Our First Progressive Web App
   6. PWA Core Building Blocks
   7. Comparing PWAs and SPAs
   8. What is "Progressive Enhancement"
   9. Course Outline
   10. Course Project Setup
   11. How to get the Most out of this Course
2. Chapter 2 : Understanding the App Manifest
   1. Module Introduction
   2. Using an App Manifest to Make your App Installable
   3. Adding the Manifest
   4. Understanding App Manifest Properties
   5. Adding Properties to the App Manifest
   6. PWAs and Browser Support
   7. Using the Chrome Developer Tools
   8. Simulating the Web App on an Emulator
   9. Installing the Web App – Prerequisites
   10. Adding Properties for Safari
   11. Adding Properties for the Internet Explorer
   12. Wrap Up
3. Chapter 3 : The Service Workers
   1. Module Introduction
   2. Why Service Workers Are Amazing!
   3. Understanding Service Worker Events
   4. The Service Worker Lifecycle
   5. Service Worker Browser Support
   6. Registering a Service Worker
   7. Reacting to Incoming Events (in SW)
   8. Updating Activating Service Workers
   9. Non-Lifecycle Events
   10. Getting that "App Install Banner"
   11. Testing the App on Real Device (and Installing the App!)
   12. Deferring the App Install Banner
   13. Wrap Up
4. Chapter 4 : Promise and Fetch
   1. Module Introduction
   2. Async Code in JavaScript
   3. Promises – Basics
   4. Rejecting Promises
   5. Where we Use Promises in our Project
   6. Fetch – Basics
   7. Sending Post Requests via Fetch
   8. Fetch and CORS
   9. Comparing Fetch and Ajax
   10. Adding Polyfills (for Legacy Browser Support)
   11. Fetch Service Workers
   12. Wrap Up
5. Chapter 5 : Service Workers – Caching
   1. Module Introduction
   2. Why Caching?
   3. Understanding the Cache API
   4. Browser Support
   5. Adjusting the Course Project
   6. Identifying (Pre-) Cacheable Items
   7. Static Caching/ Precaching
   8. Retrieving Items from the Cache
   9. Adding Retrieving Multiple Files (to/ from Cache)
   10. Cache Multiple Files with addAll
   11. Dynamic Caching - The Basics
   12. Implementing Dynamic Caching
   13. Handling Errors
   14. Adding Cache Versioning
   15. Different Cache Versions Cleanup
   16. Optimizing Cache Management
   17. Wrap Up
6. Chapter 6 : Service Workers - Advanced Caching
   1. Module Introduction
   2. Module Preparation: Adding a Button
   3. Offering "Cache on Demand"
   4. Providing an Offline Fallback Page
   5. Strategy: Cache with Network Fallback
   6. Strategy: Cache Only
   7. Strategy: Network Only
   8. Strategy: Network with Cache Fallback
   9. Strategy: Cache then Network
   10. Cache then Network Dynamic Caching
   11. Cache then Network with Offline Support
   12. Cache Strategies "Routing"
   13. Applying Cache Only
   14. A Better Way of Parsing Static Cache URLs
   15. A Better Way of Serving Fallback Files
   16. Post Request and Cache API
   17. Cleaning/ Trimming the Cache
   18. Getting Rid of a Service Worker
   19. Preparing the Project for the Next Steps
   20. Wrap Up
7. Chapter 7 : IndexedDB and Dynamic Data
   1. Module Introduction
   2. Understanding the Basics
   3. Setting up Firebase
   4. Connecting Frontend to Backend
   5. Dynamic Caching vs. Caching Dynamic Content
   6. Introducing IndexedDB
   7. IndexedDB Browser Support
   8. Adding the IDB File
   9. Storing Fetched Posts in IndexedDB
   10. Using IndexedDB in the Service Worker
   11. Reading Data from IDB
   12. Clearing IDB Handling Server-Client Mismatch
   13. Implementing the Clear Database Method
   14. Deleting Single Items from the Database
   15. IndexedDB and Caching Strategies
   16. Wrap Up
8. Chapter 8 : Creating a Responsive User Interface (UI)
   1. Module Introduction
   2. Responsive Design in this Course
   3. Understanding Responsive Design in our Project
   4. CSS and Media Queries
   5. Using Images in a Responsive Way
   6. Adding Animations
   7. The Viewport Scaling
   8. Wrap Up
9. Chapter 9 : Background Sync
   1. Module Introduction
   2. How does Background Sync Work?
   3. Adding the Basic Setup to our Project
   4. Registering a Synchronization Task
   5. Storing our Post in IndexedDB
   6. Adding a Fallback
   7. Syncing Data in the Service Worker
   8. Understanding Periodic Sync
   9. Adding Server Side Code
   10. Fixing Errors
   11. Wrap Up
10. Chapter 10 : Web Push Notifications
    1. Module Introduction
    2. Why we need Web Push Notifications
    3. How Push Notifications Work
    4. Displaying Notifications - Some Theory First
    5. Browser Support
    6. Requesting Permissions
    7. Displaying Notifications
    8. Notifications from Within the Service Worker
    9. Understanding Notifications' Options
    10. Advanced Options
    11. Adding Actions to Notifications
    12. Reacting to Notification Interaction – Clicks
    13. Reacting to Notification Interaction – Closing
    14. From Notifications to Push Messages
    15. Creating a Push Subscription
    16. Storing Subscriptions
    17. Connecting Server Client (PWA)
    18. Sending Push Messages from the Server
    19. Listening to Push Messages
    20. Displaying Push Notifications on a Real Device
    21. Opening a Page upon User Interaction
    22. Improving our Code
    23. Wrap Up
11. Chapter 11 : Native Device Features
    1. Module Introduction
    2. Preparing the Project
    3. Getting DOM Access
    4. Creating our own Polyfills
    5. Getting the Video Image
    6. Hooking Up the Capture Button
    7. Storing the Image on a Server
    8. Accepting File Upload Example with Firebase
    9. Testing the Camera Upload
    10. Implementing a Fallback
    11. Getting the User Position
    12. Fixing Bugs
    13. Testing the App on a Real Device
    14. Wrap Up
12. Chapter 12 : Service Worker Management with Workbox
    1. Module Introduction
    2. Understanding the Basics
    3. Installing Workbox Using It
    4. Configuring Workbox Precaching
    5. Customizing the Service Worker
    6. Implementing Routing with the Workbox Router
    7. Expanding Dynamic Caching
    8. Options and Setting up Strategies
    9. Custom Handlers (Example: For IndexedDB)
    10. Providing an Offline HTML Fallback
    11. Handling Background Synchronization and Push Notifications
    12. Understanding the Workbox Documentation
    13. Enhancing the Build Workflow
    14. Running our App on a Real Server
    15. Auditing our Webpage with Lighthouse
    16. Wrap Up
13. Chapter 13 : SPAs and PWAs
    1. Module Introduction
    2. React with create-react-app
    3. A General Note about SPAs and PWAs
    4. Angular with the CLI
    5. Vue with Vue CLI
    6. Wrap Up
14. Chapter 14 : Course Roundup
    1. Course Roundup