渐进式 Web 应用程序 (PWA) – 完整指南

使用设备摄像头、推送通知等构建一个感觉像 iOS 和 Android 应用程序的渐进式 Web 应用程序 (PWA)

讲师：Maximilian Schwarzmüller

双语IT资源独家Udemy付费课程，独家中英文字幕，配套资料齐全！

用不到1/10的价格，即可享受同样的高品质课程，且可以完全拥有，随时随地都可以任意观看和分享。

你将会学到的

• 构建外观和感觉类似于 iOS 和 Android 原生移动应用的 Web 应用
• 使用服务工作者构建无需互联网连接即可运行的 Web 应用程序（离线优先）
• 在你的网络应用程序中利用相机和地理位置等设备功能
• 使用网络推送通知来增加用户对你的网络应用程序的参与度

课程内容

14 个章节 • 208 个讲座 • 总时长 15 小时 53 分钟展开所有章节

入门13 个讲座 • 48 分钟

了解应用清单14 个讲座 • 46 分钟

服务工作者17 个讲座 • 58 分钟

承诺和获取14 个讲座 • 47 分钟

服务工作者 – 缓存19 个讲座 • 1 小时 34 分钟

Service Worker – 高级缓存23 个讲座 • 1 小时 48 分钟

IndexedDB 和动态数据18 个讲座 • 1 小时 8 分钟

创建响应式用户界面 (UI)10 个讲座 • 38 分钟

后台同步13 个讲座 • 1 小时 4 分钟

网络推送通知24 个讲座 • 1 小时 48 分钟

本机设备功能16 个讲座 • 1 小时 34 分钟

使用 Workbox 管理 Service Worker18 个讲座 • 1 小时 11 分钟

SPA 和 PWA7 个讲座 • 35 分钟

课程综述2 个讲座 • 4 分钟

要求

• 需要基本的 HTML、CSS 和 JavaScript 知识
• 无需 JavaScript 框架经验

说明

渐进式 Web 应用程序(PWA) 是 Web 开发中的下一件大事，因为它们为你的用户带来类似移动应用程序的体验，而无需他们从应用商店/游戏商店安装应用程序。

你仍然会创建一个 Web 应用程序（HTML、CSS、JavaScript），但本课程将教你如何添加功能，例如摄像头访问、用于离线支持的服务人员、推送通知等。这结合了两全其美：你提供快速、引人入胜且可靠的体验，同时仍具有网页的覆盖范围和可访问性。

“Progressive Web App”只是一个概括所有功能的术语，可让你提供类似移动设备的体验。这个话题非常热门，而且它也是一个持续存在的话题！它不仅受到 Google 的大力推广（实际上，Google 的开发者大会 Google I/O 2017 上的很多演讲都致力于 PWA），而且它也迅速被Twitter或华盛顿邮报等大公司采用。

拥有构建和优化此类 Web 应用程序的技能对于现代 Web 开发人员来说已经是一项重要且高度需要的技能，而且这种趋势只会加速！因此，学习如何构建 PWA 将为你带来竞争优势！

详细地说，本课程将涵盖构建出色 PWA所需的一切——在 Google 的 PWA 审计工具“Lighthouse”中获得 100 分（满分 100 分）：

• 关于 PWA 到底是什么的详细解释
• 如何使用应用清单使你的网络应用 可安装在设备主屏幕上
• 使用服务工作者通过缓存资产提供离线支持
• 高级服务工作者使用和缓存策略
• 复习Promises和Fetch API，因为这两个概念都在 PWA 中大量使用
• 如何通过添加推送通知来提高用户参与度
• 一种在后台同步数据的方法，即使连接丢失
• 如何访问本机设备功能，如相机或地理位置
• 使用Workbox让 Service Worker 管理更轻松
• 关于如何将你的下一个SPA 项目变成 PWA 的说明
• 和更多

当然，所有这些事情都是通过建立课程项目来付诸实践的。为确保你可以将知识应用到你的任何项目中，本课程项目不假设任何 JavaScript 框架，而是专注于上述核心功能！

所以这门课程有很多东西可以提供，但你如何判断它是否适合你？

如果…绝对是正确的选择

• …你已经是一名 Web 开发人员（无论是经验丰富还是业务新手）并希望为未来做好准备
• …你喜欢使用 HTML、CSS 和 JavaScript，并希望充分利用 Web 和浏览器技术所提供的全部功能
• …你希望使用网络推送通知或离线支持等技术为你的用户提供最佳体验

你需要了解什么才能充分利用课程？

• 你至少需要了解 HTML、CSS 和 JavaScript 的基础知识
• 虽然不需要这些技术的高级知识
• 你不需要了解任何 JavaScript 框架，例如 Angular 或 React – PWA 可以与任何 JavaScript 应用程序一起使用，即使你根本不使用框架（实际上，这就是我们将在课程中构建的内容！）

我很高兴欢迎你加入本课程并与你一起开始这段旅程！

最大限度

此课程面向哪些人：

• 希望构建外观和行为类似于原生移动应用程序的 Web 应用程序的学生
• 想要构建可离线使用的 Web 应用程序的学生（是的，这行得通！）
• 任何想要构建可以访问设备摄像头、地理定位、推送通知并提供离线支持的 Web 应用程序的人
• 希望利用最新浏览器功能同时仍支持旧浏览器的学生