📚 文稿库

【现代前端开发必知16】总结篇 | 我心目中的前端大厦

系统性总结了现代前端开发的知识体系,涵盖网络基础、工具链、框架架构、性能安全及运维监控等核心模块。

UP主: 捣鼓键盘的小麦 · 时长: 4:36 · 🔗 B站原视频

标签: 前端开发 · 编程学习 · 技术架构 · 程序员成长 · 知识体系

制作《现代前端开发必知》的初衷

今年7月18日,我开始制作《现代前端开发必知》系列视频,收到了很大反响。有人说这是在内卷,但我也看到了更多人在这里找到了方向。经过半年的努力,我连续发布了15条视频,从前端最基础的知识到工业化生产,基本上按照预定的计划,把我想讲的都介绍到了。实际上我做这个系列视频的目的是希望尽可能通过一种系统性且不容易过时的分类思维方式,带大家了解目前真实世界中的前端开发会接触到什么。下面就带大家快速过一遍这十几期的核心内容。

前端基础与工具链

我们在第三、第四期介绍了计算机网络,涵盖了域名、DNS、CDN、HTTP协议等内容。它们是构成现代互联网的核心组件,也是前端开发几乎每天都要接触到的东西。我们在第五期介绍了前端编程语言,涉及 ECMAScript 规范、TypeScript、WebAssembly 和 JS 引擎和运行时。第六期介绍了前端工具链,包括集成开发环境、包管理器、现代构建工具的组成要素、调试工具和集成部署工具。工具链的出现是前端从刀耕火种过渡到工业化开发的标志。第七期我们讲了前端用户界面,包括 CSS 框架、UI 框架和组件库三个要素,相信大家已经非常熟悉了。到这里,你已经可以完成一个能用的前端项目了。

进阶篇:应用框架、用户体验与服务端

从第八期开始我们来到进阶篇。这里我们对 UI 框架和应用框架做了区分,同时介绍了应用框架的构成要素以及常见的几种应用架构。应用框架的出现是前端从简单 UI 界面开发过渡到能处理更复杂业务的必然产物。前端利用这么多工具和框架要解决的根本性问题其实是人机交互和用户体验,因此第九期和第十期我们把焦点放在了用户体验上,从性能优化到个性化,介绍了大量优化手段和设计方案。在第十一期我们引入了服务端,从运行时基础、框架、应用框架和应用架构四个维度展开。服务端是从纯前端应用升级到全栈应用的必经之路,无论是功能升级和体验提升,它为前端带来了非常多的可能性。

工业化生产:质量、CI/CD、云服务与运维

在第12期我们开始关注前端应用的质量和安全性,包括编码质量、测试、攻击防御和稳定性四个方面。质量和安全性建设是大规模前端应用进入工业化生产的前提条件,如果你有机会进入大厂做前端开发,那么这期和接下来的几期内容都是必定会接触到的。在第13期我们介绍了持续集成和部署,包含 CI 流程、流水线编排、门禁安全、CD 流程、部署环境、产物分发、灰度发布以及回滚。CI/CD 是支撑现代前端应用进行流水线标准化生产的基础设施。在第14期我们引入了云基础设施,从网络、计算、存储和安全服务四个大类介绍了前端如何通过云基础设施加速应用开发。在云服务日益完善的今天,大型前端应用接入云服务几乎是必然的。在第15期,我们的关注点从开发过渡到运维,介绍了如何通过日志、追踪、度量这三个维度,监测前端应用上线后的状态。

现代前端大厦与渐进式引入

至此,我们的现代前端大厦已经初步建成,不知道各位感受如何。需要说明的是,不是每个项目一上来都要把这些全部用上,而应该是渐进式引入的,这取决于你的业务复杂度和实际条件。前端开发领域浩如烟海,每期短短几分钟的视频,注定不能面面俱到,而这套视频恰好可以作为一个参考,帮助大家发现项目中还可以完善的地方。感谢大家的观看。对了,我将所有的视频链接、参考资料和可交互思维导图放在了这个网站中,大家可以按需获取,不需要一分钱。感谢你的关注,期待未来再和你分享更多有用的知识,我是小麦,我们下期再见。

On this page