双十二大前端工程师读书清单

本文最早为双十一而作，原标题“双 11 大前端工程师读书清单”，以付费的形式发布在 GitChat 上。发布之后在读者圈群聊中和读者进行了深入的交流，现免费分享到这里，不足之处欢迎指教，也可以在我的 GitChat 读者圈中进行提问，原文如下。

发布完本次 Chat 预告后，捕捉到了一个友善的吐槽：“读书清单也要收费？”。的确，只是一个列表的话，你完全不必点进来，我也不必在这里大费周折的推荐给你。但你还是看到这篇文章了，因为你懂什么是博客，你也能理解知识付费对作者的自发性要求；更或许你认识我，看过我的《如何写一篇优质的博客》而愿意相信本文的质量——无论哪种，感谢你的到来，开始干货吧。

本场 Chat 将尝试建立「双 11 期间，大前端领域有趣的买书荐书交流区」，并围绕以下书籍主题进行详细探讨：

1. 从软件工程到大前端开发
2. HTML、CSS 荐书品书
3. JavaScript 荐书品书
4. 计算机网络荐书品书
5. Node.JS 荐书品书
6. 软件工程荐书品书
7. 尝试构建大前端知识体系

同时，本场 Chat 的读者圈也将长期维护，一起与前端领域的大牛们进行激烈的思维碰撞，在交流中绘制出我们专属的书籍成长之路。

从软件工程到大前端开发

这次我们依旧从软件工程说起。从软件危机的诞生到现在，行业领头的软件工程师们给我们描绘了这么一幅专业技能培养方案：

对于没有了解过软件开发的学生，学的第一门是《计算机导论与程序设计基础》。导论部分论述了计算机发展史、计算机基本组成和计算机网络等概念，后期的分科都离不开这个大范围；程序设计基础部分通过快速了解 Python 语法，完成能写出最简洁的输入输出、分支/循环结构的阶段性目标。

接下来详细学习的是面向过程的代表，C 语言。通过重温 Python 中遇到的输入输出流、分支循环结构，再引入程序编译链接原理、指针/链接等在 C 语言中独特的数据类型和数据结构，让我们打下坚实的编程基础 [1]。

[1]：在这个阶段，我们或多或少会经历的挫折有：

1. 安装各种集成开发环境；
2. 安装 Linux 虚拟机/双系统；
3. 调试各种 C 语言 Bug，经常怀疑是程序错了而不是你错了；

只要耐心一点，以上的经历对我们编程习性的养成都很有帮助。

第一年很快的过去后，大二和大三阶段的课程各个掷地有声——数据结构、算法设计、数据库原理、操作系统、计算机网络，内容量的安排上足以让我们有能力去企业进行实习。

可是，这和大前端开发有什么关系？

在整个软件工程的专业培养方案里，并没有任何局限于 Web 开发领域的踪迹，更没有局限于前端开发。况且，前端开发被业界重视的时间并不是很长 [2]。因此隶属于软件开发一个分支的前端开发，急需大量对计算机体系有充足了解的人才的加入。为了不被“学前端人很多”现象造成的泡沫冲击，我们就得拿起计算机科学素养来抵抗。

[2]：使用 XMLHTTPRequest 技术的 Ajax 划分出了一个前后端分离的时代，从此业务逻辑的处理逐步向客户端转移，服务端更多的提供数据接口。

HTML、CSS 荐书品书(3+ 本)

《 Head First HTML 与 CSS(第二版) 》

中文版出版时间：2013-09

前端开发走在用户交互体验变革的最前沿，我们所见的一切实体都可以被素描，被构建。锻炼我们视觉的敏锐性、发现瑕疵并提出自己的设计方案，成为了视觉工程师的独特魅力。前端工程师与视觉工程师有很大的交集之处。

本书使用了丰富的图片和渐进的过程，化繁为简，将我们带入了 Web 开发领域。同时，这本书每一页的排版布局都很精彩，看完本书，我们在布局设计中也将会有源源不断灵感——这也是在众多“Head First” 系列的编程书籍下，只推荐这本书的原因所在。

通过推荐本书，我们还可以感悟到：

