鐵人檔案
Vue.js是一個open source的js framework，因為以前對這個框架不是很熟悉，想藉由這30天好好整理一下這個框架的整體概念，而不是片段的學習了哈哈哈。
什麼是Vue.js？ 在這個網頁前端開發的工程，Google下的AngularJS與Facebook下的ReactJS，因為將前端的開發系統化，開發上比較方便...
Web元件化系統是Vue.js一個很重要的概念，我們使用官網提供的一張圖來做詳細解釋 上方右圖是一個樹狀結構，Vue.js嚮往的就是先建立好根實體(Vue I...
認識Instance Lifecycle與Instance Lifecycle Hooks 上圖為官網所繪製的Instance Lifecycle(生命週期)...
認識Virtual DOM DOM(Document Object Model)的中文翻成**「文件物件模型」**，是HTML、XML、SVG文件可以使用的一組...
大致了解Vue的一些比較重要特色之後，再來我們來看看怎麼建置Vue的環境與專案，要開始進行實作部分了。 建立環境 開始之前，電腦需要有Node.js環境與NPM...
專案整體架構 當我們使用webpack樣板初始化一個完整的vue專案，該專案資料夾內基本架構如下圖： static資料夾內存放的是“真正的”靜態資源，他們不...
在大致了解以webpack樣板建置的專案架構後，我們接下來來了解整個app運作流程。 當我們下npm run dev這個指令後，啟動http server，這個...
推薦好用的工具：Vue.js devtools 這篇介紹開始之前，最近發現一個開發vue時還不錯用的chrome插件，想推薦大家使用，這個插件是Vue.js d...
前一篇介紹的指令可以將資料與vue instance之間做綁定，那假設我們想讓HTML元素中的屬性和vue instance做綁定，Vue有提供一個指令v-bi...
我們看到的網頁，了解使用者對UI元件的操作，不會只有是在表單元素內輸入或選擇內容，還有點擊按鈕或送出表單等等DOM事件，而事件的觸發會造成資料的異動，為了得知資...