上期回顾 & 章节概览

没想到在上期视频发布后的短短几天内，就收到了许多朋友的关注，特别感谢能提出宝贵意见和想法的朋友，你们的每一条留言我都认真看完，也对我原本的一些想法产生了改变。因此，在本期视频开始之前，我想先谈谈几个问题。

首先是这个栏目的初衷。

我想把这些年在大厂的宝贵工作经验，总结浓缩成一套科普视频，让从来没见过或是，根本没有机会接触到这些东西的朋友，也能看见大厂的前端都在用什么技术，做什么事情。

而栏目本身也会尽可能避免过度谈论某个具体框架、工具，而是从更高的维度会讨论它们的存在价值和应用场景。毕竟前端变化实在是太快了，今天能用的工具，明天说不定就被其他工具取代了。

在上一期节目中，“如何成为六边形战士” 的结果其实并不重要，而重点在于 “如何”，或者说通过什么样的方法，遵循什么样的路径。

即便是在大厂，也没有人能同时精通所有多东西，大家都是各有所长的。

有专注前端平台建设的工程师，也有专注业务和基础设施的专家，也有专门做可视化、低代码垂直领域的团队。因此，与其说要成为六边形战士，不如选择自己感兴趣的方法深入钻研。而这个系列视频，提供的更多是方向性指引，帮助你打开眼界，看见更多你未曾设想过的道路。

然后是栏目受众，

其实看这个视频的观众中除了前端业内朋友外，还有不少在校大学生或者零基础的朋友，未来想进入前端行业。这个栏目所讲述的内容对于没有从业经验的朋友来说，门槛会比较高，我并不想制造焦虑和误导。

因此，对于在校学生或者零基础的朋友来说，

你目前最要紧的事情就是打好基础，比如对一些关键的学科专业知识：计算机网络、操作系统、数据结构和算法，要有足够的熟悉度。而这个系列中提到的新鲜东西，可以当做额外知识补充，了解它们也能成为你的加分项，在今后的工作中遇到后再学习也不迟。

而对于非零基础，有一定从业经验但不多的朋友来说，

这个系列会对你很有帮助。

你会从中了解到不同业务体量对于前端的要求是很不一样的，也许你能用 CRA 在几天时间内做一个服务几千人的小应用，但仅用 CRA 是不足以支撑更大体量的业务的，需要考虑更多东西。而这个系列就是去探索前端除了基础的技能外，还有哪些是可以深入的。

接下来进入正题。

在上期节目的末尾，我留下了一个思维导图，本期节目就先快速过一下每块要介绍的内容，相当于一个大纲。不过需要强调的是，这个大纲并非最终版本，会随着节目更新有所调整和补充，但大的范围不会变。

首先是计算机网络，有朋友留言说看到第一个要学计算机网络就劝退了，其实前端并不需要搞懂计算机网络的全部内容。

计算机网络中，HTTP 协议和 DNS 是现代互联网络的基石，也是串联终端用户到前端应用的桥梁。HTTP 协议和浏览器高度绑定，许多体验优化方案都会围绕 HTTP 协议进行。如果不了解它们，你就无法真正构建一个可用前端应用。

然后是编程语言，

现代前端的编程语言不只有 JS 和 TS，还有做原生应用的 Dart，以及构建现代前端基建的 Rust，还有不直接由人编程的 WebAssembly，它们都发挥着巨大的价值，因此有必要介绍到。

前端工具箱里面有成千上万种工具，俗话讲 “差生文具多”，我们并不需要每一种都精通，但要知道它们的特色和要解决的核心问题，把好刀用到刀刃上。

本章会介绍前端开发需要用到的工具，比如包管理器、构建工具和调试工具等等。我会选择几个具有代表性的工具，讲讲它们的特点和适用场景。

接着是用户界面。

前端的主要任务之一便是构建用户界面，现代互联网世界中的用户界面不仅仅存在于 PC 浏览器网页中，还存在于移动设备的原生应用、小程序中，甚至是嵌入式设备中。

为了提升用户界面的生产效率，我们引入了 “UI 框架” 和 “组件库” 的概念。

以 React、Vue 为代表的前端框架主要用于构建用户界面，它们提供了诸如虚拟 DOM、渲染、状态管理、交互等一系列方案，帮助我们更快地构建用户界面。

但是，光靠 UI 框架开发效率还是太低，于是组件库就来了，组件库是可复用 UI 的单元，主要目的就是为了写更少的代码，做更通用的事情。

接着是应用框架，它相比 UI 框架，要做的事情更多，复杂度也更高，它的重心在于解决 UI 框架力所不能及的问题。

应用框架通常建立在特定的 UI 框架之上（也有例外），比如在 React 生态中，Next.js 是典型的应用框架，它除了能够使用 React 构建 UI 界面外，还定义了路由、数据加载方式、优化方案、部署方案等等。

本章还会提到常见的几种应用架构，比如：单页应用（SPA）、多页应用（MPA）、渐进式 Web 应用（PWA）以及岛屿架构（Island）。

接下来是用户体验，用户体验的好坏直接决定一个产品的生死存亡。

用户体验能做的事情相当多，本章会从无障碍、性能调优、交互设计、个性化这几个方面来介绍如何全面提升用户体验。

然后是服务端。

严谨一点应该叫前端的服务端，服务端不是必须的，但随着业务扩大，服务端的必要性开始凸显，前端可以借助服务端能力，更有效地提升开发体验和用户体验。

比如在大型业务中，前端如何同背后数十个业务系统建立数据通信，是并发几十个请求还是可以有更高效地方式。

另外如何通过服务端渲染（SSR）来进一步提升用户体验，相比客户端渲染，它有什么优势。

在本章中，我们会提及常用的基础框架和应用框架，以及面向企业级的应用架构方案。我们的重点是介绍在前端引入服务端的必要性，而不是去介绍框架的每一个 API。

一个前端应用做好了，如何评估它的质量和安全性呢？

所谓质量，不仅仅是指它有没有 bug，还原度高不高，有没有漏洞，还应该从更多维度综合分析。

本章会从编码质量、质量工具、稳定性、攻击防御这几个维度介绍现代前端的质量保障方法。

在现代前端开发中，持续集成和部署是保证代码质量和快速迭代的重要手段。

比如，在 CI 流程中，如何提升依赖安装的速度；如何保证本地和测试环境的一致性。在 CD 流程中，如何利用灰度发布发现变更问题；如何通过回滚及时止血。

本章会介绍具备现代前端特色的 CI/CD 流程，以及常用的 CI/CD 工具。

可观测性是指在系统运行过程中，通过收集和分析数据来了解系统的健康状况或是用户行为。

比如，如何采集应用异常；如何了解应用在各终端设备上的性能表现；用户报告问题时，如何快速定位；如何知道应用的 PV/UV、关键链路上的转化率等等。

本章会从日志、追踪和度量维度，探讨如何在前端应用中实现可观测性。

云基础设施在现代前端开发中也是不可忽视的一部分，即便是没有大厂那样的资源，你也可以利用云基础设施解决大量棘手问题。

比如如何加快应用的访问速度；如何降低前端应用的部署成本；如何更有效率地存取和优化图片、视频资源等等。

本章介绍你会用的上的云服务和基础设施，比如 CDN、边缘网络、容器化部署、KV 存储、对象存储、WEB 应用防火墙等等。

好，那么下期视频我们就从计算机网络说起，记得点个关注，我是捣鼓键盘的小麦，我们下期见。