[譯] 5 個可提高生產力的 Web 開發工具
摘要:我已經使用這個工具一年多了,我喜歡它簡化了我的工作流程,讓我在終端工作變得非常簡單。Hub不僅使使用GitHub變得更容易,而且通過將所有工具整合到一個環境中來提高生產力。
來源:https://medium.com
作者:Michael Bogan
翻譯:前端外文精選
對於開發人員而言,時間始終是稀缺資源。
從嚴格的最後期限到多個項目——到出乎意料的需求——我們的時間總是有需求的。因此,我們一直在尋找有助於提高生產率的工具和流程。
在本文中,我們將介紹五種Web開發工具,它們可能會爲您帶來所需的額外生產力。
通過Oh My Zsh掌握命令行
Windows和OS X的默認命令行界面(命令Prompt和Bash)可能令人生畏且難以自定義。如果你不是這方面的專家,你可能會重複那些可以自動完成的瑣碎工作。
Oh My Zsh [1] 是一個基於Zsh的開源社區驅動框架, Zsh [2] 是一個命令行 shell,許多人發現它比默認選項更容易和更好。
Oh My Zsh 提供了許多開箱即用的 插件 [3] (250)和 主題 [4] (140),使您可以根據自己的喜好自定義終端。
Oh My Zsh 速度更快,使用起來更舒適,並且可以讓您輕鬆地自動執行日常任務。由於命令行正逐漸成爲每個Web開發人員工作流程的一部分,因此這可能是一種出色的生產力工具,可以將其整合到您的日常工作中。
在計算機上安裝Oh My Zsh非常簡單。
$ sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
同樣簡單的是安裝 插件 [5] 和 可定製的主題 [6] 。
Oh My Zsh 也擁有大量活躍的貢獻者社區,實際上,已有1,500多人爲該項目做出了貢獻。
我已經使用這個工具一年多了,我喜歡它簡化了我的工作流程,讓我在終端工作變得非常簡單。使用Oh My Zsh幫助我變得更加舒適和高效。尤其是自動建議和別名加快了我的工作流程並提高了生產率。我最喜歡的一些插件包括:
-
Heroku:Heroku CLI的自動完成
-
zsh-autosuggestions:自動建議以前的任何命令
-
npm:npm的自動補全和別名
測試API的Insomnia
測試REST端點可能很麻煩,測試REST端點可能很麻煩,你可能用過Postman,還有新興的Postwoman。 Insomnia [7] 是一個免費且開放源代碼,跨平臺的GraphQL和REST客戶端,不僅功能強大,而且還帶有直觀,簡單的UI,可簡化測試。它簡化了我的一天,Insomnia的一些特徵包括:
-
生產代碼片段:Insomnia可以爲超過20種不同的語言生成客戶端代碼,包括Node.js,Go,Swift,Python,Java和C。
-
插件系統:插件系統使您可以擴展Insomnia的功能。您可以創建用於呈現自定義值的自定義模板標籤,也可以使用Plugins API創建自定義顏色主題。
-
環境變量:這些是可重用的值,可用於Insomnia中的任何文本輸入。一些常見的變量是基本URL,身份驗證令牌和資源ID。
Insomnia的主要好處之一是對GraphQL的支持。下面的演示顯示了查詢GraphQL端點的典型工作流程。
在此示例中,我使用稱爲 countries [8] 的公共GraphQL API發送請求。傳遞URL時,Insomnia會自動生成模式。在左側發送查詢後,它將在右側返回響應。
該應用程序附帶許多有用的功能,可以簡化您的工作流程。例如,在這裏我們可以看到使用環境變量的能力。該應用程序附帶許多有用的功能,可以簡化您的工作流程。
使用API時,通常會在多個請求中重複相同的值,手動執行此任務可能很耗時且困難。使用環境變量可以解決這個問題,它允許您定義一個值——然後在需要的地方引用該值。
使用Hub增強Git的超能力
我們大多數人在GitHub上花費很多時間。 hub [9] 是一個命令行工具,可幫助您執行日常GitHub任務,而無需不斷從終端來回切換。
hub封裝了Git,並通過其他功能對其進行了擴展,包括克隆倉庫,列出最新的未解決問題以及通過Gist共享日誌或代碼段。Hub不僅使使用GitHub變得更容易,而且通過將所有工具整合到一個環境中來提高生產力。
您可以使用hub執行大量的命令和操作。 這是安裝命令的完整列表 [10] 。您還可以通過在終端上運行命令 man hub
來找到列表。
使用DevDocs訪問離線文檔
我們都使用文檔(其中有些人使用了很多文檔)。當您在多個技術棧中工作時,經常在文檔集之間來回切換既耗時又不方便。
DevDocs [11] 解決了這個問題。DevDocs是一個免費的開源工具,可以在一個乾淨、有組織的web UI中一次性瀏覽各種編程語言和開發工具文檔。
DevDocs提供:
-
即時搜索
-
離線支持
-
移動端支持
-
黑暗模式
-
快捷鍵
-
更多...
我用它來處理多種語言或工具。例如,我大量使用它來同時閱讀和搜索Vue和Cypress的文檔。
使用SVGOMG縮放SVG圖像
最後,切換到更實用的工具,我們有 SVGOMG [12] ——一個用於優化可伸縮向量圖形(SVG)文件的免費在線工具。
SVG圖像優於其他格式(例如PNG或JPG),因爲它們能夠縮放並在各種設備和屏幕尺寸上保持響應。使用SVG的一個缺點是,由於冗餘信息,比如編輯器元數據、註釋、隱藏元素和默認值或非最優值,文件可能會變得非常大。
SVGOMG是一個安全刪除和優化這些數據以減少文件大小的工具。
上圖顯示了一個典型場景,其中SVG文件已優化69.42%。這是一個非常簡單的工具,但是它可以幫助提高網站的整體性能並避免網頁上出現膨脹。SVGOMG是SVGO Optimizer的UI實現,它是基於Node.js的命令行工具。
總結
找到改進工作方式的方法很重要。通過利用上面的工具,您可以提高工作效率並簡化工作流程。
開始對可幫助您自動化工作流程的工具進行優先級排序,您將獲得節省時間和提高生產率的回報。
參考資料
Oh My Zsh: https://ohmyz.sh/
Zsh: https://www.zsh.org/
插件: https://github.com/ohmyzsh/ohmyzsh/tree/master/plugins
主題: https://github.com/ohmyzsh/ohmyzsh/tree/master/themes/
插件: https://github.com/ohmyzsh/ohmyzsh/tree/master/plugins
可定製的主題: https://github.com/ohmyzsh/ohmyzsh/wiki/Themes
Insomnia: https://insomnia.rest/
countries: https://countries.trevorblades.com/
hub: https://github.com/github/hub
這是安裝命令的完整列表: https://github.com/github/hub#installation
DevDocs: https://devdocs.io/
SVGOMG: https://jakearchibald.github.io/svgomg/
感謝您的閱讀和關注,看完三件事:
如果對你有幫助,幫忙文章右下角點個 在看 如果有什麼問題歡迎 留言 交流,還可以 轉發 ,這是對作者最大的幫助。