• 排版印刷行业、视觉设计领域与前端开发密不可分。
• 化繁为简的思想，可以落实到我们写作上，也更可以吸收进日常的代码设计之中。

其它相关书籍，可以类比：

1. 《 HTML & CSS设计与构建网站 》
2. 《 HTML5与CSS3权威指南(第3版) 》

《 CSS 权威指南（第三版）》

中文版出版时间：2008-01

CSS 更多的是门艺术，而非科学，需要我们在大量实践之中感受真知。至于更好的实践，我们可以通过这本权威指南进行一场细致入微的了解。从选择器、层叠/继承、文字/字体到盒模型、表格布局，本书讲述的 CSS 知识并不落伍，是了解 CSS3 之前版本的最佳手册。

通过推荐本书，我们还可以感悟到：

• 前端新手要多读 W3C 官方的 CSS 手册，能做到的人并不多。

其它相关书籍，可以类比：

1. 《 精通 CSS：高级 Web 标准解决方案 》
2. 《 超越 CSS：Web 设计艺术精髓 》

《 响应式 Web 设计：HTML5 与 CSS3 实战（第二版）》

中文版出版时间：2017-02

各种分辨率终端的普及，对我们的网页适应性提出了更高的要求。也因此 HTML5 标准的新特性和语义化、CSS3 标准的自带动画、新式布局、响应式图片、媒体查询等概念呼之即出。

通过对这本讲解响应式 Web 设计书籍的边看边敲，我们用代码实现响应式设计的能力将有很大的提高。这也再次应证了最初的那句话，前端开发走在用户交互体验变革的最前沿，“响应式”功不可没。

通过推荐本书，我们还可以感悟到：

• 时代对技术提出了新要求，新技术又促进了时代的飞速发展。
• 学好 CSS 基础的下一步，就是将自己曾经的页面重构成响应式的。

其它相关书籍，可以类比：

1. 《 学习响应式设计 》
2. 《 响应式 Web 》

JavaScript 荐书品书(6+ 本)

《 JavaScript 权威指南（第六版）》

中文版出版时间：2012-04

如果说我们想打好 JavaScript 基础，没有什么其他书籍可以比的过这本《 JavaScript 权威指南》了：一千页的厚度，一百四的原价，每一节都舍不得错过。

这本权威指南的章节安排分为两大部分：“JavaScript 语言核心”和“客户端 JavaScript”。正如学习编译原理要从词法开始分析，前半部分从 JavaScript 的词法结构开始讲起。紧接着有基本数据类型、对象、数组、函数、类与模块、正则表达式等章节，涵盖了基础语法的绝大部分。

通过推荐本书，我们还可以感悟到：

“权威指南”是重磅级的存在，只看不敲没有用，只敲不想也无意义，逐章而破，反复重温。

其它相关书籍，可以类比：

• 《 JavaScript 高级程序设计(第3版) 》

《 JavaScript 语言精粹（修订版）》

中文版出版时间：2012-09

总有一本书爱被前端学习者与一千多页的《 JavaScript 权威指南》合影留念。那就是这本《 JavaScript 语言精粹》。在历史背景里，这本书让业界开始重视 JavaScript 这门曾只在浏览器上处理简单任务的脚本语言，堪比人类世界的《 权利法案 》，随着而来的便是现代民主（SPA 单页应用）的普及。

由于 JavaScript 最初是 10 天设计出来的，我们更应在学习的过程中时刻“取其精华，去其糟粕”。这本书便成了 ES5 标准及其之前标准的精华手册。同时，书中“铁路图”的引入和 JSHint 的引入向我们提倡了很好的代码规范建议。遗憾的是，JSHint 由于作者推荐的规范没有定制性，逐步被后来的 ESLint 取代。

通过推荐本书，我们还可以感悟到：

• 一门语言的流行总有其优点所在，缺点也不会例外。掌握更多的编程语言，会让我们对“取其精华，去其糟粕”有更深的理解。
• 直到现在，ECMAScript3 和 ECMAScript5 标准依然广泛存在，在学习 ECMAScript6 的新特性前，不要忘了重温这些概念。

其它相关书籍，可以类比：

• 《 你不知道的 JavaScript 》

《 JavaScript 异步编程 》

中文版出版时间：2014-04

