ITPub博客

首页 > 应用开发 > Javascript > 5个可提高生产力的Web开发工具

5个可提高生产力的Web开发工具

原创 Javascript 作者:前端程序猿 时间:2020-04-12 20:39:17 0 删除 编辑

对于开发人员而言,时间始终是稀缺资源。

从严格的最后期限到多个项目——到出乎意料的需求——我们的时间总是有需求的。因此,我们一直在寻找有助于提高生产率的工具和流程。

在本文中,我将介绍五种Web开发工具,它们可能会为你带来所需的额外生产力。

5个可提高生产力的Web开发工具

通过Oh My Zsh掌握命令行

Windows和 OS X的默认命令行界面(命令Prompt和Bash)可能令人生畏且难以自定义。如果你不是这方面的专家,你可能会重复那些可以自动完成的琐碎工作。

Oh My Zsh是一个基于Zsh的开源社区驱动框架, Zsh是一个命令行  shell,许多人发现它比默认选项更容易和更好。

Oh My Zsh 提供了许多开箱即用的插件(250)和主题(140),使您可以根据自己的喜好自定义终端。

在这里小编建了一个前端学习交流扣扣群:132667127,我自己整理的最新的前端资料和高级开发教程,如果有想需要的,可以加群一起学习交流

Oh My Zsh 速度更快,使用起来更舒适,并且可以让您轻松地自动执行日常任务。由于命令行正逐渐成为每个Web开发人员工作流程的一部分,因此这可能是一种出色的生产力工具,可以将其整合到您的日常工作中。

5个可提高生产力的Web开发工具

Oh My Zsh

安装 Oh My Zsh非常简单。

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

同样简单的是安装插件和可定制的主题。

Oh My Zsh 也拥有大量活跃的贡献者社区,实际上,已有1,500多人为该项目做出了贡献。

我已经使用这个工具一年多了,我喜欢它简化了我的工作流程,让我在终端工作变得非常简单。使用Oh My Zsh帮助我变得更加舒适和高效。尤其是自动建议和别名加快了我的工作流程并提高了生产率。我最喜欢的一些插件包括:

  • Heroku: Heroku CLI的自动完成
  • zsh-autosuggestions: 自动建议以前的任何命令
  • npm:npm的自动补全和别名


测试API的Insomnia

测试REST端点可能很麻烦,你可能用过 Postman,还有新兴的 Postwoman。我要介绍的 Insomnia也很不错,它是一个免费且开放源代码,跨平台的 GraphQL和 REST客户端,不仅功能强大,而且还带有直观,简单的UI,可简化测试。它简化了我的一天, Insomnia的一些特征包括:

  • 生产代码片段:  Insomnia可以为超过20种不同的语言生成客户端代码,包括Node.js,Go,Swift,Python,Java和C。
  • 插件系统: 插件系统使您可以扩展Insomnia的功能。您可以创建用于呈现自定义值的自定义模板标签,也可以使用Plugins API创建自定义颜色主题。
  • 环境变量: 这些是可重用的值,可用于Insomnia中的任何文本输入。一些常见的变量是基本URL,身份验证令牌和资源ID。
  • 5个可提高生产力的Web开发工具

    Insomnia

    Insomnia的主要好处之一是对GraphQL的支持。下面的演示显示了查询GraphQL端点的典型工作流程。

    在此示例中,我使用称为countries的公共GraphQL API发送请求。传递URL时,Insomnia会自动生成模式。在左侧发送查询后,它将在右侧返回响应。

    5个可提高生产力的Web开发工具

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

    5个可提高生产力的Web开发工具

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

    使用Hub增强Git的超能力

    我们大多数人在 GitHub上花费很多时间。 hub是一个命令行工具,可帮助您执行日常GitHub任务,而无需不断从终端来回切换。

    5个可提高生产力的Web开发工具

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

    使用DevDocs访问离线文档

    我们都使用文档(其中有些人使用了很多文档)。当您在多个技术栈中工作时,经常在文档集之间来回切换既耗时又不方便。

    DevDocs解决了这个问题。DevDocs是一个免费的开源工具,可以在一个干净、有组织的web UI中一次性浏览各种编程语言和开发工具文档。

    DevDocs提供:

    • 即时搜索
    • 离线支持
    • 移动端支持
    • 黑暗模式
    • 快捷键
    • 更多...
    5个可提高生产力的Web开发工具

    我用它来处理多种语言或工具。例如,我大量使用它来同时阅读和搜索Vue和Cypress的文档。

    使用SVGOMG缩放SVG图像

    最后,切换到更实用的工具,我们有 SVGOMG——一个用于优化可伸缩向量图形(SVG)文件的免费在线工具。

    SVG图像优于其他格式(例如PNG或JPG),因为它们能够缩放并在各种设备和屏幕尺寸上保持响应。使用SVG的一个缺点是,由于冗余信息,比如编辑器元数据、注释、隐藏元素和默认值或非最优值,文件可能会变得非常大。

    SVGOMG是一个安全删除和优化这些数据以减少文件大小的工具。

    5个可提高生产力的Web开发工具

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


来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/69940844/viewspace-2685704/ ,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2019-07-14

  • 博文量
    180
  • 访问量
    109405