当前位置: 首页 > 科技观察

这6个前端在线开发工具就够了

时间:2023-03-21 16:15:30 科技观察

1.EnjoyCSSEnjoyCSS提供了一个简单的交互界面,对于那些不擅长CSS的人来说是一个救星。设计元素并自动输出相应的CSS代码。它可以输出LESS、SCSS代码,甚至可以指定支持哪些浏览器和浏览器,以及浏览器的最低版本。使用起来非常方便,缺点是不适合做复杂的前端项目。2.PrettierPlayground[Prettier]是一个代码格式化工具,在操作界面的左右两栏,左边是原始代码,右边是格式化后的代码。支持多种代码格式,[JSX]、[Angular]、[Vue]等。它会去除代码原有的风格,用标准化的代码风格代替。大多数IDE都支持Prettier工具。值得一提的是,Prettier还有一个在线版本,同样可以在浏览器中格式化代码。个人推荐通过gitpre-commithook配置Prettier:hook可以保证整个团队使用统一的配置,免去重复配置IDE或编辑器的麻烦。如果是以前的项目,钩子也可以设置成只格式化单个变化。文件甚至代码片段,避免在IDE或编辑器下使用Prettier时不小心格式化大量代码,淹没commit的主要变化,让review代码非常痛苦。3.Postman是一个非常好用的测试后端API接口的工具。一直以来都是前端工作必备的工具之一。支持GET、POST、DELETE等多种方法,v7.2已经开始支持GraphQL。4.StackBlitz是一款深受用户喜爱的在线IDE。[StackBlitz]将常用的IDEVisualStudioCode移到了浏览器中。支持一键配置Angular、[React]、Ionic、TypeScript、RxJS、[Svelte]等JavaScript框架,无需浪费时间在本地重新搭建环境,可以快速启动代码部分。5.Bit.devBit.dev是一个开发工具,可以大大提高代码重用率,共享可重用的组件和片段,减少开发量,加快开发进程。它还支持团队共享,允许团队中的开发人员和设计人员一起协作重建设计系统。查看组件依赖关系,浏览组件代码,甚至可以在线编辑代码并查看预览效果!选择好组件后,可以通过Bit.dev的命令行工具bit在本地项目中导入组件,也可以通过npm和yarn导入组件。6.CanIUse[CanIUse]可以帮助开发者检查他们的应用程序在主流浏览器中的支持程度,避免浏览器兼容性问题。类似的工具还有很多,后面会介绍给大家。那么,在这些工具中,您认为哪一个有您认为需要改进的地方?