工欲善其事必先利其器。好的工具雖不是締造一位出色的開發者的充分條件，卻是必要條件。希望在這篇文章中分享的這些實用性工具可以在優化工作流上幫助到你。

Atom

Atom是Github推出的一個開源跨平臺文字編輯器。幾年間Atom都是我的第一選擇，它功能齊全，內建包管理工具，有智慧提示補全功能（auto-completion），幷包含精美的主題。

包管理器這個概念像一縷清風，來源於Sublime編輯器。Atom既可以使用APM，也具有簡潔直觀的GUI介面。無須修改配置檔案，可以直接使用。另外Atom支援CSS、HTML、JavaScript等網頁程式語言。它支援巨集，自動完成分屏功能，集成了檔案管理器。

作為一名設計師，靈感是創作的靈魂。DragDis是一個節省找靈感時間的工具，易於上手。安裝 Chrome擴充套件外掛，拖拽所有你想要儲存的內容。你可以把自己要儲存的資源分門別類，先建好資料夾然後把相應的內容拖拽至相應的資料夾即可。

我一般每週新建一個資料夾，這樣可以追蹤設計品味隨時間的變化。

DragDis還有全頁面的網格佈局，可用作很棒的情緒板，更多功能還等你親自去體驗。

iTerm是一款Mac上的終端增強工具，是Terminal更整潔的替代品。iTerm2提供更為強大的功能，如無限制分屏、自動完成、選中複製、剪下板記憶、全屏、內聯影象和搜尋等等，並仍在不斷完善。

Muzli

Muzli是一個Chrome擴充套件應用，聚集了Designer News、Dribbble、Behance等資源庫的內容，所有你需要的設計靈感這裡都有。

每次在Chrome Muzli中開啟新的標籤，你都會一眼看到各個網站的精選內容。

我最喜歡的一點是個人推薦模組，好像你擁有了一位私人助理，幫助你挑選最好的前端設計相關的文章。

很多設計師喜歡去有情調的地方比如咖啡廳來尋找創作的氛圍，Noizio將這種氛圍帶到家中。它提供了十月雨聲、喧鬧的巴黎咖啡廳、雷雨聲等10種不同的白噪音音效，它還可以讓使用者根據自己的喜好混搭音效。我最後固定使用的音效是這樣的一幅畫面：在一個雷雨交加的晚上，寂寞的旅人在野外生火取暖。

Invison是一個便捷的產品原型生成工具和工作流控制平臺，完美地配合前端和設計師之間的協作。它提供的不是準確的線框圖，而是一個快速原型的環境，可以把你的UX/UI草圖快速連線起來。數字型的線框圖和高保真的設計可以幫你測試app的工作情況，同時該工具還支援協作和分享功能，生成的線上原型可以支援任何人在產品原型的任何地方評論，便於準確的交流。

藍色部分是連結區域，點選後會到下一屏，便於設計師向用戶和開發工程師展示流變化，也適用於做一些初步的定性測試。

Invision近期釋出了一個新功能：Boards。Boards可以收集靈感和構建情緒板。與DragDis最大的不同是Boards具有協作性，可與團隊其他成員共同設計。

排版是設計中最重要的部分，這也是為什麼What the Font是我最喜歡的Chrome擴充套件程式之一。它可以幫助設計師找到網站所用的是什麼字型。

作為前端開發人員，我們需要經常查詢API或互動的介面，除錯網頁是否能夠正確是處理各種HTTP請求。Postman外掛就充當著這種互動方式的“橋樑”，它可以把各種模擬使用者HTTP請求的資料傳送到伺服器，以便開發人員能夠及時地作出正確的響應，或者對產品釋出之前的錯誤資訊提前處理，進而保證產品上線之後的穩定性和安全性。

Wappalyzer用於識別網站所使用的工具庫和框架。它有Chrome 擴充套件程式，下次當你想知道網站是用什麼庫才製作出特別的視覺效果的時候，嘗試使用 Wappalyzer吧。

Boom2

Boom是一個Mac的擴音器和聲音平衡器。當你碼程式碼需要一些音樂來加速生產力的時候，Boom是一個好選擇。

它有一系列預配置的音樂流派，jazz、hip-hop、電子樂等，也可以自由配置。Boom還包含一些聲音效果。

小編的話： 
好的工具可以有效提升我們的工作效率。如果你有想推薦的工具，歡迎在文章下面留言和大家分享~希望我們都能配置一個最適合自己的“工具箱”！