決戰!微前端架構 Micro Frontends:新一代可擴展的網頁開發模式,實現各種框架的無縫整合與溝通
Michael Geers 著 林亭儀 譯
- 出版商: 旗標
 - 出版日期: 2023-09-25
 - 定價: $820
 - 售價: 7.9 折 $648
 - 語言: 繁體中文
 - 頁數: 416
 - ISBN: 9863127108
 - ISBN-13: 9789863127109
 - 
    相關分類:
    
      Microservices 微服務
 - 此書翻譯自: Micro Frontends in Action
 - 
    相關翻譯:
    
      微前端實戰 (簡中版)
 
立即出貨(限量)
買這商品的人也買了...
- 
                
                  
                  
                遊戲化實戰全書:遊戲化大師教你把工作、教學、健身、行銷、產品設計……變遊戲,愈好玩就愈有吸引力!(Actionable Gamification: Beyond Points, Badges, and Leaderboards)$480$408 - 
                
                  
                  
                WEB 設計職人必修 UX Design 初學者學習手冊$420$332 - 
                
                  
                  
                $534深入淺出大型網站架構設計 - 
                
                  
                  
                提升程式設計師的面試力|189道面試題目與解答, 6/e (修訂版) (Cracking the Coding Interview : 189 Programming Questions and Solutions, 6/e)$980$774 - 
                
                  
                  
                深入淺出設計模式, 2/e (Head First Design Patterns: Building Extensible and Maintainable Object-Oriented Software, 2/e)$980$774 - 
                
                  
                  
                Three.js 前端三維圖形開發案例集錦$768$730 - 
                
                  
                  
                Solidity 實戰全書:完整掌握智能合約!成為獨立開發 Dapp 的區塊鏈工程師$650$507 - 
                
                  
                  
                戰術 + 技術 + 程序 -- ATT&CK 框架無差別學習$880$748 - 
                
                  
                  
                Test-Driven Development 學習手冊$580$458 - 
                
                  
                  
                你就是不寫測試才會沒時間:Kuma 的單元測試實戰 -- Java篇(iThome鐵人賽系列書)$650$507 - 
                
                  
                  
                「新」SEO 超入門!打敗 AI、征服搜尋引擎,洞悉使用者需求的必備指南$630$536 - 
                
                  
                  
                $1,306高質量用戶體驗:恰到好處的設計與敏捷 UX 實踐 (第2版 特別版)(全四冊) - 
                
                  
                  
                【資安密碼系列】秘密不再是秘密:輕鬆認識密碼學 - 打造你的數位安全防線$500$390 - 
                
                  
                  
                SRE 實踐與開發平台指南:從團隊協作、原則、架構和趨勢掌握全局,做出精準決策$620$484 - 
                
                  
                  
                遊戲設計 X 演算法 X TypeScript:出版社對我說「把祕笈通通交出來!」(iThome鐵人賽系列書)【軟精裝】$720$562 - 
                
                  
                  
                精通 API 架構|設計、營運和發展基於 API 的系統 (Mastering API Architecture: Design, Operate, and Evolve Api-Based Systems)$680$537 - 
                
                  
                  
                Docker 實戰 6堂課:56個實驗動手做,掌握 Linux 容器核心技術(iThome鐵人賽系列書)【軟精裝】$720$562 - 
                
                  
                  
                $611UI 智能化與前端智能化:工程技術、實現方法與編程思想 - 
                
                  
                  
                Agile 一本通!敏捷新手入門導引:你需要的敏捷觀念、工具、好用資源,看這本就夠!(iThome鐵人賽系列書)【軟精裝】$700$546 - 
                
                  
                  
                Python 設計模式與開發實務 (Python Programming with Design Patterns)$580$458 - 
                
                  
                  
                Code:隱藏在電腦軟硬體底下的秘密 (第二版) (Code: The Hidden Language of Computer Hardware and Software, 2/e)$680$537 - 
                
                  
                  
                Vue.js 3 前端測試入門從這裡開始:透過 Vitest + Vue Test Utils 實現自動化測試(iThome鐵人賽系列書)【軟精裝】$720$562 - 
                
                  
                  
                從異世界歸來發現只剩自己不會 Kubernetes:初心者進入雲端世界的實戰攻略!(iThome鐵人賽系列書)【軟精裝】$720$562 - 
                
                  
                  
                可觀測性工程|達成卓越營運 (Observability Engineering: Achieving Production Excellence)$680$537 - 
                
                  
                  
                JavaScript 設計模式學習手冊, 2/e (Learning JavaScript Design Patterns: A JavaScript and React Developer's Guide, 2/e)$580$458 
商品描述
內容介紹:
目前業界的軟體開發多半依照不同技術採水平分工模式, 例如:一組負責前端、一組負責後端, 但這跟一般企業的組織劃分有所不同, 導致所有開發案都必須跨部門、跨開發團隊進行協調, 團隊溝通變得越來越麻煩, 在經典之作《人月神話》(The Mythical Man-Month) 一書中就描述了這個情況。
▌擺脫傳統單體應用的思維, 現在就將微前端導入你的專案中! ▌
微前端架構提倡的則是另一種做法:將應用程式垂直拆解, 每個區塊交給一個專責團隊負責, 一條龍地包含從資料庫連接到使用者介面的開發。不同團隊的前端單元會在客戶端的瀏覽器內整合, 構成最終的頁面。用更容易理解的說法, 微前端就像是帶有使用者介面的微服務架構。
聽起來是要每個開發團隊各自為政, 相信有經驗的開發者可能馬上會想到:那採用不同的技術怎麼整合?會不會有效能瓶頸?類似的功能應該很容易重複開發吧?後端伺服器要各自架設?版本控制要各自維護?各做各的那介面怎麼統一?
微前端架構當然不可能毫無缺點, 以團隊的角度, 程式碼或資源的冗餘自然是無可避免, 不過只要配套機制運作得當, 所帶來的可擴展性、靈活性,仍然是利大於弊。本書就要教你怎麼無痛建構、轉換到微前端的開發架構。
別擔心要多學新的框架, 雖然確實有一些完全符合微前端概念的框架可以直接套用, 但作者想強調的是微前端架構的概念和選用時機, 若強迫用特定的框架, 很有可能馬上澆熄你的熱情。因此本書會在現有常見的網路技術規範下, 引入微前端的基本機制, 不管你的網站或應用程式採用哪種技術所建構, 幾乎都可以適用。
為了適用各種不同的情境, 作者提供了超過 20 個開發上的使用案例, 協助你將手上專案順利導入微前端的開發架構。除了技術上的交流, 作者也在書中提供不少團隊開發該留意的經驗分享, 界定好開發團隊的責任歸屬, 做好跨團隊間的溝通協調, 讓微前端架構發揮最大價值。
如果你受夠巨無霸一大包的前端單體架構所帶來的諸多困擾, 有了上述這些指引, 現在正是導入微前端架構的好時機, 對於新一代網頁開發人員、架構師或團隊領導者, 相信會帶來非常大的助益。
本書特色:
全書共收錄超過 20 個微前端架構的使用案例, 從簡單的超連結、iframe 和 Ajax 入門, 到較為複雜的 SSI 伺服器端內嵌、ESI、Tailor、Podium、Web Components 以及 app shell、通用渲染等, 並且讓你可以靈活將這些工具和技巧應用於真實情境中。
● 將不同的應用程式建構為統一的前端頁面。
● 無縫整合採用各種框架的 JavaScript 程式碼。
● 各種伺服端與客戶端的整合技術與頁面路由技巧。
● 協助釐清專案需求, 挑選正確的架構及整合技術。
● 建構設計系統的樣式庫, 提供一致性的 UI/UX。
● 提高團隊開發效率並優化專案執行流程。
作者簡介
Michael Geers
本書作者 Michael Geers 是一位專注於建構使用者介面的軟體工程師, 目前任職於德國奧斯納貝克的一間電子商務服務公司, 過去十多年參與許多大型的電子商務專案, 他熱愛各種前端技術, 並熱衷於系統設計與改善網頁性能, 也是 micro-frontends.org 網站的創辦人。
目錄大綱
目錄:
▌第一篇 踏上微前端的道路 ▌
第 1 章 章 何謂微前端?
1.1從大處著眼──微前端概觀
1.2微前端解決了那些問題?
1.3微前端的缺點
1.4你何時應該採納微前端?
第 2 章 我的第一個微前端專案:超連結及 iframe 整合
2.1拖曳機商店
2.2透過超連結轉頁
2.3透過iframe來組合頁面
2.4接下來做什麼?
▌第二篇 路由、整合及溝通 ▌
第 3 章 以 Ajax 整合區塊並使用伺服器端路由
3.1透過Ajax整合
3.2透過Nginx做伺服器端路由
第 4 章 伺服器端整合:SSI 與代理伺服器
4.1透過Nginx與伺服器端內嵌(SSI)來整合
4.2頁面區塊出錯的處理方式
4.3深入了解標記檔整合的效能
平行載入、巢狀頁面區塊、延遲載入、首位元組時間(TTFB)及串流
4.4其他解決方案的快速介紹
邊緣內嵌(ESI)、ZalandoTailor、Podium
4.5伺服器端整合的優缺點
第 5 章 客戶端整合:使用 Web Components及 Shadow DOM
5.1以WebComponents封裝微前端區塊
5.2使用ShadowDOM做樣式分離
5.3使用WebComponents做整合的優缺點
第 6 章 溝通模式:網址、屬性與事件
6.1使用者介面溝通
主頁面對頁面區塊、頁面區塊對主頁面、頁面區塊對頁面區塊、以BroadcastChannelAPI、適合使用跨UI溝通的時機
6.2其他溝通機制
全域contextinformation及身分驗證.、管理狀態、前後端溝通、資料複製
第 7 章 客戶端路由與 app shell:統一單體應用程式
7.1平面式路由的appshell
7.2appshell與雙層路由
7.3快速認識single-spa元框架
7.4開發統一單頁應用程式的挑戰
第 8 章 前後端整合技巧及通用渲染
8.1結合伺服器端及客戶端整合
SSI及網頁元件、團隊之間的契約、其他解決方案
8.2何時該使用通用渲染?
第 9 章 我的專案適合何種架構?
9.1專有名詞回顧
9.2複雜度比較
9.3你是在打造網頁還是應用程式?
9.4挑選正確的架構及整合技術
▌第三篇 如何做得快、一致且有效率 ▌
第 10 章 載入資源最佳化
10.1資源參照策略
直接參照、快取破壞及獨立部署、透過重新導向來參照、透過include來參照、同步標記語言檔及檔案版本號、行內程式碼、Tailor、Podium等整合方案
10.2bundle (打包檔) 的拆分程度
HTTP/2、全包bundle、團隊bundle、頁面及頁面區塊bundle
10.3隨選載入
代理微前端、延遲載入CSS
第 11 章 效能是關鍵:減少冗餘函式庫
11.1以效能為出發點來制定架構
11.2第三方函式庫:縮減與重複利用
第 12 章 使用者介面及設計系統
12.1為何需要一套設計系統?
設計系統的目的與角色、設計系統的好處
12.2中央設計系統vs.獨立自主的團隊
12.3執行期間整合vs.建置階段整合
12.4樣式庫的成品:通用vs.專用
12.5中央樣式庫該包含什麼?
第 13 章 以 Ajax 整合區塊並使用伺服器端路由
13.1調整系統與團隊
13.2知識共享
13.3橫切關注點
13.4技術多樣性
第 14 章 系統遷移、本地開發及測試
14.1遷移
漸進式遷移、前端優先、綠地專案及『大霹靂』
14.2本機開發
14.3測試









