# JS 額外補充資源 & 課程相關資源
###### tags: `youtube新手`

## JS補充資源
為了加強學習 Vue 前的基礎知識，

除了 本課程中的「課前章節 - JS 必備觀念」外，

另外卡斯伯老師也有額外補充許多 JS 知識，

除了課綱內的內容外，同時可參考以下資源 :D

JavaScript 陣列處理必學巧技 https://www.youtube.com/watch?v=_vFuDQ_6Xt8
JavaScript 那個 let, const, var 到底差在哪？ https://www.youtube.com/watch?v=FGdKdn_CnWo
JavaScript 常見考題破解：物件傳值？傳參考？https://www.youtube.com/watch?v=y1odVMpi6dU

## 課程相關資源

### 課程練習手冊：

https://github.com/hexschool/vue3-starter-files/tree/gh-pages

### Chrome 必裝的 Vue 開發套件：

Vue Devtools：

https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg

### 課程使用的 CSS 函式庫 Bootstrap：

六角學院翻譯中文版：

https://bootstrap5.hexschool.com/

### VSCode 相關套件：

講師使用的佈景主題：https://marketplace.visualstudio.com/items?itemName=akamud.vscode-theme-onedark

Live Server：https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer

Vue 官方提供的 Vue 整合插件：https://marketplace.visualstudio.com/items?itemName=octref.vetur

Vue 3 Snippets：https://marketplace.visualstudio.com/items?itemName=hollowtree.vue-snippets

繁體中文版：https://marketplace.visualstudio.com/items?itemName=MS-CEINTL.vscode-language-pack-zh-hant

中文版安裝說明：https://wcc723.github.io/development/2019/12/01/vscode-chinese/

其它推薦 VSCode 套件：

https://wcc723.github.io/development/2020/12/13/vscode-extension/

###### ＿＿＿＿＿＿

關於 Vue dev tools 的常見問題，有幾個地方可以檢查看看

- 需確保當前頁面一定要有 createApp 的程式碼（如果當頁有，可以另開新分頁確認，有時候重新整理也不會顯示）

- Vue 並非使用開發版本（課程中是使用開發版本）

- dev tools 並非對應 Vue 3 的版本，請確認是否使用 dev 版本（兩者僅能擇一開啟）

https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg

由於這是 Vue3 的版本插件，如果未來需要用舊版的插件

可以從 Chrome 的後台進行切換喔（左邊是 Vue3、右邊則是 Vue2）