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