18 個提高生產力的開發者工具
- 2019 年 11 月 25 日
- 筆記
本篇介紹一些提高生產力的工具,包括網站、瀏覽器插件、VSCode插件和命令行工具~
網站篇
Bundlephobia
如果你想要安裝一個新的依賴,這個網站可以查看這個依賴的大小、是否支持 tree-shaking 等各項指標。(僅限 npm 包哈)
https://bundlephobia.com/
Coolors
還在發愁自己某個項目的配色?可以來這個網站找找看。
https://coolors.co/
Carbon
可以把代碼變成好看的圖片,筆者之前的文章就使用過~
https://carbon.now.sh/
Snippet generator
代碼片段很好用,可是生成它們卻很麻煩,這個網站可以根據代碼一鍵生成。支持 VSCode
,Sublime Text
,Atom
。
https://snippet-generator.app/
Wolfram Alpha
如果你有一個複雜的表達式需要計算,或者很長的 if
語句想要簡化,可以用這個網站,它會幫你判斷各種條件,以及生成韋恩圖等數據圖表。
https://www.wolframalpha.com/
DevHints
速查表大全,包括 bash
,es6
,regexp
,vscode
等上百種 cheatsheets
https://devhints.io/
Caniuse
瀏覽器兼容性速查,browserlist
用的就是這裡的數據來兼容瀏覽器的。
https://caniuse.com/
Chrome 插件篇
FeHelper
超過 20 種實用小功能,包括字符串編解碼、JSON格式化、二維碼生成等。
https://www.baidufe.com/fehelper
Wappalyzer
幫你探測網站使用了哪些技術棧。
https://www.wappalyzer.com/
Screencastify
將你的網站錄成小視頻。
https://www.screencastify.com/
VSCode 插件篇
Bracket Pair Colorizer
括號高亮工具,快速找到你的另一半!(括號)
Bracket Pair Colorizer
Git Graph
Git 歷史記錄圖形化,有了它,我好像用不上 Sourcetree 了~
Git Graph
GitLens
神器!查看歷史記錄超方便~
GitLens
Live Share
VSCode 官方插件,遠程代碼分享。
Live Share
CLI 工具篇
ngrok
一行命令,內網穿透。演示本地項目必備。
https://ngrok.com/
serve
快速起服務,可用於調試打包後代碼!
https://github.com/zeit/serve
tldr
Too long; Didn』t read. 各種命令說明太複雜,用這個可以只看重點!
https://tldr.sh/
fkill
強殺進程,跨平台。
https://github.com/sindresorhus/fkill-cli
如果你還有其他好用的工具,歡迎留言分享哦~
參考文章
- 18 DevTools for productivity