IE 浏览器并不是一无是处的，它最早地向开发者提供了 XMLHTTPRequest 接口，并随着谷歌 Gmail 对其惊艳的实现，Ajax 快速普及，并开启了前后分离的新时代。这本书便从 JavaScript 的异步编程讲起，帮助我们设计快速响应的网络应用，而非简单的页面。

仔细看完这本书，如果有人向我们请教关于“如何理解 JavaScript 的单线程机制”、“JavaScript 异步编程的解决方案有哪些”的时候，我们便能水到渠成的说出个一二三来。只是不要忘了，技术发展到现在，Ajax 也只是前后分离的一种实现方式，我们还有 Fetch API，我们还有 Node 网络请求模块。

通过推荐本书，我们还可以感悟到：

看来，每当谈到大前端开发，我们的关注点应更多的转在 Web 应用上了。

其它相关书籍，可以类比：

• 还是本书，必读之作

《 JavaScript 忍者秘籍 》

中文版出版时间：2015-10

讲述 JavaScript 语言相关技术的图书很多，几乎只有这本，做到了对该语言核心部分（函数、闭包和原型）深入、全面的介绍，由 jQuery 库作者编写。使用 JavaScript 的高级 Web 应用开发中，我们还会接触到测试、测试工具、事件处理、错误捕获等初级学者很难遇到的技术。举例来说，或许现状有许多成型的测试框架，但这本书讲述了更多的 JavaScript 测试现状和测试原理。

通过推荐本书，我们还可以感悟到：

初学阶段感觉没太大用处的技术点，或许只是我们还没有遇到使用情景，因此不要松懈。

其它相关书籍，可以类比：

1. 《 高性能 JavaScript 》
2. 《 JavaScript 启示录 》
3. 《 编写可维护的 JavaScript 》
4. 《 JavaScript 函数式编程 》
5. 《 学习 JavaScript 数据结构与算法(第2版) 》

《 JavaScript 设计模式 》

中文版出版时间：2013-06

有三本讲述 JavaScript 设计模式的书值得推荐。上图分享的是来自百度资深前端工程师的著作。作者通过情景对话，让JavaScript 设计模式的概念变的如此的有趣，又不失核心概念的深入浅出。

目录简洁明了，向我们提供了设计模式的学习路线图，这里作出引用：

• 第一篇，面向对象编程；
• 第二篇，创建型设计模式：其中包括六种具体模式；
• 第三篇，结构型设计模式：其中包括七种具体模式；
• 第四篇，行为型设计模式：其中包括十一种具体模式；
• 第五篇，技巧型设计模式：其中包括八种具体模式；
• 第六篇，架构型设计模式：其中包括六种具体模式。

通过推荐本书，我们还可以感悟到：

除了“化繁为简”外，还有“风趣幽默”可以加入到我们的日常写作与编程之中。

其它相关书籍，可以类比：

1. 《 JavaScript 设计模式与开发实践 》
2. 《 JavaScript 设计模式 - 奥斯马尼 》
3. 《 JavaScript框架设计(第2版) 》

《 深入理解 ES6 》

中文版出版时间：2017-06

开发者们正在积极地为 Web 浏览器以及 NodeJS 这些 JavaScript 宿主环境添加 ECMAScript6 的新功能，这是我们步入 JavaScript 应用开发的不可缺失的一环。块级作用域绑定、解构赋值、迭代器与生成器、Promise 与异步编程、代理与反射，曾因为激进而未做发布的 ECMAScript4 里，原来早都想到了这些概念，现在终得落实。本书由《 JavaScript 高级程序设计 》的作者撰写。

通过推荐本书，我们还可以感悟到：

ECMAScript6+ 更好的支持了前端自动化开发和 JavaScript 应用开发，先从扎实 ECMAScript5 开始学起吧！

其它相关书籍，可以类比：

• 《 ES6 标准入门(第三版) 》

计算机网络荐书品书(3+ 本)

《 网络是怎样连接的 》

中文版出版时间：2017-01

“在浏览器中输入网址到看到网页内容”过程中，到底发生了什么？”一问经常会被提及，于是有了这本严谨又不失有趣的书，完完整整的讲解了整个过程我们所要了解的技术点。

