本人是前端新手，想藉由鐵人賽讓自己更熟悉 Vue，所以將學習筆記分享給大家。
先附上官方文件，搭配官方文件服用可以更快速了解 Vue，文中若有觀念不正確之處，請不吝指教。
參考資料：Summer。桑莫。夏天的學習筆記

什麼是 Vue

簡單來講，Vue 是一種前端框架 ( Framework)，或者更準確一點，它其實是一種涵式庫 ( Library )，
搭配官方文件的解釋，Vue ( 讀做 View )，是一套簡單輕量的 JS 框架，專注於 View 層級及其對應的
變化，不只易於上手，也能和其他涵式庫或既有的專案整合，也適合開發單頁式應用程式 ( SPA, Single Page Application )，其核心概念有虛擬節點 ( Virtual DOM ) 及 資料的雙向綁定 ( Two-Ways Binding )，在後面會更詳細說明。

起手式

因為 Vue 是涵式庫，所以可以直接使用 CDN 的方式使用，不一定要使用 cli 。

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

載入 Vue 之後我們在 HTML 裡建立一個 app ，裡面是 Vue 作用的區域。

<div id="app">
  <p>{{ message }}</p>
</div>

然後在 JS 檔裡宣告一個 Vue 的應用程式。

var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  }
})

這時你的頁面應該就會顯示如下圖：

Hello Vue.js!

如果你成功顯示上面的結果，恭喜你成功做出一個 Vue 的應用程式了，不過這時可以再試試一項東西，
打開 console 頁面 ( Chrome 的 F12 )，並且輸入：

app.message = “Hello World”

你會發現，頁面上的結果變更了，這就是 Vue 的特色，操作資料形態來渲染頁面，是不是很特別呢？

下一篇將開始介紹相關屬性及模版語法。
那麼，明天再見囉！