摘要：本文最早為雙十一而作，原標題雙大前端工程師讀書清單，以付費的形式發布在上。發布完本次預告后，捕捉到了一個友善的吐槽讀書清單也要收費。這本書便從的異步編程講起，幫助我們設計快速響應的網絡應用，而非簡單的頁面。

本文最早為雙十一而作，原標題“雙 11 大前端工程師讀書清單”，以付費的形式發布在 GitChat 上。發布之后在讀者圈群聊中和讀者進行了深入的交流，現免費分享到這里，不足之處歡迎指教，也可以在我的 GitChat 讀者圈中進行提問，原文如下。

發布完本次 Chat 預告后，捕捉到了一個友善的吐槽：“讀書清單也要收費？”。的確，只是一個列表的話，你完全不必點進來，我也不必在這里大費周折的推薦給你。但你還是看到這篇文章了，因為你懂什么是博客，你也能理解知識付費對作者的自發性要求；更或許你認識我，看過我的《如何寫一篇優質的博客》而愿意相信本文的質量——無論哪種，感謝你的到來，開始干貨吧。

本場 Chat 將嘗試建立「雙 11 期間，大前端領域有趣的買書薦書交流區」，并圍繞以下書籍主題進行詳細探討：

從軟件工程到大前端開發
HTML、CSS 薦書品書
JavaScript 薦書品書
計算機網絡薦書品書
Node.JS 薦書品書
軟件工程薦書品書
嘗試構建大前端知識體系

同時，本場 Chat 的讀者圈也將長期維護，一起與前端領域的大牛們進行激烈的思維碰撞，在交流中繪制出我們專屬的書籍成長之路。

這次我們依舊從軟件工程說起。從軟件危機的誕生到現在，行業領頭的軟件工程師們給我們描繪了這么一幅專業技能培養方案：

對于沒有了解過軟件開發的學生，學的第一門是《計算機導論與程序設計基礎》。導論部分論述了計算機發展史、計算機基本組成和計算機網絡等概念，后期的分科都離不開這個大范圍；程序設計基礎部分通過快速了解 Python 語法，完成能寫出最簡潔的輸入輸出、分支/循環結構的階段性目標。

接下來詳細學習的是面向過程的代表，C 語言。通過重溫 Python 中遇到的輸入輸出流、分支循環結構，再引入程序編譯鏈接原理、指針/鏈接等在 C 語言中獨特的數據類型和數據結構，讓我們打下堅實的編程基礎 [1]。

[1]：在這個階段，我們或多或少會經歷的挫折有：

安裝各種集成開發環境；
安裝 Linux 虛擬機/雙系統；
調試各種 C 語言 Bug，經常懷疑是程序錯了而不是你錯了；

只要耐心一點，以上的經歷對我們編程習性的養成都很有幫助。

第一年很快的過去后，大二和大三階段的課程各個擲地有聲——數據結構、算法設計、數據庫原理、操作系統、計算機網絡，內容量的安排上足以讓我們有能力去企業進行實習。

可是，這和大前端開發有什么關系？

在整個軟件工程的專業培養方案里，并沒有任何局限于 Web 開發領域的蹤跡，更沒有局限于前端開發。況且，前端開發被業界重視的時間并不是很長 [2]。因此隸屬于軟件開發一個分支的前端開發，急需大量對計算機體系有充足了解的人才的加入。為了不被“學前端人很多”現象造成的泡沫沖擊，我們就得拿起計算機科學素養來抵抗。

[2]：使用 XMLHTTPRequest 技術的 Ajax 劃分出了一個前后端分離的時代，從此業務邏輯的處理逐步向客戶端轉移，服務端更多的提供數據接口。

中文版出版時間：2013-09

前端開發走在用戶交互體驗變革的最前沿，我們所見的一切實體都可以被素描，被構建。鍛煉我們視覺的敏銳性、發現瑕疵并提出自己的設計方案，成為了視覺工程師的獨特魅力。前端工程師與視覺工程師有很大的交集之處。

本書使用了豐富的圖片和漸進的過程，化繁為簡，將我們帶入了 Web 開發領域。同時，這本書每一頁的排版布局都很精彩，看完本書，我們在布局設計中也將會有源源不斷靈感——這也是在眾多“Head First” 系列的編程書籍下，只推薦這本書的原因所在。

通過推薦本書，我們還可以感悟到：

排版印刷行業、視覺設計領域與前端開發密不可分。
化繁為簡的思想，可以落實到我們寫作上，也更可以吸收進日常的代碼設計之中。

其它相關書籍，可以類比：

《 HTML & CSS設計與構建網站 》

《 HTML5與CSS3權威指南(第3版) 》

中文版出版時間：2008-01

