---
tags: Vue.js
---

手把手帶你認識前端框架---Vue.js
===

- [Vue.js簡介](/mNg_xitEThK0Fmo_V-gPJA)
- [Vue開發環境安裝](/ys8P29IgRli47zz9RB5nZA)
- [建立Vue的應用程式](/YR6l4RukQuK8_m9oe-ABiw)
- [MVVM架構與雙向綁定](/fo2wf8eRQY2AF_E5yKS4Dg)

指令
---
- [v-text模板綁定](/3HXfOJSOQhup2T33QTcVlg)
- [v-html模板綁定](/dFLej9EgR3GpTmwMDXvYPw)
- [v-show](/SS2hbb7XT6mqmsdVt2btMw)
- [v-if](/akK2UbSQRCK_0sIwegx1Rw)
- [v-bind屬性、樣式綁定](/Nqa1P4-iRr-YCWxGPA-F-A)
- [v-for](/vrGS-f7oRSiGBlTUV6LckA)
- [v-on事件綁定](/-EF-_HA8Qoq213LBDL2stg)
- [v-class](/VKUUIh6VSYeOxvHHnJpasg)
- [v-model資料雙向綁定](/7vAVFgDmS6CqoDzP7bdaCQ)

Vue的生命週期
---
- [Vue的生命週期](/vSJVCiUFQUShdQNrdbhdDA)

元件
---
- [什麼是元件](/5EWY9XufQv-oE1oGJ3sQEw)
- [Vue單一元件檔(.vue)](/JqAtvo2yQjydiB11L6TgDw)
- [使用 props 將數據傳遞給子組件](/laq2WC2gTVSF9bHkYPF3_Q)
- [使用＄emit監聽子組件事件](/g4n292R9SCGZrRpXGbE7ag)

計算屬性與監聽器
---
- [計算屬性 Computed](/prvIrJ7SQrqJoRHJmruTOw)
- [監聽器 watch](/mKgNm_RxRwqUyP7BLUtOqw)

Vue CLI
---
- [Vue CLI 介紹](/kbWaxjGSTXuGFv10c9EZAQ)
- [安裝 Vue CLI](/BCpij30QQ56yxg3U2rcKAw)
- [透過 Vue CLI 建立專案](/OU2Oy-T3SnStk6Gw7SqnYQ)
- [Vue CLI 建立的專案結構](/yPbRJMCXTbqES2Fv3buH0w)
- [Vue CLI 環境設定與打包部署](/Y40r3u2gRFuH3BPgveebkQ)

Vue Router
---
- [Vue Router 介紹](/r_zqOD4hTmO4-sKFdllAeg)
- [Vue Router 安裝](/zxjCJ82yQL-KiPLs4XpU2g)
- [router-view](/CnCMHj9JRiuKTN3wNCurxw)
- [router-link](/D066p4TWRqiLWCVBecYoAg)
- [在JavaScript程式裡切換路由路徑](/xEMoQyJKRAeatg_sEvTPPQ)
- [動態路由](/G5_x98p8RdGl3qu87Io4Qw)
- [路由驗證](/lu2R0WJFS22dQzGFYFUEXA)

Axios
---
- [Axios](/ZTjb1mPMRduIry1qe4MPEQ)

Vuex 狀態管理
---
- [Vuex](https://next.vuex.vuejs.org/zh/index.html)

Bootstrap5
---
- [Bootstrap5](/jTK7Mwp8QAyEkIhjrjBc8w)

Element-Plus
---
- [Element-Plus](/spVdybSERB-Tod1eqcjDYA)

參考連結
---
- [精通 VueJS 前端開發完全指南 課程章節](https://hiskio.com/courses/145/lectures)
- [重新認識 Vue.js | Kuro Hsu](https://book.vue.tw/CH1/1-1-introduction.html)
- [五分鐘搞懂Vue.js的技術定位](https://jamesshieh.medium.com/%E4%B8%80%E5%A4%A9%E6%90%9E%E6%87%82vue-js%E7%9A%84%E6%8A%80%E8%A1%93%E5%AE%9A%E4%BD%8D-a556a4bf8a4f)
- [初学者，学习vue应该从何下手？](https://www.zhihu.com/question/319701702)
- [Vue-單一元件檔(Single-file components)](https://leahlin912.github.io/2019/06/12/Vue-%E5%96%AE%E4%B8%80%E5%85%83%E4%BB%B6%E6%AA%94(Single-file%20components)/)
- [A Complete Guide to Vue Lifecycle Hooks – with Vue 3 Updates](https://learnvue.co/2020/12/how-to-use-lifecycle-hooks-in-vue3/)
- [Extending Vue Component Templates](https://vuejsdevelopers.com/2020/02/24/extending-vuejs-components-templates/)
- [Extending Vue.js Components](https://vuejsdevelopers.com/2017/06/11/vue-js-extending-components/)
- [When To Use The New Vue Composition API (And When Not To)](https://vuejsdevelopers.com/2020/02/17/vue-composition-api-when-to-use/)
- [Day24 你要去哪裡? - Vue Router 路由-1](https://ithelp.ithome.com.tw/articles/10237296?sc=iThomeR)
- [Day25 你要去哪裡? - Vue Router 路由-2](https://ithelp.ithome.com.tw/articles/10243855)
- [iView](https://github.com/iview/iview)
- [vuejs/awesome-vue](https://github.com/vuejs/awesome-vue#examples)
- [vuejs/vue-hackernews-2.0](https://github.com/vuejs/vue-hackernews-2.0)
- [komavideo LearnVue3](https://github.com/komavideo/LearnVue3)
- [Bootstrap5](https://getbootstrap.com/docs/5.0/getting-started/introduction/)
- [Element Plus](https://element-plus.org/#/zh-CN/component/quickstart)