第一章：認識網頁開發

1.1網頁開發歷史

1.2 什麼是前端與後端

1.3 前端框架

1.4 JavaScript快速上手

1.5 本章重點摘要

?

第二章：Hello Vue3

2.1 快速使用

2.2 基礎語法

2.3 創建專案

2.4 專案結構

2.5 本章重點摘要

?

第三章：Option 語法

3.1 變數綁定

3.2 樣式綁定

3.3 if判斷式

3.4 for迴圈

3.5 函式

3.6 表單處理

3.7 元件

3.8 生命週期

3.9 監聽

3.10 模組化

3.11 實務應用

3.12 本章重點摘要

?

第四章：Composition 語法

4.1 變數綁定

4.2 函式

4.3 表單處理

4.4 元件

4.5 生命週期

4.6 監聽

4.7 模組化

4.8 實務應用

4.9 本章重點摘要

?

第五章：路由

5.1 什麼是路由

5.2 參數傳遞

5.3 實務應用

5.4 本章重點摘要

?

第六章：專案部署

6.1專案發佈

6.2 Firebase部署

6.3 Netlify部署

6.4 本章重點摘要

?

第七章：整合 CSS 框架

7.1 整合 bootstrap

7.2 整合 tailwindcss

7.3 整合 daisyUI

7.4 實務應用

7.5 本章重點摘要

?

第八章：API 與 SDK 串接

8.1 Server API 串接

8.2 Back4app 串接

8.3 Firebase 串接

8.4 本章重點摘要

?

第九章：實務應用

9.1 輸入框警示

9.2 讀取按鈕

9.3 按鈕群組

9.4 檔案讀取

9.5 檔案上傳

9.6 動態表單

9.7 表單控制

9.8 拖曳效果

9.9 本章重點摘要

?

第十章：進階應用

10.1 自訂指令

10.2 動畫

10.3 SSR

10.4 本章重點摘要

?

第十一章：完整範例

11.1 記事本

11.2 部落格

?

第十二章：Quick Note

序言



　　筆者自 1998 年接觸網頁開發，那個時代還稱為Web1.0的時代，也就是單純的使用HTML來寫網頁。後來各家廠商的技術如雨後春筍般出現，如ASP與JSP等技術，讓網頁開發出現了新的格局，也造就出許許多多的新創公司，如Facebook與Youtube等。



　　生長在這樣的年代，身為開發者，必須要戰戰競競的面對新的技術，深怕有一天會被這些技術所追趕過去。20多年過去了，網頁開發依舊非常火紅，但似乎已經產生新的共鳴？



　　Vue、React與Angular這些非常熱門的前端開發框架，都是使用JavaScript的語法來開發，這個改變相對於過去的開發年代來說，實在是非常可喜可賀。因為對於開發者，只需要熟悉JavaScript語法，就能夠入門這些前端框架，實在是非常大的進步。且相對於App開發者來說友善許多了，不用在iOS或Android兩個平台來做選擇了，即便現在已經有Flutter或React Native等跨平台開發工具，還是必須要同時會iOS或Android兩種的編譯與上架方式。



　　至於2023年非常盛行的生成式AI工具，對於筆者來說，真的也只是一種工具而已，它只是比搜尋引擎快而已，但也不代表它不會出錯。身為一個開發者來說，熟悉所有開發工具是非常必備的，生成式AI只會告訴你一段程式碼，而這段程式碼最終還是必須要靠「人」來放入到適合位置。所謂適合的位置就會與開發經驗有關，也跟開發整合有關。然而這一切的根本，還是必須要懂所謂的基礎知識。我不可能完全不懂Vue，然後只靠生成式AI來幫我寫程式，最後還必須要可以改得動。一個有經驗的開發者，反而會去追求這個好不好修改，也造就出許多的框架或開發流程，而這所有的目的都是為了之後維護方便。



　　本書主要是針對想要學習網頁前端的開發，而又不知道如何開始的開發者，有一個非常基礎且入門的開始，從不會到會，從零開始學習Vue的網頁開發。如果你對於網頁前端開發非常有興趣，但卻又不知道如何開始，網路搜尋到的資料都無從所入，那麼本書就會非常適合你。希望本書可以扮演一個敲門磚的引入者，帶領你進入這個奇幻的開發世界。