• 客户端：Web 浏览器、TCP/IP、网卡驱动、集线器、路由器
• 服务端：防火墙、缓存服务器、网卡驱动、TCP/IP、Web 服务端程序

如果上面的关键字你不能轻松的说出它们的原理和联络的话，就看看这本这本书吧。

通过推荐本书，我们还可以感悟到：

一个简单的问题，真的可以深挖出一本书来，如果那是由你写出来的话，就更不一样了。

其它相关书籍，可以类比：

• 《 计算机是怎样跑起来的 》

《 计算机网络(第5版) 》

中文版出版时间：2012-03

网络硬件、网络软件；网络协议、网络安全。理论与工程结合，仔细阅读，足见学者的深厚功底。

通过推荐本书，我们还可以感悟到：

图文生动的书纵然有趣，能通读这类更专业的计算机书籍也是一种实力。

其它相关书籍，可以类比：

1. 《 计算机网络:自顶向下方法 》
2. 《 TCP/IP详解 》

《 图解 TCP/IP(第五版) 》

中文版出版时间：2013-07

从理想的 OSI 网络模型到实际的 TCP/IP 模型，每个层级都有很多协议在进行管理。应用层面向我们封装好了底层细节，只需要我们互相通过接口协议来通信。纵使这样，大前端工程师也应掌握好这几个模型的基础。我们常常喜欢简洁的、生动的书来介绍苦涩的概念，那么这本以“图解”命名的网络原理书将十分符合你的口味。

通过推荐本书，我们还可以感悟到：

很多理想的东西落入实际中后常会产生变体，学习的过程中善于抓住重点，变体的原型便会显露的出来。

其它相关书籍，可以类比：

1. 《 图解服务器端网络架构 》
2. 《 图解 HTTP 》

Node.JS 荐书品书(3+ 本)

《 深入浅出 NodeJS 》

中文版出版时间：2013-12

JavaScript 从诞生之初就可以运行在服务端上，只是没有很好的展现机会。现在，NodeJS 终于将 JavaScript 在服务端上重新绽放开来。JavaScript 是单线程的，因此我们需要事件机制和异步编程来支持非阻塞模型，这在传统服务端语言里都是很少用到的特性，从而让 NodeJS 如此与众不同。

这本书由国内作者朴灵所注，初版了四年，依然是国内最好的讲述 Node 的书籍。每一章选题鲜明，通过对进程线程、网络协议、内存控制、前端路由的详细讲解，让我们体验了更多的 Linux 和编程之美。

通过推荐本书，我们还可以感悟到：

只有对 Linux 内核机制、服务端编程的深入掌握，才能写出这样棒的大前端书籍来，我们学习的时候千万不要设限自己，前端尤是如此。

其它相关书籍，可以类比：

1. 《 Node 与 Express 开发 》
2. 《 精通 Linux 》

《 Node.js 硬实战：115个核心技巧 》

中文版出版时间：2017-01

学习 Node 的时候，我们总容易沉浸在 npm 仓库带来的各种有趣的第三方模块上，Node 核心基础的知识反而被疏忽。这本书既讲述了大量的核心概念，有又很多的代码示例，仔细阅读，能让我们从对 Node 的一无所知到深入浅出，最终编写自己健壮的第三方模块。

通过推荐本书，我们还可以感悟到：

关于讲述实战的书籍要慎重选择，在阅读过程中要注意在大量的代码中抓住重点。

其它相关书籍，可以类比：

• 《 Node.js 微服务 》

《 SPA 设计与架构：理解单页 Web 应用 》

中文版出版时间：2016-11

掌握好 JavaScript 的核心概念、设计模式、语言标准、模块化开发以及 Node.JS 相关知识后，可以看看这本讲解 SPA (单页面 Web 应用)开发的书。传统服务器端的架构可以分为表现层、服务层、业务层和数据层，向客户端返回渲染后的页面。SPA 架构让我们可以预先下载整个前端框架，渲染、前端路由等功能都能很好的在客户端处理。

通过推荐本书，我们还可以感悟到：

SPA 带来的时代，让前后端数据的交流越来越需要注重接口的设计。我们可以用 RESTful 来设计我们的接口；前端在开发时，也可以使用 Mock 等技术来模拟后端还未上线的接口服务；前后端分工将再次高效起来。

