英文 | https://javascript.plainenglish.io/10-awesome-front-end-development-tools-to-boost-your-productivity-b1d2efc4c4ba
翻譯 | 楊小二
介紹
作為開發人員，我們總是需要使用一些資源和工具，這些資源和工具可以讓我們的生活更輕松，并在處理項目或學習某些東西時提高我們的生産力。現在網絡上有很多工具可用，并且專門為開發人員建立。其中很多都是免費的，你無需支付任何費用。
在本文中，我們将為你列出一些非常有用的前端開發工具，這些工具可以在網絡上免費獲得。
現在，讓我們開始吧。
1、 UiGradients
位址：https://uigradients.com/#Peach
UiGradients是一款出色的 Web 工具，其中包含一系列令人驚歎的顔色漸變，你可以自定義和選擇這些漸變。
你還可以擷取這些漸變顔色的CSS 代碼，或者直接以 JPG 格式下載下傳。
2、 APP響應式應用
位址：https://responsively.app/
這個工具可幫助你更快地開發響應式 Web 應用程式。對于所有前端開發人員來說，這是一個很好的 DevTool，因為它會讓你的工作更輕松。
3、 Public API
位址：https://public-apis.io/
Public APIs是一個網站，為開發人員提供了一系列免費的公共 API，例如電影 API、音樂 API、開放資料 API 等等。你也可以在那裡送出你自己的 API。
4、Undraw
位址：https://undraw.co/illustrations
Undraw是一個很棒的網絡應用程式，你可以在其中找到許多可以在網頁上使用的 SVG 圖像和插圖。
它還允許你将SVG 圖像嵌入到你的網站的能力相結合。
5、Lorem Picsum
位址：https://picsum.photos/
Lorem Picsum是一個簡單的網站，你可以根據自己的需要輕松擷取随機和特定的圖像效果。這是照片的 lorem ipsum。
6、DevDocs
位址：https://devdocs.io/
DevDocs是一個非常有用的開源 Web 應用程式，它在一個易于導航和通路的界面中組合了多個 API 文檔。它包含許多有關不同 Web 技術的文檔，你可以輕松通路和學習這些文檔。它也适用于離線模式。
7、Onepagelove
位址：https://onepagelove.com/
這是一個網站，它為你提供了一堆主題和模闆以及一些前端開發的學習技巧。這是一個你可以獲得靈感的好地方。如果你想使用它們，它們還能夠下載下傳免費模闆。
8、RegEx 101
RegEx 101是一款免費的正規表達式調試器，具有實時解釋、錯誤檢測和高亮顯示功能。它适用于 PHP、JavaScript、Python 和 Golang。
9、Prettier
Prettier是一個免費工具，你可以使用它來使代碼格式良好。它支援多種語言并與大多數編輯器內建，例如 VSCode、Sublime 等。
10、Flaticon
Flaticon允許你獲得 SVG、PNG 和其他格式的免費矢量圖示。你可以通路他們資料庫中的數千個圖示。這比建立自己的圖示要容易得多，這需要花費大量時間。
結論
如你所見，所有這些工具都是有用且免費的。它們允許你以簡單的方式完成不同的任務，以提高前端 Web 開發人員的工作效率。
感謝你閱讀這篇文章。希望你覺得它有用。
學習更多技能
請點選下方公衆号