CSS 更多的是門藝術，而非科學，需要我們在大量實踐之中感受真知。至于更好的實踐，我們可以通過這本權威指南進行一場細致入微的了解。從選擇器、層疊/繼承、文字/字體到盒模型、表格布局，本書講述的 CSS 知識并不落伍，是了解 CSS3 之前版本的最佳手冊。

通過推薦本書，我們還可以感悟到：
前端新手要多讀 W3C 官方的 CSS 手冊，能做到的人并不多。

其它相關書籍，可以類比：

《 精通 CSS：高級 Web 標準解決方案 》

《 超越 CSS：Web 設計藝術精髓 》

中文版出版時間：2017-02

各種分辨率終端的普及，對我們的網頁適應性提出了更高的要求。也因此 HTML5 標準的新特性和語義化、CSS3 標準的自帶動畫、新式布局、響應式圖片、媒體查詢等概念呼之即出。

通過對這本講解響應式 Web 設計書籍的邊看邊敲，我們用代碼實現響應式設計的能力將有很大的提高。這也再次應證了最初的那句話，前端開發走在用戶交互體驗變革的最前沿，“響應式”功不可沒。

通過推薦本書，我們還可以感悟到：

時代對技術提出了新要求，新技術又促進了時代的飛速發展。
學好 CSS 基礎的下一步，就是將自己曾經的頁面重構成響應式的。

其它相關書籍，可以類比：

《 學習響應式設計 》

《 響應式 Web 》

中文版出版時間：2012-04

如果說我們想打好 JavaScript 基礎，沒有什么其他書籍可以比的過這本《 JavaScript 權威指南》了：一千頁的厚度，一百四的原價，每一節都舍不得錯過。

這本權威指南的章節安排分為兩大部分：“JavaScript 語言核心”和“客戶端 JavaScript”。正如學習編譯原理要從詞法開始分析，前半部分從 JavaScript 的詞法結構開始講起。緊接著有基本數據類型、對象、數組、函數、類與模塊、正則表達式等章節，涵蓋了基礎語法的絕大部分。

通過推薦本書，我們還可以感悟到：
“權威指南”是重磅級的存在，只看不敲沒有用，只敲不想也無意義，逐章而破，反復重溫。

其它相關書籍，可以類比：

《 JavaScript 高級程序設計(第3版) 》

中文版出版時間：2012-09

總有一本書愛被前端學習者與一千多頁的《 JavaScript 權威指南》合影留念。那就是這本《 JavaScript 語言精粹》。在歷史背景里，這本書讓業界開始重視 JavaScript 這門曾只在瀏覽器上處理簡單任務的腳本語言，堪比人類世界的《 權利法案 》，隨著而來的便是現代民主（SPA 單頁應用）的普及。

由于 JavaScript 最初是 10 天設計出來的，我們更應在學習的過程中時刻“取其精華，去其糟粕”。這本書便成了 ES5 標準及其之前標準的精華手冊。同時，書中“鐵路圖”的引入和 JSHint 的引入向我們提倡了很好的代碼規范建議。遺憾的是，JSHint 由于作者推薦的規范沒有定制性，逐步被后來的 ESLint 取代。

通過推薦本書，我們還可以感悟到：

一門語言的流行總有其優點所在，缺點也不會例外。掌握更多的編程語言，會讓我們對“取其精華，去其糟粕”有更深的理解。
直到現在，ECMAScript3 和 ECMAScript5 標準依然廣泛存在，在學習 ECMAScript6 的新特性前，不要忘了重溫這些概念。

其它相關書籍，可以類比：

《 你不知道的 JavaScript 》

中文版出版時間：2014-04

IE 瀏覽器并不是一無是處的，它最早地向開發者提供了 XMLHTTPRequest 接口，并隨著谷歌 Gmail 對其驚艷的實現，Ajax 快速普及，并開啟了前后分離的新時代。這本書便從 JavaScript 的異步編程講起，幫助我們設計快速響應的網絡應用，而非簡單的頁面。

仔細看完這本書，如果有人向我們請教關于“如何理解 JavaScript 的單線程機制”、“JavaScript 異步編程的解決方案有哪些”的時候，我們便能水到渠成的說出個一二三來。只是不要忘了，技術發展到現在，Ajax 也只是前后分離的一種實現方式，我們還有 Fetch API，我們還有 Node 網絡請求模塊。

通過推薦本書，我們還可以感悟到：
看來，每當談到大前端開發，我們的關注點應更多的轉在 Web 應用上了。

其它相關書籍，可以類比：

還是本書，必讀之作

中文版出版時間：2015-10

