介紹課程的學習目標和學習內容。

從前端開發趨勢分析開始，引入 MVVM 開發框架和 Vue.js，接著對比流行框架Angular 和 React，最後詳細介紹 Vue.js 的核心思想-資料驅動和元件化。

介紹 Vue 專案的腳手架，如何安裝，對腳手架生成的目錄檔案做介紹，介紹 Vue 元件的編寫方法，最後執行 demo 專案並介紹 webpack 構建指令碼來說明 demo 的執行原理。

分析外賣 APP 商家頁面的需求，準備圖片資源，利用 icon-moon 把 svg 製作成圖示字型，對程式碼的目錄結構設計，最後 mock 測試資料。

設計頁面的骨架，拆分元件，商品、評論和商家詳情頁利用 Vue-router 做切換，最後還介紹了 flex 彈性佈局以及移動端 1 畫素 border 實現的小技巧。

編寫 header 頭部元件，應用 Vue-resource 從服務端讀取資料，介紹如何在 Vue.js 中使用過渡動畫，如何編寫 css sticky footer 佈局，如何從需求中抽象出 star 星星元件。

編寫 goods 商品元件，包括它的子元件 shopcart 購物車。介紹瞭如何在 Vue.js 應用第三方 JS 外掛 better-scroll實現列表滾動，並配合 Vue.js 的計算屬性來實現左右列表的聯動。應用了自定義 Vue.js 過渡動畫實現了購物車的飛入動畫效果，介紹了在 Vue.js中父子元件如何通訊。...

編寫 food 商品詳情頁元件，介紹了圖片佔位的技巧，並從需求中抽象出的 split 分隔元件和 ratingselect 評論元件，實現自定義過濾器 datefilter。

編寫 ratings 評價列表頁，感受在 Vue.js 中複用元件的好處，實現快速開發。

編寫 seller 商家詳情頁，實現一套通用移動端資料存取方案，以及對專案做一些體驗上的優化。

上線前的最後一步，編譯打包Vue.js 專案。介紹了 webpack 編譯時的配置，如何利用node.js 開啟一個server本地除錯。

對課程做總結，並列出了課程所提到的主要知識點的連結，作為課程的延伸學習。

本章節把專案從1.0向2.0升級向大家做了簡要的介紹。