你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

作者 | Chidume Nnamdi

译者 | 孙薇,责编 | 伍杏玲

头图 | CSDN 下载自视觉中国

出品 | CSDN(ID:CSDNnews)

以下为译文:

笔者将在本文中分享自己在开发生涯中常用的11种前端工具。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

CanIUse

地址:https://caniuse.com/

有时候不太确定某个Web API与浏览器、手机浏览器能否兼容?这个工具让你轻松测试Web API与浏览器的兼容情况。

当我们想要了解哪些浏览器及相应版本支持Web Share API:navigator.share(…)

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

在工具里简单查询便可查看结果。如图,列出了所有支持navigator.share(…)的浏览器及相应版本。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

Minify

地址:http://minify.com/

我们使用这个工具让即将发布到生产环境中的应用代码包缩减至最小,通过删减空格、无效代码等操作,使得应用包显著缩小,从而令浏览器的加载时间缩短。

这款在线工具minify.com支持压缩Web应用。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

Bit.dev

地址:https://bit.dev/

Bit.dev可用来托管、记录、管理来自不同项目的可复用组件。对于增加代码重用、加速开发和优化团队协作极其有效。

这也是我们从头构建设计系统的好选择,因为它具有设计系统所需的一切。Bit.dev可以与Bit这款处理组件隔离和发布的开源工具完美匹配。

Bit.dev支持React、React、TypeScript、Angular、Vue等许多库。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

上图展示了在Bit.dev中搜索共享React组件的过程。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

Unminify

地址:https://unminify.com/

这款工具可以逆转压缩操作,支持对JS、CSS及HTML代码的反压缩。通过解压缩、反混淆及美化,可以让一段压缩后的JS代码再次变为可读的。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

Stackblitz

地址:https://stackblitz.com/

这款工具适合所有人,Stackblitz让我们可以在Web上使用Visual Studio Code。

只需点击一下,Stackblitz即可快速支持Angular、React、Vue、Vanilla、RxJS、TypeScript项目。

当你想用浏览器尝试执行一段代码,或是任何操作当前JS框架的某个功能时,Stackblitz就会大显身手。假如你正在阅读一篇Angular文章,想要尝试其中的代码,就可以最小化浏览器并快速搭建一个新的Angular项目了,非常快速简便。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

JWT.io

地址:https://jwt.io/

使用json网络令牌(JWT)来保障应用安全性,或是用JWT来支持用户访问后端受保护资源的情况下,决定是否应当访问路径或资源的方法之一是检查令牌的到期时间。有时候,我们希望解码某个JWT以查看其有效负载,就可以使用jwt.io。

这款在线工具支持上传token令牌,来查看有效负载。可以采用粘贴,jwt.io就会对令牌进行解码,并显示其有效负载。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

BundlePhobia

地址:https://bundlephobia.com/

当我们不确定node_modules的大小,或想要确认某个即将安装在机器上pakckage.json的大小时,就可以使用BundlePhobia,它让我们可以了解某个npm包添加到前端软件包后对系统性能的影响。

这款工具可上传单个package.json文件,并展示从package.json所安装的依赖项大小。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

Babel REPL

地址:https://babeljs.io/en/repl

Babel是一个免费的开源JS转编译器,可将ES6 代码转为旧的ES5 JS代码,由Bebeljs团队开发。这款工具允许尝试添加到ES的内容,或者某些特定阶段添加到ECMA的内容,还可美化代码、限制文件大小,让使用者在转编译的过程中尝试不同的版本。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

Prettier Playground

地址:https://prettier.io/playground

Prettier是一个偏向JS代码格式化程序。通过解析代码,并使用JS重新输出,来实现一致性样式。这款工具在我们的开发中广泛使用,它有在线平台来美化代码。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

Postman

地址:https://www.postman.com/

这款工具可快速测试自己的API:GET、POST、DELETE、OPTIONS、PUT,笔者正在用这款工具,值得一试。

你值得拥有的 11 个前端开发利器(你值得拥有的 11 个前端开发利器英文)

