新一代的編輯器 — VSCode
You can find the English version at How VSCode Became the Ultimate Editor for Web Developers.
俗話說 「工欲善其事,必先利其器」。對於工程師來說好的編輯器是很重要的,因為最近剛好很多朋友在問我用什麼編輯器,所以就寫一篇文章來推坑 VSCode XD。

若你已經用過 VSCode 了,那看這篇可能會覺得有點無聊,建議可以直接看我寫的另外一篇「VSCode 如何提高我的寫扣效率」,裡面包含了比較多進階技巧
10 個我覺得 VSCode 很強大的地方
1. Color Picker
看到色碼時不知道顏色,或是寫 css 時不知道去哪裡挑顏色,不用再 google 找色碼表,直接用內建的 color picker 就可以了~

2. Git 整合
還在用git diff
看這次到底修改了什麼嗎(本人紅綠色盲看了極度痛苦XD)

快試試 VSCode 的 diff,連行數都幫你對齊好,改了什麼一目了然

3. Emmet
VSCode 內建 Emmet 省下刻 HTML 的時間,慢慢敲 HTML 看起來就很弱阿 XDD

4. 根據檔名或是引用跳到檔案


5. 自定義常用的程式碼片段
我前端寫 React.js 所以很常用到this.setState(() => ({ ... }))

6. 好看的檔案 icon
不同檔案類型有不同 icon,一看就知道是什麼檔案

7. 強大的 intellisense
不管是變數屬性、或是要帶什麼參數都有很好的提示


8. Multi Cursor
多個游標讓你可以一次修改很多地方

9. 自動 format
不用擔心 code 排版太醜,VSCode 可以自動幫你排版,若團隊有制定 coding style 也可以在 VSCode 中設定 ESLint

10. Debug
可以設斷點 debug,查看目前的 call stack 以及變數值

社群
除了功能強大之外,VSCode 也有很龐大的社群,有很多擴充功能還有主題可以選,VSCode 本身每個月也會至少更新一次

跟其他編輯器比較
1. Vim
在用 VSCode 之前我有很長一段時間都是用 vim,vim 可以做很多客製化,但缺點就是學習門檻還滿高的,還有記不完的快捷鍵XD,隨著 plugin 越裝越多設定檔也會越來越複雜,雖然如此它仍然是很好的編輯器,搭配 tmux 用起來也很順,我目前是寫大專案就用 VSCode,寫一些 script 或改改東西就用 vim。
在 VSCode 上也有 extension 把 vim shortcut 遷移過來,使用上完全不會有問題。
2. Sublime
我自己只用過一小陣子 Sublime,對他的印象就是 package manager 滿方便的,啟動速度也很快,但缺點就是很少更新(聽說最近更新了😱)而且沒有開源,所以有 bug 也沒辦法大家送 PR 一起修。如果要跳槽過來 VSCode 的話可以試試 Sublime Text Keymap 這個 extension,雖然我是 vim 派的沒有用過,但評價都還不錯。
3. Atom
我沒用過 Atom,但因為開源又是 Github 出的所以對他印象一直都不錯,之前看過介面也覺得滿漂亮,不過聽說開啟大文件的速度有點慢(不確定有沒有改善),因為我目前 VSCode 也用得很好,所以短時間內應該不會去試 atom,如果要從 atom 跳到 VSCode 的朋友其實介面滿像的,所以不用太過擔心,而且 VSCode 開啟的速度很快XD。
如果你還在各編輯器之間猶豫不決,我真心推薦用用看 VSCode,他大概是微軟做過最成功的專案了XD。其實在用 VSCode 之前我一直很討厭微軟,什麼 Microsoft ❤️ Linux 一定都是假的XDD,擁抱開源也只是說說而已。雖然我現在還是不太喜歡微軟,不過真的 VSCode 真的很好用~

如果有什麼你覺得超神的功能沒寫到、或是有使用上的問題也可以在下面留言跟我說