Visual Studio Code（簡稱 VS Code）是一個使用 Monaco Editor 作為其底層的免費原始碼程式碼編輯器，會選擇作為開發用軟體，有以下幾個優點
安裝流程可以依照官方文件
列幾個特別、好用的快捷鍵 詳細請見官方文件Ctrl + D 快速選取下一個同名變數Ctrl + H 取代Ctrl + P 選取檔案Ctrl+ Shift+ L 一次選取檔案內所有相同文字Ctrl + Shift + K 整行刪除Ctrl + Alt + ↑/↓ 垂直選取Alt + 左鍵 多重選取Alt + ↑/↓ 程式碼整行搬動F2 重新命名變數名稱
學習可以增加開發速度，以下列一些基本的應用官方文件
子元素 Child : >｜舉例 div>ul>li+tab ，會變成 ↓
<div>
<ul>
<li></li>
</ul>
</div>
同一層 Sibling : +｜舉例 div+p+bq+tab ，會變成 ↓
<div></div>
<p></p>
<blockquote></blockquote>
重複 Multiplication : *｜舉例 ul>li*5+tab ，會變成 ↓
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
群組 Grouping : ()｜舉例 (div>dl>(dt+dd)*3)+footer>p+tab ，會變成 ↓
<div>
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
</dl>
</div>
<footer>
<p></p>
</footer>
Class : . 、ID : #｜舉例 div#header+div.page+div#footer.class1.class2.class3+tab ，會變成 ↓
<div id="header"></div>
<div class="page"></div>
<div id="footer" class="class1 class2 class3"></div>
Class加變數 Item numbering : $｜舉例 ul>li.item$*5+tab ，會變成 ↓
<ul>
<li class="item1"></li>
<li class="item2"></li>
<li class="item3"></li>
<li class="item4"></li>
<li class="item5"></li>
</ul>
標籤內文字 Text : {}｜舉例 a{Click me}+tab ，會變成 ↓
<a href="">Click me</a>
Dark Reader 網頁啟用黑夜模式 愛護你的眼睛
JSON Formatter 看API不再眼花
Wappalyzer - Technology profiler可以看網頁使用什麼樣的語言、技術
使用情況 ↓
Wappalyzer - Technology profiler 漂亮的截圖整個頁面
看影片追技術