向你安利了一個編輯器,並丟給你一堆外掛

嘉雷發表於2017-11-16

關於編輯器

Atom是github在2015年推出的一款跨平臺開源編輯器,具有簡潔和直觀的圖形使用者介面,支援巨集,自動完成分屏功能,整合了檔案管理器。

支援Mac,Window,Linux作業系統。更主要的是,暫時是免費的喲,不需要付費,也不需要資金短缺的同學費勁的尋找科(po)學(jie)資源。

它有著很多很多無法讓人忽視的優點,可以讓你的程式設計生活變的更有意思:

  1. 超讚的顏值,可以說,現在的編輯器裡,它的顏值敢說數一數二的了,顏控必備,無可挑剔。

  2. UI上流暢的微互動動畫,帶你進入程式編譯的2.0世界,友好的Error提示框,彈出的BUG也顯得那麼可愛。

  3. 豐富的Packages,琳琅滿目的外掛,視覺化的UI安裝介面,又傻又白又甜,滿足你各種姿勢各種需求。

  4. github官方出品,git原生支援,這點的好處還用多說嗎。

  5. 無數的介面樣式主題,一種主題比一種好看,跟換桌布一樣隨便換,不再枯燥你的視覺,開啟你的腦路邏輯。

  6. 中文社群支援,英語不好的玩家不用再煩惱如何科學上網如何翻尋讓人頭疼的英文官網和社群。官網:https://atom-china.org/ (或搜尋Atom中文社群)

  7. 高階、高階、上檔次。

當然,不可避免的,它也有缺點。比如,因為它的來源,註定對SVN支援的較差,如果你很依賴SVN,那麼它可能不是那麼適合你;由於某些它的架構無法克服的原因,可能比Sublime慢一點,配置不太好的機器偶爾會卡一點。當然現在已經優化的非常好了。

開源社群github:https://github.com/atom/atom

中文論壇:https://atom-china.org/

官網:https://atom.io/

向你安利了一個編輯器,並丟給你一堆外掛

對於顏值,我想單獨說一下,很讓我驚訝。作為半拉程式設計師,半拉設計師,我是對互動流暢且介面顏色對使用者友好的編輯器很有青睞的,剛接觸到Atom的時候,我樂此不疲的調換著各種顏色各種操作,研究它的互動方式。令我意外的是,它對第一次接觸它的程式設計者,出奇的友好。

關於視覺的表現層,你可以直接從下面的圖片看到它的多樣性,每一種模式,無論是dark,還是light,都透露著非常小清新的味道,先不看它的內部,單看最淺層最直接面向使用者的操作體驗和視覺效果,無疑是讓人耳目一新獨一無二的。我很高興,因為這樣的朝氣蓬勃也讓我編碼的時候充滿活力。

向你安利了一個編輯器,並丟給你一堆外掛

這麼推薦它,當然不止顏值。無論是它和Sublime的快捷鍵完全相容,Project的管理更加直觀,重用npm社群的資源,更新快,還是它非常友好的操作方式和github的聲譽加成,都讓其有望成為最好用的編輯器之一。

A hackable text editor for the 21st Century

強大的社群支援註定不會普通,如果你還沒有一個好上手用得慣的編輯器,快試試我的安利吧。

向你安利了一個編輯器,並丟給你一堆外掛


關於主題

你可以在Atom官網上找到很多很多非常棒的UI主題,他們的配色都超級贊,你可以瀏覽器上看到配置上它們的樣子後,再決定你要不要裝上其中的某一個。這些是由開發的專案組官方和喜愛Atom的使用者們一起調配的,有很多特別棒,比如我就很喜歡 atom-material-ui 這個主題,如果你喜歡的話,你也可以裝一個酷酷的它來裝飾你的程式碼。

主題官網:https://atom.io/themes

向你安利了一個編輯器,並丟給你一堆外掛

那麼如果喜歡一個主題應該如何安裝呢?

你可以在Setting的社群資源Install裡,找到Themes,然後搜尋到這個主題。點選install安裝到你的Atom上。非常簡單吧,安裝後,可以在Setting的Themes板塊裡配置它,並選擇你喜歡的介面樣式。

向你安利了一個編輯器,並丟給你一堆外掛

當然如果你喜歡與眾不同,希望自定義自己的介面的話,也可以方便的在這裡更改UI的配置,任何RGB顏色都支援!無論是大紅大紫,還是滿屏原諒色,全部滿足你,嗯~~這真是太棒啦。

