序
Vue.js本身是JavaScript技術堆疊中的框架,但隨著前端專案規模的增加,JavaScript越來越難以勝任大型團隊合作的複雜專案的開發,TypeScript則彌補了JavaScript這方面的不足,程式設計的方式也更加現代化,因此Vue.js+TypeScript的組合越來越受前端開發人員的喜愛,已成為前端大型專案開發的一種趨勢。
本書以一個資深前端架構師的角度,從零基礎入手,通俗易懂地介紹了TypeScript的基礎語法和進階用法,以及Vue.js全家桶和週邊技術框架,並提供了豐富的範例和專案,旨在讓讀者邊學邊練,快速且紮實地掌握TypeScript的程式設計方法和Vue.js框架的各方面,並真正使用它們開發出商業級的應用程式。
內容結構
本書共分為17章。
第1章是本書的入門,簡單介紹了前端開發必備的基礎知識,包括HTML、CSS和JavaScript這3種前端開發必備的技能,以及JavaScript與TypeScript的關係,然後簡介了Vue.js框架,以讓讀者對本書所講的知識有一個初步印象。
第2~4章是TypeScript部分。
第2章介紹TypeScript中的一些基礎語法,包括開發環境的架設、基底資料型態、函數等相關知識。第3章介紹TypeScript中的物件導向程式設計,包括類別、介面等核心語法。第4章介紹TypeScript高階技術,包括TypeScript中的泛型、迭代器與裝飾器等。
第6~10章是Vue.js部分。
第5章介紹Vue範本的基本用法,包括範本插值、條件與迴圈著色的相關語法。第6章介紹Vue元件中屬性和方法的相關概念,並使用物件導向的想法進行前端程式開發,透過一個功能簡單的登入註冊頁面進行練習。
第7章介紹前端應用中使用者互動的處理方法,使用者互動為應用程式帶來靈魂。除介紹基礎的網頁使用者互動的處理外,還講解如何在Vue.js框架中更加高效率地處理使用者互動事件。
第8章和第9章介紹Vue.js中元件的應用。元件是Vue.js框架的核心,有了元件,才有了開發大型網際網路應用的基礎,元件使得專案的結構更加便於管理,工程的可維護與可擴展性大大提高,且元件本身的重複使用性也使開發者可以大量使用第三方模組,或將自己開發的模組作為元件供各種專案使用,極大地提高了開發效率。
第10章介紹Vue.js框架的回應性原理及Vue.js 3.x版本引入的組合式API的新特性。本章是對讀者開發能力的一種拔高,引導讀者在實現功能到精緻邏輯設計的方向上進步。
第11章介紹透過Vue.js框架開發前端動畫效果。前端是和使用者面對面的,功能本身只是前端應用的一部分,更重要的是給使用者帶來良好的使用體驗。合理地使用動畫是提升使用者體驗的一大法寶。
第12章介紹開發大型專案必備的鷹架Vue CLI和Vite的基本用法,管理專案、編譯、打包都需要使用鷹架工具。
在使用Vue CLI建構結構化的Vue應用前,我們都是透過在HTML中引入Vue.js框架直接使用的,這種方式編譯成功即可直接使用Vue.js提供的功能,這會讓讀者專注於Vue.js框架本身的語法特性,不分散精力在環境架設、語言編譯等工作流程上。因此,這一部分我們依然使用JavaScript來做Vue.js語法的演示。在使用鷹架工具後,編譯相關的工作流程將由鷹架完成,在後續的實踐項目中,讀者即可透過前面所學習的知識,結合運用TypeScript來開發完整的應用程式。
第13章介紹樣式美觀且擴展性極強的基於Vue.js的UI框架Element Plus,第14章介紹網路請求框架vue-axios,第15章介紹一款非常好用的Vue應用路由管理框架Vue Router,第16章介紹強大的狀態管理框架Vuex,透過Vuex開發者可以更進一步地管理大型Vue專案各個模組間的互動。
第17章透過一個相對完整的應用專案全面地對本書所涉及的Vue.js技能進行綜合應用,幫助讀者學以致用,更加深入地理解所學習的內容。
目標讀者
●正在學習前端開發的初學者
●擁有1∼2年工作經驗,想進一步提升的前端開發人員
●教育訓練機構的學員和大專院校的學生
最後,感謝支持我的家人和朋友,感謝北京清華大學出版社王金柱編輯的勤勞付出,使本書順利與讀者見面。感謝讀者的耐心,希望本書可以帶給你預期的收穫。限於本人水平,書中疏漏之處在所難免,敬請讀者們斧正。
張益琿