其它相关书籍，可以类比：

• 《 单页 Web 应用: JavaScript 从前端到后端 》

软件工程荐书品书(1+ 本)

《 黑客与画家：硅谷创业之父Paul Graham文集 》

中文版出版时间：2013-02

大前端开发离不开软件工程领域，软件工程又是整个计算机科学体系的一个篇章。在最后的“软件工程荐书品书”章节，我们以这本讲述早期硅谷黑客故事的书籍为引，将我们的目光重新凝聚在整个行业之上。

通过推荐本书，我们还可以感悟到：

或许当我们出生之时，这些故事注定成为了我们的历史。未来是什么，永远没人能确定。在计算机里，我们可以依据一定的科学观，无中生有的创造着我们想象的世界。尤其在 Linux 推动的开源世界下，程序员间跨国际的平等交流前所未有，注定将会被记录在历史之上。

其它相关书籍，可以类比：

1. 《 一路编程 》
2. 《 若为自由故 自由软件之父理查德 斯托曼传 》
3. 《 只是为了好玩：Linux之父林纳斯自传 》
4. 《 人月神话 》
5. 《 编程珠玑(第2版) 》
6. 《 浪潮之巅 》
7. 《 软件随想录 》
8. 《 重构——改善既有代码的设计 》
9. 《 程序员修炼之道:从小工到专家 》
10. 《 UNIX 编程艺术 》

尝试构建大前端知识体系

很感谢你耐心地看到了这里，本文的书单分享也就到了尾声。细心的你读到这里会发现，每个配书籍封面截图的书籍都不是凭空分享出来的。就像在“JavaScript 荐书品书”章节中，我们主要介绍了六本书——《 JavaScript 权威指南 》、《 JavaScript 语言精粹 》、《 JavaScript 异步编程 》、《 JavaScript 忍者秘籍 》、《 JavaScript 设计模式 》和《 深入理解 ES6 》。这六本书又分别从详细论述、概要凝练、异步开发、重点突破、设计模式和语言标准等角度进行了很好的填充。“其它相关书籍”也告诉我们这六本并不是唯一的选择。编程语言不设限，学习方向不设限，读书更得不设限。这时也就能重新呼应主题，来绘制出我们专属的书籍成长之路。

可见这些书籍是服务于具体知识点的，这些知识点又该以怎样的形式有条理出现在我们的面前呢？以下内容均由笔者整理，是为临稿，目的是开拓视野而不是诺列客观事实，不具有任何官方性质，长期维护在我的 Github仓库中，欢迎探讨。

• HTML -> HTML5, CSS2.1 -> CSS3 -> SASS
• JavaScript -> ES3 -> ES5 -> ES6+
• PWA/SPA 前端 + NodeJS 服务端 + Nginx/Apache 服务器
• 前端数据层：TypeScript/Flow/PropTypes
• 应用架构层：MVC/MVP/MVVM
• 应用状态层：Redux/Mobx/RxJS
• 路由管理层：History API/Hash
• 包管理：bower/npm/yarn
• 模块化：CommonJS/RequireJS/AMD/CMD
• 组件化：JSX/Class
• 自动化：Grunt/Gulp/Webpack
• 脚手架工具：Yoman/creatshare-app-init
• 接口联调：postman/mock/RESTful
• 持续集成：TravisCI/Webhook
• 单元测试：Jasmine/Mocha
• 移动原生应用：Hybrid/React Native
• 桌面客户端：Electron

• Hello，我是韩亦乐，现任本科软工男一枚。软件工程专业的一路学习中，我有很多感悟，也享受持续分享的过程。如果想了解更多或能及时收到我的最新文章，欢迎订阅我的个人微信号：韩亦乐。我的简书个人主页中，有我的订阅号二维码和 Github 主页地址；我的知乎主页 中也会坚持产出，欢迎关注。
• 本文内部编号经由我的 Github 相关仓库统一管理；本文可能发布在多个平台但仅在上述仓库中长期维护；本文同时采用【知识共享署名-非商业性使用-禁止演绎 4.0 国际许可协议】进行许可。