微信web开发工具调试h5_5个Web开发工具可提高您的生产力

微信web开发工具调试h5

对于开发人员而言&＃xff0c;时间始终是稀缺资源。 从苛刻的截止日期到多个项目&＃xff0c;再到意外的要求&＃xff0c;我们对时间的需求不断。 因此&＃xff0c;我们一直在寻找有助于提高生产率的工具和流程。 在本文中&＃xff0c;我们将研究五个Web开发工具&＃xff0c;它们可能会为您带来所需的额外生产力。

1.使用Oh My Zsh掌握命令行

Windows和OS X的默认命令行界面&＃xff08; Command Prompt和Bash &＃xff09;难以学习并且难以自定义。 如果您不是专家&＃xff0c;那么您最终可能会重复执行可以自动化的琐碎任务。

噢&＃xff0c;我的Zsh是在zsh之上构建的&＃xff0c;开源的&＃xff0c;社区驱动的框架。许多人发现&＃xff0c;命令行框架比默认选项更容易和更好。 噢&＃xff0c;我的Zsh提供了许多开箱即用的插件 &＃xff08;250&＃xff09;和主题 &＃xff08;140&＃xff09;&＃xff0c;使您可以根据自己的喜好自定义终端。 噢&＃xff0c;我的Zsh速度更快&＃xff0c;使用起来更舒适&＃xff0c;并且可以让您轻松地自动执行日常任务。 由于命令行正逐渐成为每个Web开发人员工作流程的一部分&＃xff0c;因此这可能是一种非常有效的工具&＃xff0c;可以将其纳入您的日常工作中。

在计算机上安装Oh My Zsh非常简单...

$ sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

就像安装插件和自定义主题一样。

噢&＃xff0c;我的Zish也拥有大量活跃的贡献者社区。 实际上&＃xff0c; 已有1,500多人为该项目做出了贡献 。

我使用该工具已有一年多了&＃xff0c;我喜欢它如何简化我的工作流程以及它在终端中的工作变得多么容易。 使用“哦&＃xff0c;我的Zsh”使我在命令行方面变得更加舒适和高效。 自动建议和别名特别加快了我的工作流程并提高了生产率。 我最喜欢的一些插件包括&＃xff1a;

• heroku&＃xff1a; Heroku CLI的自动完成
• zsh-autosuggestions&＃xff1a;auto建议使用以前的任何命令。
• NPM&＃xff1a;自动完成和别名NPM

2.使用失眠症即时测试API

测试REST端点可能很麻烦&＃xff0c;耗时且令人困惑。 Insomnia是一个免费的开放源代码&＃xff0c;跨平台的GraphQL和REST客户端&＃xff0c;它不仅功能强大&＃xff0c;而且还具有直观&＃xff0c;简单的UI&＃xff0c;可简化测试并简化我的一天。 一些失眠功能包括&＃xff1a;

• 代码段生成&＃xff1a;失眠可以为20多种不同的语言生成客户端代码&＃xff0c;包括NodeJS&＃xff0c;Go&＃xff0c;Swift&＃xff0c;Python&＃xff0c;Java&＃xff0c;C。
• 插件系统&＃xff1a;通过插件系统&＃xff0c;您可以扩展Insomnia的功能。 您可以创建用于呈现自定义值的自定义模板标签&＃xff0c;也可以使用Plugins API创建自定义颜色主题。
• 环境变量&＃xff1a;这些是可重用的值&＃xff0c;可在失眠症的任何文本输入中使用。 一些常见的变量是基本URL&＃xff0c;身份验证令牌和资源ID。

失眠的主要好处之一是对GraphQL的支持。 下面的演示显示了查询GraphQL端点的典型工作流程。 在这个例子中&＃xff0c;我送使用公共GraphQL API称为请求国家 。 传递URL时&＃xff0c;失眠会自动生成架构。 在左侧发送查询后&＃xff0c;它将在右侧返回响应。

该应用程序附带许多有用的功能&＃xff0c;可以简化您的工作流程。 例如&＃xff0c;在这里我们可以看到使用环境变量的能力。

使用API​​时&＃xff0c;通常会在多个请求中重复相同的值。 手动执行此任务可能很耗时且困难。 使用环境变量可以允许您定义一个值&＃xff0c;然后在需要的地方引用该值&＃xff0c;从而解决了此问题。

3.通过集线器增强Git超级能力

我们大多数人在GitHub上花费很多时间。 Hub是一个命令行工具&＃xff0c;可帮助您执行日常GitHub任务&＃xff0c;而无需不断从终端来回切换。 Hub打包git并使用其他功能对其进行扩展&＃xff0c;包括克隆存储库&＃xff0c;列出最新的未解决问题以及通过Gist共享日志或代码段。 Hub不仅使使用GitHub变得更容易&＃xff0c;而且通过将所有工具整合到一个环境中来提高生产力。

您可以使用集线器执行大量命令和操作。 这是安装命令的完整列表 。 您还可以通过在终端上运行命令man hub来找到列表。

4.使用DevDocs访问离线文档

我们都使用文档。 &＃xff08;我们中的一些人相当多&＃xff01;&＃xff09;当您使用多种技术的堆栈时&＃xff0c;在一组文档之间不断地来回切换可能既费时又不方便。 DevDocs解决了这个问题。 DevDocs是一个免费的开放源代码工具&＃xff0c;可在一个干净且井井有条的Web UI中一次浏览多种编程语言和开发工具文档。

DevDocs提供&＃xff1a;

• 即时搜寻
• 离线支持
• 移动支持
• 黑暗主题
• 键盘快捷键
• 和更多

DevDocs使阅读和搜索参考文档变得快速&＃xff0c;容易&＃xff0c;可访问和愉快。 而且&＃xff0c;由于可以离线支持150多个项目&＃xff0c;因此您无需担心保持与Internet的连接。 使用多种语言或工具时&＃xff0c;此工具特别有用。 例如&＃xff0c;我广泛使用它来同时阅读和搜索Vue和Cypress的文档。

5.使用SVGOMG缩放SVG图像

最后&＃xff0c;将齿轮转换为更实用的工具&＃xff0c;我们有了SVGOMG-免费的在线工具&＃xff0c;用于优化SVG文件。 SVG&＃xff08;可缩放矢量图形&＃xff09;图像优于其他格式&＃xff08;例如PNG或JPG&＃xff09;&＃xff0c;因为它们能够缩放并在各种设备和屏幕尺寸上保持响应。 使用SVG的一个缺点是&＃xff0c;由于冗余信息&＃xff08;例如编辑器元数据&＃xff0c;注释&＃xff0c;隐藏的元素以及默认值或非最佳值&＃xff09;&＃xff0c;文件可能会变得很大。 SVGOMG是安全删除和优化此数据以减小文件大小的工具。

上图显示了典型场景&＃xff0c;其中SVG文件已优化69.42&＃xff05;。 这是一个非常简单的工具&＃xff0c;但是它可以帮助提高网站的整体性能并避免网页上出现膨胀。 SVGOMG是SVGO&＃xff08;Optimizer&＃xff09;的UI实现&＃xff0c;它是基于node.js的命令行工具。

结论

寻找改善我们工作方式的方法很重要。 通过利用上述工具&＃xff0c;您可以提高生产力并简化工作流程。 开始确定可帮助您自动化工作流程的工具的优先级&＃xff0c;您将获得节省时间和提高生产率的回报。

翻译自: https://hackernoon.com/5-web-dev-tools-to-improve-your-productivity-gp163wmi

微信web开发工具调试h5