这9种工具可以帮助开发人员改善工作流程

作为一名Web开发人员，我一直在寻找提高生产率的资源。随着时间的流逝，我在Evernote上收集了许多不同的在线工具，这些工具通过提供代码段，设计模式或仅提供出色的功能，以不同的方式为我提供帮助。

今天，我想与大家分享我经常使用的那些工具，这些工具是我的最爱。为了使您更轻松地浏览内容，我将其归类为以下主题之一：

Blush  允许您免费自定义和下载精美的插图，以供个人和商业使用。该网站易于使用且功能强大，您可以自定义每个插图的许多细节以创建独特的结果。他们提供了不同格式的图像下载，尽管某些扩展需要付费计划。尽管编写SVG时需要免费计划，但是您可以免费下载PNG图像。

DrawKit   提供100％免费的手绘矢量图和图标资源。他们还提供由Lottie提供支持的动画插图。这个网站很棒，插图很棒，使用了很多次，对此我感到非常满意。

您是否曾经在目标网页上访问过带有惊人背景图片的网站？您可能会认为这样的事情可能会花费很多钱，  免费插图  为您的网站免费提供了高质量和精美的背景图片，但是如果您想要图片的全高清版本，那会有些麻烦，但是要收取一笔不小的费用与之相关。

发展历程

如果您是Web开发人员或任何类型的开发人员，您都有可能知道  Stack Overflow  。但是，如果不是这样，您就会错过很多机会。在此网站上，您可以找到有关开发问题的所有答案以及更多信息。

如果您是前端开发人员，则可能已经非常了解浏览器之间的兼容性噩梦。例如，有时候，我们想使用简单的JS函数（如find（））来以后发现它们不适用于IE。每当您不确定浏览器javascript API或CSS属性的兼容性时，请确保签出“我可以使用”。

如果您想检查  JWT IO令牌，因为您想验证作用域或有效期，甚至可能看到有效负载，那么这是正确的资源。

CSS工具

有时，我们看到的网站上有漂亮的部分，用曲线或其他形状隔开，我们想在我们的网站上使用它们。但是复制其中一些形状可能会很棘手或耗时。Meet  Shape Divider，这是一个仅需单击几下即可使您为各部分生成基础CSS代码的工具。

如果您喜欢CSS动画，  那么Animista是您的网站。挤满了数十种易于使用的CSS动画，如果您想动手摘录或者只是在寻找灵感，它是理想的选择。所有动画都可以在其网站上预览，您可以在获取代码之前完全自定义它们。我是否提到它是免费的？

Web Code Tools  提供了几乎可以用CSS和HTML生成的所有生成工具，从渐变，边框和阴影到元标记信息，打开的图形等，它都是非常完善的工具，并且是构建网站的必备工具。

我希望所有对我有定期帮助的资源也能帮助您提高生产力或工作流程。如果您有我未列出的任何优秀资源，请共享它，以便我和其他读者可以从您喜欢的工具中受益。