講述 JavaScript 語言相關技術的圖書很多，幾乎只有這本，做到了對該語言核心部分（函數、閉包和原型）深入、全面的介紹，由 jQuery 庫作者編寫。使用 JavaScript 的高級 Web 應用開發中，我們還會接觸到測試、測試工具、事件處理、錯誤捕獲等初級學者很難遇到的技術。舉例來說，或許現狀有許多成型的測試框架，但這本書講述了更多的 JavaScript 測試現狀和測試原理。

通過推薦本書，我們還可以感悟到：
初學階段感覺沒太大用處的技術點，或許只是我們還沒有遇到使用情景，因此不要松懈。

其它相關書籍，可以類比：

《 高性能 JavaScript 》

《 JavaScript 啟示錄 》

《 編寫可維護的 JavaScript 》

《 JavaScript 函數式編程 》

《 學習 JavaScript 數據結構與算法(第2版) 》

中文版出版時間：2013-06

有三本講述 JavaScript 設計模式的書值得推薦。上圖分享的是來自百度資深前端工程師的著作。作者通過情景對話，讓JavaScript 設計模式的概念變的如此的有趣，又不失核心概念的深入淺出。

目錄簡潔明了，向我們提供了設計模式的學習路線圖，這里作出引用：

第一篇，面向對象編程；

第二篇，創建型設計模式：其中包括六種具體模式；

第三篇，結構型設計模式：其中包括七種具體模式；

第四篇，行為型設計模式：其中包括十一種具體模式；

第五篇，技巧型設計模式：其中包括八種具體模式；

第六篇，架構型設計模式：其中包括六種具體模式。

通過推薦本書，我們還可以感悟到：
除了“化繁為簡”外，還有“風趣幽默”可以加入到我們的日常寫作與編程之中。

其它相關書籍，可以類比：

《 JavaScript 設計模式與開發實踐 》

《 JavaScript 設計模式 - 奧斯馬尼 》

《 JavaScript框架設計(第2版) 》

中文版出版時間：2017-06

開發者們正在積極地為 Web 瀏覽器以及 NodeJS 這些 JavaScript 宿主環境添加 ECMAScript6 的新功能，這是我們步入 JavaScript 應用開發的不可缺失的一環。塊級作用域綁定、解構賦值、迭代器與生成器、Promise 與異步編程、代理與反射，曾因為激進而未做發布的 ECMAScript4 里，原來早都想到了這些概念，現在終得落實。本書由《 JavaScript 高級程序設計 》的作者撰寫。

通過推薦本書，我們還可以感悟到：
ECMAScript6+ 更好的支持了前端自動化開發和 JavaScript 應用開發，先從扎實 ECMAScript5 開始學起吧！

其它相關書籍，可以類比：

《 ES6 標準入門(第三版) 》

中文版出版時間：2017-01

“在瀏覽器中輸入網址到看到網頁內容”過程中，到底發生了什么？”一問經常會被提及，于是有了這本嚴謹又不失有趣的書，完完整整的講解了整個過程我們所要了解的技術點。

客戶端：Web 瀏覽器、TCP/IP、網卡驅動、集線器、路由器

服務端：防火墻、緩存服務器、網卡驅動、TCP/IP、Web 服務端程序

如果上面的關鍵字你不能輕松的說出它們的原理和聯絡的話，就看看這本這本書吧。

通過推薦本書，我們還可以感悟到：
一個簡單的問題，真的可以深挖出一本書來，如果那是由你寫出來的話，就更不一樣了。

其它相關書籍，可以類比：

《 計算機是怎樣跑起來的 》

中文版出版時間：2012-03

網絡硬件、網絡軟件；網絡協議、網絡安全。理論與工程結合，仔細閱讀，足見學者的深厚功底。

通過推薦本書，我們還可以感悟到：
圖文生動的書縱然有趣，能通讀這類更專業的計算機書籍也是一種實力。

其它相關書籍，可以類比：

《 計算機網絡:自頂向下方法 》

《 TCP/IP詳解 》

中文版出版時間：2013-07

從理想的 OSI 網絡模型到實際的 TCP/IP 模型，每個層級都有很多協議在進行管理。應用層面向我們封裝好了底層細節，只需要我們互相通過接口協議來通信?？v使這樣，大前端工程師也應掌握好這幾個模型的基礎。我們常常喜歡簡潔的、生動的書來介紹苦澀的概念，那么這本以“圖解”命名的網絡原理書將十分符合你的口味。

通過推薦本書，我們還可以感悟到：
很多理想的東西落入實際中后常會產生變體，學習的過程中善于抓住重點，變體的原型便會顯露的出來。

其它相關書籍，可以類比：

《 圖解服務器端網絡架構 》

《 圖解 HTTP 》

中文版出版時間：2013-12

