作為開發者,我們每天都在使用我們的瀏覽器做各種各樣的事情,從google搜索,在堆棧溢出上尋找解決方案,到在Reddit上浪費時間(是的,我就是其中之一),但也測試和運行我們正在開發的應用程序。這就是為正確的工作使用正確的工具的關鍵所在。
在這篇文章中,我們將介紹一些我最喜歡的瀏覽器擴展,以提高我作為web開發人員的工作效率。
窗口大小
在Chrome商店的窗口大小調整
這個令人驚嘆的擴展做了顧名思義的事情。它允許你改變屏幕的大小。簡單但非常有用,如果你需要驗證你的網站在不同的分辨率和視圖。這個擴展提供了一組預定義的選項,但是你可以修改它們來滿足你的需要,這最后一個選項使它比簡單地使用Chrome開發者工具更好。
您是否曾經想過某個特定站點正在使用哪些技術?不用再懷疑Wappalyzer了。這個擴展不僅僅是一個CMS檢測器或框架檢測器:它揭示了幾十個類別中的一千多種技術,如編程語言、分析、營銷工具、支付處理器、CRM、CDN和其他。
不要讓外表欺騙了你,這可能不是最漂亮的工具欄,但它確實很強大。這個擴展為你的瀏覽器添加了一個工具欄,有許多有用的web開發功能的選項,如激活/不激活腳本,彈出窗口。控制cookie或查找創建窗體、圖像、樣式等方法的函數。
我個人已經不再使用這個擴展了,但在過去我還不太熟悉HTML和CSS的許多方法時,它非常有用。
此擴展允許您輕松檢查哪些字體和字體屬性正在應用于任何文本在一個網站。字體可以產生巨大的差異時的設計你的網站,你可以使用這個工具來確保他們都是應該,或者甚至一個字體一個特定的網站信息正在使用,您還可以使用它在你的。
與什么字體類似,ColorZilla擴展允許你獲得網站上任何像素的顏色。此外,還提供了一些便利的工具,如調色板瀏覽器和漸變生成器。
這是一個非常有趣的工具。
免責聲明:這是一個工具,我不使用,也不打算使用。使用不廣泛,評分也不高,但在twitter上被大力推薦。
這個擴展修改了所有元素的CSS,這樣你就可以很直觀地看到每個元素的邊界在哪里。這在調試CSS布局問題時是至關重要的。
你不需要對此進行擴展,它可以很容易地通過一些CSS實現,所以如果你不想使用這個擴展(就像我一樣),請查看我的文章CSS技巧驗證布局
結論
擴展可以使我們的生活更輕松,就像我今天列出的那些一樣。如果您知道任何其他可以幫助開發人員提高工作效率的工具,請留下評論,我可以將它們合并到本文中。