向你安利了一個編輯器,並丟給你一堆外掛


關於外掛

Atom最引人注意的一點就是它龐大的外掛支援,在這裡幾乎你能找到任何你想找到的編輯功能,為了增加文章的乾貨程度,我為大家簡單的介紹幾個非常好用的外掛,你可以在安裝了Atom後第一時間安裝它們,來豐富你的程式設計生活。

1、atom-ternjs

這是一個前端工程師必須的外掛,它有著對ES5、ES6、Node.js、JQuery、Angular的語法支援,這是必備的,所以你需要安裝它。

向你安利了一個編輯器,並丟給你一堆外掛

官網:https://atom.io/packages/atom-ternjs

github:https://github.com/tststs/atom-ternjs

向你安利了一個編輯器,並丟給你一堆外掛


2、atom-beautify

這個是強迫症,處女座的最愛。你可以使用它一鍵整理格式化你雜亂的程式碼,無論之前它有多麼糟糕,有多麼不堪入目,都可以一鍵整整齊齊,就像規範的那麼回事一樣。

向你安利了一個編輯器,並丟給你一堆外掛

官網:https://atom.io/packages/atom-beautify

github:https://github.com/Glavin001/atom-beautify

向你安利了一個編輯器,並丟給你一堆外掛


3、open-in-browsers

一鍵在瀏覽器開啟你編寫的靜態頁面,非常的方便快捷,真是很棒的功能。當然如果你在用某個框架的話,那麼這個用處不是很大。

向你安利了一個編輯器,並丟給你一堆外掛

向你安利了一個編輯器,並丟給你一堆外掛

官網:https://atom.io/packages/open-in-browsers

github:https://github.com/skandasoft/open-in-browsers

向你安利了一個編輯器,並丟給你一堆外掛


4、Emmet

啊,Sublime的使用者肯定非常熟悉它,這是喜歡使用Sublime的小夥伴大多數都會裝的一個外掛,它可以簡略化你編寫的程式碼,大幅度提升程式設計的效率,高效的前端工程師必備元件,具體的語法可以在官網上檢視。

向你安利了一個編輯器,並丟給你一堆外掛

官網:https://atom.io/packages/emmet

github:https://github.com/emmetio/emmet-atom

向你安利了一個編輯器,並丟給你一堆外掛


5、file-icons

這個真是太棒了,我超喜歡它,他可以讓你的project變得非常視覺化,一目瞭然。生活有時候就是多點這樣的顏色點綴才精彩,不是嘛?

官網:https://atom.io/packages/file-icons

github:https://github.com/file-icons/atom

向你安利了一個編輯器,並丟給你一堆外掛


6、highlight-line

再也不擔心加班碼程式碼找不到自己碼到哪行啦,明晃晃的提示你的所在行,真貼心。

向你安利了一個編輯器,並丟給你一堆外掛

官網:https://atom.io/packages/highlight-line

github:https://github.com/richrace/highlight-line

向你安利了一個編輯器,並丟給你一堆外掛


7、highlight-selected

也不用擔心你找不到單詞和游標了,雙擊就選中,Copy更加方便快捷,體驗深更半夜手指飛快的在鍵盤上敲打的感覺。

向你安利了一個編輯器,並丟給你一堆外掛

官網:https://atom.io/packages/highlight-selected

github:https://github.com/richrace/highlight-selected

向你安利了一個編輯器,並丟給你一堆外掛


8、activate-power-mode

很酷的一個外掛,打遊戲一樣的碼字快感,酸爽的連螢幕都在隨著你的手指震動,噼裡啪啦的簡直不能太痛快,還沒體驗過的同學趕快體驗一下吧。啊哈對了,還有Combo呢。

向你安利了一個編輯器,並丟給你一堆外掛

github:github.com/JoelBesada/…

向你安利了一個編輯器,並丟給你一堆外掛


關於外掛安裝失敗

向你安利了一個編輯器,並丟給你一堆外掛

安裝外掛彈出Error的時候不要慌,使用視覺化的介面進行安裝的方法有時候的確會出現這種錯誤,你可以試試命令列的安裝,參考一下論壇的帖子,感謝這位作者的分享。

CSDN:http://blog.csdn.net/loverain90/article/details/73028414


關於 Atom編輯器 的開發工具推薦,暫時就整理到這裡,還有什麼你喜歡用的外掛想安利給大家歡迎評論留言,我試用過後就會新增到文案裡,謝謝大家的閱讀。





相關文章