JavaScript 從誕生之初就可以運行在服務端上，只是沒有很好的展現機會。現在，NodeJS 終于將 JavaScript 在服務端上重新綻放開來。JavaScript 是單線程的，因此我們需要事件機制和異步編程來支持非阻塞模型，這在傳統服務端語言里都是很少用到的特性，從而讓 NodeJS 如此與眾不同。

這本書由國內作者樸靈所注，初版了四年，依然是國內最好的講述 Node 的書籍。每一章選題鮮明，通過對進程線程、網絡協議、內存控制、前端路由的詳細講解，讓我們體驗了更多的 Linux 和編程之美。

通過推薦本書，我們還可以感悟到：
只有對 Linux 內核機制、服務端編程的深入掌握，才能寫出這樣棒的大前端書籍來，我們學習的時候千萬不要設限自己，前端尤是如此。

其它相關書籍，可以類比：

《 Node 與 Express 開發 》

《 精通 Linux 》

中文版出版時間：2017-01

學習 Node 的時候，我們總容易沉浸在 npm 倉庫帶來的各種有趣的第三方模塊上，Node 核心基礎的知識反而被疏忽。這本書既講述了大量的核心概念，有又很多的代碼示例，仔細閱讀，能讓我們從對 Node 的一無所知到深入淺出，最終編寫自己健壯的第三方模塊。

通過推薦本書，我們還可以感悟到：
關于講述實戰的書籍要慎重選擇，在閱讀過程中要注意在大量的代碼中抓住重點。

其它相關書籍，可以類比：

《 Node.js 微服務 》

中文版出版時間：2016-11

掌握好 JavaScript 的核心概念、設計模式、語言標準、模塊化開發以及 Node.JS 相關知識后，可以看看這本講解 SPA (單頁面 Web 應用)開發的書。傳統服務器端的架構可以分為表現層、服務層、業務層和數據層，向客戶端返回渲染后的頁面。SPA 架構讓我們可以預先下載整個前端框架，渲染、前端路由等功能都能很好的在客戶端處理。

通過推薦本書，我們還可以感悟到：
SPA 帶來的時代，讓前后端數據的交流越來越需要注重接口的設計。我們可以用 RESTful 來設計我們的接口；前端在開發時，也可以使用 Mock 等技術來模擬后端還未上線的接口服務；前后端分工將再次高效起來。

其它相關書籍，可以類比：

《 單頁 Web 應用: JavaScript 從前端到后端 》

中文版出版時間：2013-02

大前端開發離不開軟件工程領域，軟件工程又是整個計算機科學體系的一個篇章。在最后的“軟件工程薦書品書”章節，我們以這本講述早期硅谷黑客故事的書籍為引，將我們的目光重新凝聚在整個行業之上。

通過推薦本書，我們還可以感悟到：
或許當我們出生之時，這些故事注定成為了我們的歷史。未來是什么，永遠沒人能確定。在計算機里，我們可以依據一定的科學觀，無中生有的創造著我們想象的世界。尤其在 Linux 推動的開源世界下，程序員間跨國際的平等交流前所未有，注定將會被記錄在歷史之上。

其它相關書籍，可以類比：

《 一路編程 》

《 若為自由故 自由軟件之父理查德 斯托曼傳 》

《 只是為了好玩：Linux之父林納斯自傳 》

《 人月神話 》

《 編程珠璣(第2版) 》

《 浪潮之巔 》

《 軟件隨想錄 》

《 重構——改善既有代碼的設計 》

《 程序員修煉之道:從小工到專家 》

《 UNIX 編程藝術 》

很感謝你耐心地看到了這里，本文的書單分享也就到了尾聲。細心的你讀到這里會發現，每個配書籍封面截圖的書籍都不是憑空分享出來的。就像在“JavaScript 薦書品書”章節中，我們主要介紹了六本書——《 JavaScript 權威指南 》、《 JavaScript 語言精粹 》、《 JavaScript 異步編程 》、《 JavaScript 忍者秘籍 》、《 JavaScript 設計模式 》和《 深入理解 ES6 》。這六本書又分別從詳細論述、概要凝練、異步開發、重點突破、設計模式和語言標準等角度進行了很好的填充?！捌渌嚓P書籍”也告訴我們這六本并不是唯一的選擇。編程語言不設限，學習方向不設限，讀書更得不設限。這時也就能重新呼應主題，來繪制出我們專屬的書籍成長之路。

可見這些書籍是服務于具體知識點的，這些知識點又該以怎樣的形式有條理出現在我們的面前呢？以下內容均由筆者整理，是為臨稿，目的是開拓視野而不是諾列客觀事實，不具有任何官方性質，長期維護在我的 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 國際許可協議】進行許可。