前端提升效率的工具
现在各行各业都在卷,你卷我卷大家卷;想要卷的好,工具不能少;使用高效的工具可以极大提升我们的开发效率,让你卷的更轻松,摸鱼更愉快~~~
接下来分享一些我经常使用的免费工具
本地软件
下面是一些电脑上安装的软件工具,排名不分先后
SwitchHosts
这是一款能够非常便捷的管理和修改hosts文件的软件,它可以同时支持Mac和Windows两大平台。
前端开发经常需要修改hosts
文件,windows系统需要进入C:\WINDOWS\system32\drivers\etc
下才能找到hosts文件, mac系统则需要通过sudo vi /etc/hosts
修改hosts文件,还需要记住路径;
使用工具的话,直接编辑内容,保存即可,省时省力。
SourceTree
这是一款git的GUI可视化管理工具,支持Windows和Mac平台。能够方便管理版本库和进行git操作,还可以查看和对比代码改动。
SourceTree
搭配BeyondCompare
工具进行代码对比效果更好。
我个人喜欢使用git命令行来进行git操作, 然后使用SourceTree
来检查和对比代码的细节改动。
iTerm2
官方介绍:iTerm2 是终端的替代品,也是 iTerm 的继任者。iTerm2 将终端带入现代,具有您从来不知道自己一直想要的功能。
iTerm2支持分屏,还可以定制主题,打造更美观的终端。
搭配zsh
、Oh My Zsh
、Powerlevel10k
让你拥有超强终端,具体的安装和配置可以参考这篇文章: iTerm2 + zsh + Oh My Zsh + Powerlevel10k 打造 Mac 下最强终端
ApiFox
官方介绍: API 文档、调试、Mock、测试一体化协作平台。Apifox = Postman + Swagger + Mock + JMeter。
这是一款免费的工具。功能齐全,便于团队协同开发,前后端、测试全流程闭环。
Proxyman/LightProxy
这两款软件都是mac系统免费的抓包软件。
Proxyman:
LightProxy:
mac系统抓包工具还有Charles
,不过要收费。
Alfred
Mac效率工具必备神器
这款软件不用过多介绍,类似这种多功能集成的工具也挺多,但是不影响它的知名度。没有它也可以轻松干活,但是好好利用的话,效率会提高很多。
具体的功能介绍和配置可以参考这篇文章: Mac 效率工具必备神器 —— Alfred
Clipy
一款免费的系统剪贴板管理软件,他可以记录最近拷贝的信息,便于重复使用。
前端开发过程中,ctrl+c
和ctrl+v
频率非常高,有了剪贴板管理工具,就可以方便的在剪贴板历史中拿到之前复制的内容,大大提高搬砖效率。
剪贴板管理软件有很多,功能也都基本类似,随便使用一款即可。
超级右键 Lite
增强mac系统右键功能的工具
这款软件可以定制右键菜单快捷功能选项,包括快捷新建各种文件,快捷进入终端、VsCode,截图、切换显示/隐藏等功能。
直接在app store
中下载即可
typora
这是一个markdown文件编辑器。无缝实时预览,所见即所得
markdown文档广泛运用于编写开发文档、技术笔记、博客、文章、公众号等等,一款好用的离线markdown文档编辑器少不了。
现在VsCode
安装相关的markdown插件也可以轻松编写markdown文档,在编辑体验商比typora
更灵活快捷,可以根据个人习惯使用。
在线工具
接下来介绍一些在线的工具网站
tinypng
一个免费的提供图片压缩的网站,压缩率和图片质量都挺高。
链接:tinypng
前端在优化图片体积时,经常会用到的一个网站,虽然有UI同学帮忙切图,但是自己动手,丰衣足食。
而且我还发现,UI同学也在用这个网站来压缩图片,这就很奇妙了。
还有一个gif图片制作、压缩的网站 ezgif,还包含一些其他功能。
npm.devtool.tech
这个网站有几个特色:
- 1、可以查看流行的npm包
- 2、在控制台中可以直接调用npm包的方法,在线调试npm包功能
- 3、能够上传项目的
package.json
文件并查看该项目使用的技术栈,可以查看各个依赖包的详细信息
控制台调试:
当你只是想测试下lodash
库时,没有必要下载lodash
库到本地,然后新建临时目录和文件进行调试。直接搜索lodash
, 然后就可以在控制台中使用lodash库了。
readme.so
这个网站可以让你快速编写一个github的README
文档,它内置了一些README
相关的模板模块,你只需要从选中模块,就可以将模块的模板添加到文档中,并在模板基础上进行修改。
链接:readme.so
shields.io
这些标签效果都可以在这个网站上进行定制,让你的README更美观
链接:readme.so
tool.lu
链接:tool.lu
在线的工具箱,这里列出了这么多工具,总有一款你会用得上。
tool.oschina.net
这也是一个在线工具箱集合
另外还有:站长工具
浏览器插件
一些必备的浏览器插件,可以参考我的另一篇文章,必备的chrome浏览器插件,你都用上了吗~~