在網頁設計開發的歲月裡，我共用了以下幾項編輯器（舊－新）

Dreamweaver

資深者最懂 XD ，雖然沒有再用它，但它的影像地圖功能還是無人能敵，
還是好用丫～～丫～～～

Sublime

幾年前開始想朝"前端"技術學習時，周圍的工程師朋友們都用這款開發工具，
當初自己也用過一陣子，但對於安裝外掛擴充工具，一個習慣中文介面DW開發的我，
不管快速鍵、語系、擴充工具設置，等等....一下子很難接受。
對我而言就像一下子面對一個很陌生的「程式領域」
對從設計角度轉向"程式"而言，除了要轉個腦袋外，連工具都要完全不同，
當時摸索好一陣子，也覺得一直有個門檻！太過工程的介面，我過不去 ＝..＝
(就當我視覺動物，看到美美介面才不害怕吧)

Brackets

官網：http://brackets.io/index.html

這也是一款adobe出的免費、開放原始碼的純文字網頁編輯器。
當它還是Beta版時就開始試玩。
它的介面及優勢對我來說介於DW、sublime中間，而且利於設計師碰程式的適應。
Brackets一樣可以安裝外掛、可所見即所得、貼近網頁設計轉前端的學習路，
所以在還沒習慣sublime前就轉至跳至Brackets使用。
對我而它還是很好的開發工具，但市場上討論及使用的朋友真的不多啊～
而且2015-2016年那時的文章介紹都很基本（也沒有什麼新文）

我想另一個原因sublime後來的擴充很多也可以達到Brackets優勢。
但還沒遇見VSCode前我真心是愛它的！
也或許更是因為有B的適應才讓我面對VSCode，才這麼快上手！
而二年前推薦B給設計的朋友使用，她後來也都用B做一些基本網頁
因為介面太帥氣，讓鄰坐的工程師朋友還來問：妳不是設計師嗎？怎麼也要寫程式？XD
這就是工慾善其事，必先利其器.....就是把別人先嚇倒（哈哈哈）

Visual Studio Code (簡稱 VSCode ）

官網：https://code.visualstudio.com/

這款是由微軟開發的編輯器。
在經歷過前面各不同的編輯器，直到我荒廢前端學習數月後，
某一天振作又捨起「前端」這條學習路！
為了撰寫 SCSS 來開發，但它需要"編譯"轉為CSS。
因此只好憑著一絲絲好友以前教過的，sublime & compass 設定，
就開始了摸索MAC安裝環境，但經過數日後～
發現.....這對我而言是花星文＋滿頭星星
（）

心想：難道要放棄自己DIY的堅持？ 正在準備放棄投奔至好友家求救時，突然.....

在最後爭札的某夜裡爬著網路文發現很多大大的教學影片是用VSCode的介面，
還更多大大在做分享推坑文！！！？？
因此產生了好奇，就連續幾天就把所有的相關 VSCode、SASS/SCSS 影片翻出來看！
做好筆記、開始安裝、習慣快速鍵、開始翻找每種適合我的VSCode擴充工具！
只要透過這編輯器的按鈕＋搜尋就可以簡簡單單安裝好工作環境！
再加上剛好遇見一個前端大大要開SCSS的線上教學課程，就剛好一起報名下去～

接著這一個多月，我就愛上了**VSCode **
對於一個不熟程式又害怕英文的設計師而言，這就像一盞明燈啊！
在這裡還是不得說一聲，如果你是單純平面設計轉網頁設計或前端，
真心推 **VSCode ** 編輯器！

以下就來分享一下，那一夜到底是誰點醒了我這夢中人，
讓我現在每天都播出時間用 VSCode 編寫 SASS/SCSS

*六角學院 VSCode 介紹 - 編譯 Sass、除錯、插件介紹
*Alex宅幹嘛 [ Alex 宅幹嘛 ] ?‍?開掛囉!!! VSCode 工作學習效率加倍術
*Alex宅幹嘛 [ Alex 宅幹嘛 ] ?‍? Visual Studio Code 大哉聊

如果也喜歡他們的影片，歡迎訂閱加分享，還有固定注意有技術分享討論的直播喔！
（純粹個人熱愛的好物、好站分享）