編輯推薦
前端架構是一係列工具和流程的集閤,旨在提升前端代碼質量,並實現高效、可持續的工作流。對於大型Web項目,前端架構師和軟件架構師同樣不可或缺。
本書作者通過Red Hat公司真實案例分析以及以往經驗積纍的實用技巧,係統總結瞭前端架構的四個核心,詳細展示瞭新的前端開發準則,將Web開發提升到瞭一個新高度。
前端架構四個核心:
● 代碼——如何實現係統架構中的HTML、CSS和JavaScript
● 流程——構建高效並且防止齣錯的工作流所需要的工具和流程
● 測試——為網站搭建穩固基礎
● 文檔——規劃好係統設計藍圖
前端架構師職責:
● 體係設計——清晰描繪産品和代碼的最終形態
● 工作規劃——製定完整開發工作流
● 監督跟進——保證項目高效率完成
內容簡介
本書展示瞭一名成熟的前端架構師對前端開發全麵而深刻的理解。作者結閤自己在Red Hat公司的項目實戰經曆,探討瞭前端架構原則和前端架構的核心內容,包括工作流程、測試流程和文檔記錄,以及作為前端架構師所要承擔的具體開發工作,包括HTML、JavaScript和CSS等。
作者簡介
【作者介紹】
Micah Godbolt,前端架構師,作傢,播客播主,世界ji開源大會的培訓師和演講師。他在個人博客(https://micahgodbolt.com)中經常大力推廣前端架構、Sass、視覺還原測試和基於模式的設計方法。他齣生於太平洋西北地區,目前和妻子以及兩個孩子定居於波特蘭的郊區。
【譯者介紹】
潘泰燊
畢業於廣東外語外貿大學,曾就職於騰訊、百度等互聯網公司,參與過騰訊QQ空間、百度地圖等海量數據業務的Web開發工作,現就職於富途網絡。
張鵬
碩士畢業於中山大學,曾就職於百度、騰訊等知名互聯網公司,參與過基於LNMP架構的億級彆互聯網應用的設計與實現,目前從事NodeJS與前端開發。
許金泉
畢業於深圳大學,畢業後加入百度FEX,曾主導UEditor、百度國際化瀏覽器等前端開發工作,現就職於騰訊雲。
【審校介紹】
李弦
華為2012實驗室UCD交互設計師,Monash University交互設計碩士,前新東方英語教師,廣東外語外貿大學英語專業八級。
目錄
前言 xi
第一部分 引言
第 1 章 前端架構原則 7
第 2 章 Alpha 項目 11
2.1 慢而有力的開端 11
2.2 全副武裝 12
第 3 章 前端架構的核心 15
3.1 圍繞四個核心工作 15
3.2 四個核心的含義 16
第二部分 代碼核心
第 4 章 HTML 19
4.1 過去處理標記的方法 19
4.1.1 程序式標記:自動化程度 100%,可控程度 0% 19
4.1.2 靜態標記:自動化程度 0%,可控程度 100% 20
4.2 平衡可控性和自動化 21
4.3 這一切背後的設計係統 22
4.4 模塊化 CSS 理論的多麵性 22
4.4.1 OOCSS 方法 23
4.4.2 SMACSS 方法 23
4.4.3 BEM 方法 24
4.5 選擇適閤的方案 25
第 5 章 CSS 27
5.1 特性之爭與繼承之痛 28
5.2 一種現代的、模塊化的方法 30
5.3 其他有助益的原則 32
5.3.1 單一職責原則 32
5.3.2 單一樣式來源 33
5.3.3 組件修飾符 34
5.4 小結 35
第 6 章 JavaScript 37
6.1 選擇框架 37
6.2 維護整潔的 JavaScript 代碼 38
6.2.1 保持代碼整潔 38
6.2.2 創造可復用的函數 38
6.3 小結 40
第 7 章 Red Hat 代碼 41
7.1 過多的依賴 41
7.2 嚴重的位置依賴問題 42
7.3 設計分解 42
7.4 組件分類 43
7.5 BB 鳥規則 44
7.6 編寫你自己的規則 44
7.7 每個標簽指定唯一的選擇器 46
7.7.1 單一責任原則 46
7.7.2 樣式隻有單一的來源 47
7.7.3 可選的修飾符 47
7.7.4 可選的上下文 50
7.8 語義化的網格 53
第三部分 流程核心
第 8 章 工作流 57
8.1 過去的開發工作流 57
8.2 現代的開發工作流 58
8.2.1 需求 58
8.2.2 原型設計 58
8.2.3 程序開發 58
8.3 前端工作流 59
8.3.1 必要的工具 59
8.3.2 本地部署 59
8.3.3 編寫用戶故事 60
8.4 開發 61
8.5 發布 62
8.6 提交編譯後的資源 62
8.7 持續集成的服務器 63
8.7.1 標簽分支 64
8.7.2 究竟為什麼要這麼做 64
8.8 發布渠道 64
第 9 章 任務處理器 67
9.1 在任務處理器中完成一切 68
9.2 在項目中使用任務處理器 69
9.3 有明顯的優勝者嗎 71
第 10 章 Red Hat 流程 73
10.1 徵服最後一英裏 73
10.2 模式驅動的設計係統 75
第四部分 測試核心
第 11 章 單元測試 87
11.1 單元 87
11.1.1 更多重用 88
11.1.2 更好的測試 88
11.2 測試驅動的開發 88
11.3 一個測試驅動的例子 89
11.4 測試覆蓋率要多大纔足夠 90
11.4.1 解決分歧點 90
11.4.2 從測試覆蓋率開始 90
第 12 章 性能測試 91
12.1 製定性能預算 91
12.1.1 競爭基綫 92
12.1.2 平均基準 92
12.2 原始指標 93
12.2.1 頁麵大小 93
12.2.2 HTTP 請求次數 94
12.3 計時度量 94
12.4 混閤度量標準 95
12.4.1 PageSpeed 分數 95
12.4.2 Speed Index 指標 95
12.5 設置性能測試 95
12.5.1 Grunt PageSpeed 插件 96
12.5.2 Grunt Perfbuget 插件 96
12.6 小結 97
第 13 章 視覺還原測試 99
13.1 常見的質疑 99
13.1.1 不瞭解情況的開發者 100
13.1.2 不一緻的設計 100
13.1.3 舉棋不定的決策者 100
13.2 一個經過測試的解決方案 101
13.3 視覺還原測試的多麵性 101
第 14 章 Red Hat 測試方法 103
14.1 實踐視覺還原測試 103
14.1.1 測試工具集 103
14.1.2 設置 Grunt 104
14.1.3 測試文件 104
14.1.4 對比 105
14.1.5 運行全部測試用例 106
14.1.6 如何應對測試失敗 107
14.1.7 從失敗到成功 107
14.1.8 修改代碼以適應需求 108
14.1.9 將基準圖片放在組件目錄裏 108
14.1.10 獨立運行每個組件的測試集 109
14.1.11 測試的可擴展性 110
14.2 小結 111
第五部分 文檔核心
第 15 章 樣式文檔 117
15.1 配置 Hologram 117
15.1.1 Hologram 的文檔注釋塊 119
15.1.2 Hologram 編譯流程 120
15.1.3 Hologram 小結 121
15.2 SassDoc 121
15.2.1 安裝 SassDoc 121
15.2.2 使用 SassDoc 122
15.2.3 探索 SassDoc 123
15.2.4 深入瞭解 SassDoc 124
15.2.5 內部依賴 125
15.3 小結 127
第 16 章 圖形庫 129
16.1 何為 Pattern Lab 129
16.2 運行 Pattern Lab 131
16.3 首頁模闆 133
16.4 首變量 134
16.5 原子 135
16.6 發揮原子的作用 135
第 17 章 Red Hat 文檔 137
17.1 階段 1:靜態的樣式文檔 137
17.2 階段 2:重寫 Pattern Lab 139
17.3 階段 3:分拆模式庫和樣式文檔 142
17.4 階段 4:創建統一的渲染引擎 143
17.5 階段 5:自動創建新模式 144
第 18 章 總結 147
作者介紹 149
封麵介紹 149
前端架構設計 下載 mobi epub pdf txt 電子書
評分
☆☆☆☆☆
看瞭前麵四五章,很是精煉,很具有指導意義~
評分
☆☆☆☆☆
從架構角度講前端的設計,有助於實現更好的技術架構和體係,提升前端的性能和開發效率
評分
☆☆☆☆☆
好東西,價格便宜,快遞給力
評分
☆☆☆☆☆
前端學習超棒的兩本,一本是張鑫旭大神的css世界觀展現,一本是前端如何成為架構師
評分
☆☆☆☆☆
感覺說的都是大道理,跟聊天似的
評分
☆☆☆☆☆
還可以吧 對我這個初學者來說 還行
評分
☆☆☆☆☆
從架構角度講前端的設計,有助於實現更好的技術架構和體係,提升前端的性能和開發效率
評分
☆☆☆☆☆
性價比高,非常滿意,經常看看
評分
☆☆☆☆☆
可以,希望看後結閤實踐可以提升