JSLint

地址:https://jslint.com

在JS linter的世界中,JSLint排名最高。这款在线工具可在浏览器中插入一段JS代码或JS文件,这是一款静态代码分析工具,用于检查JS源代码是否符合编码规则。

原文链接:https://blog.bitsrc.io/12-useful-online-tools-for-frontend-developers-bf98f3bf7c63

本文为 CSDN 翻译,转载请注明来源出处。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

(0)
上一篇 2024年5月6日 下午7:09
下一篇 2024年5月6日 下午7:21

相关推荐

  • 党建强引领 履职增实效——兴安盟政协党建工作综述(党建引领,履职尽责)

    兴安盟政协机关以习近平新时代中国特色社会主义思想为指导,深入学习宣传贯彻党的二十大精神,以高质量党建引领高质量履职为目标,紧紧围绕新时代党的建设新要求和新时代党的组织路线,坚持“1…

    科研百科 2023年7月9日
    287
  • 点镜scrm系统具备crm软件功能又可以管理企业微信(企业微信点镜SCRM)

      广州某保险公司微信使用案例:   这两年,广州一家保险公司业绩与日俱增,在同类行业崭露头角,企业品牌在行业内具有一定的影响力,员工数量由几十人增至数百人。公司的日常业务从电话沟…

    2022年6月24日
    295
  • “新时代·新速度·心服务”——德州高速交警党建领航,打造过硬队伍

    德州市公安局高速交警支队紧紧围绕“政治建警、从严治警”方针,锚定“四个铁一般”公安铁军标准,旗帜鲜明抓党建带队建,始终坚持“四个不放松”,有力提振了队伍战斗力、凝聚力,全力推动德州…

    科研百科 2023年1月3日
    429
  • 工地项目五大领导班子

    工地项目五大领导班子是指工地项目的核心领导团队,包括项目经理、项目总监、设计师、工程师、安全员等。这些人员负责监督和协调工地项目的各个方面,以确保项目的顺利进行和高质量交付。 项目…

    科研百科 2025年1月3日
    0
  • 党委委员党组织书记副书记党龄

    党委委员党组织书记副书记党龄 我是一名普通的党员,党龄已有XX年。在过去的XX年中,我受到了党的的培养和教导,在党组织的帮助和指导下,我不断学习、成长,成为一名合格的党员。 在党龄…

    科研百科 2024年10月22日
    0
  • 科研项目怎么描述文章

    科研项目的描述 科研项目是一个研究项目,通常由科学家或其他专业人员组成,旨在解决特定的科学问题或社会问题。科研项目的描述通常包括以下方面: 1. 研究目标:科研项目的研究目标通常是…

    科研百科 2025年3月25日
    0
  • 项目 技术状态管理系统

    项目技术状态管理系统 随着软件开发领域的快速发展,项目技术状态管理系统已经成为了软件开发过程中必不可少的一部分。一个完善的项目技术状态管理系统可以帮助软件开发团队更好地管理项目进度…

    科研百科 2024年12月20日
    0
  • 国家电网博士后冯琼

    冯琼,国家电网博士后,是一名杰出的能源专家。她致力于研究电力系统,特别是电力系统的稳定性和可靠性。在她的努力下,她取得了许多重要的成果,并发表了很多高水平的论文。 冯琼的研究方向主…

    科研百科 2024年11月16日
    2
  • sql 宾馆管理系统项目设计

    SQL 宾馆管理系统项目设计 随着互联网技术的不断发展,宾馆管理系统已经成为了酒店行业不可或缺的一部分。一个有效的宾馆管理系统不仅能够提高酒店的效率,还能够提升客户满意度。本文将介…

    科研百科 2025年1月10日
    0
  • 项目人力资源管理(项目人力资源管理的特点)

    人力资源管理概述 项目人力资源定义 人力资源是人类可用于生产产品或提供各种服务的能力、技能、知识和可提供的商誉价值。项目人力资源,是指能推动整个项目发展的所有相关者的能力。 项目人…

    科研百科 2023年11月26日
    162