今天我們會來介紹前端的框架之一：Vue

Vue 的特點是他的結構與我們傳統開發的靜態頁面架構相似：

// 就是 HTML
<template></template>

// JavaScript
<script></script>

// CSS
<style></style>

也因為結構與最熟悉的原生架構相似，讓他有著十分親民的印象，只要先了解 Vue 的生命週期、語法糖、資料夾（專案）結構，就能夠對 Vue 有了些基礎概念。

目前最新的版本是 Vue3，與上一個版本 Vue2 之間的最大差別在於 Composition api 與 Options api 的差別，這邊會先對 Vue2(options api) 進行介紹，而用 Vue3(composition api) 的變化作為補充。

• 專案建立
• 基本語法
  • template 上的變數
• 條件渲染
  • v-if
  • v-show
• 迴圈
  • v-for
• 事件觸發
• 表單的綁定（v-modal）
• 生命週期
• watchers
• Refs

參考

Vue introduction