当前位置:网站首页>发现一款 JSON 可视化工具神器,太爱了!

发现一款 JSON 可视化工具神器,太爱了!

2022-06-27 02:43:00 Java知音_

点击关注公众号,实用技术文章及时了解701b58c90f35eefd92807052d6dd1631.png

简介

JSON Hero 是一个简单实用的 JSON 工具,通过简介美观的 UI 及增强的额外功能,使得阅读和理解 JSON 文档变得更容易、直观。

支持多种视图以便查看 JSON:列视图、树视图、JSON 视图等 列视图是受 macOS Finder 启发创建的一种浏览 JSON 文档的新方法

f6c423a695f16f364326c1211aa885f5.png

项目地址:

https://github.com/jsonhero-io/jsonhero-web

安装

要在本地运行 JSON Hero,首先 clone 源代码,并安装相关依赖项:

git clone https://github.com/jsonhero-io/jsonhero-web.git
cd jsonhero-web
npm install

然后运行以下命令启动,打开 http://localhost:8787 即可使用:

npm start

使用

前往 https://jsonhero.io/ 并将 JSON 文件拖拽到网站上,或在提供的表单中粘贴 JSON 或 JSON url

60f19f8af9fc8369da0451b26e870b89.png

内容预览

JSON Hero 会自动推断字符串的内容,并对选择的值提供有用的预览和属性。

日期和时间

b1dbcc9dba423a86c847aabaff79a15d.png

图片网址

ea3d4fdea56205a57f0451afe6455a58.png

网站网址

7fde9db6ee2ae116edfdd8f3fe315ebb.png

JSON URL

493803ac76eff41e0a16359082263cd8.png

树状视图

这个也是用的最多的,树状图结构可以很清晰的展示,看一组图:

687cba3bc32af35d9f5b5d17f4ae6771.png

同时支持对JSON数据中的数据进行搜索:

e0ee8ac515fb854d854a4ccb8e66ed8c.gif

重点来了!

当你完成数据编辑或者审核后,需要分享给前端,不必复制全部数据,只需要生成指定链接即可,这个很方便。

a8e6bb552742e51190a404586e2d1115.png

整体来讲,JSON Hero 支持多种试图查看JSON数据,同时支持VS Code 等扩展,相信对经常处理JSON的小伙伴来说,是一款很给力的工具。

推荐

Java面试题宝典

技术内卷群,一起来学习!!

0c7b4a9b220564f34f9f6be43d5fa2dd.png

PS:因为公众号平台更改了推送规则,如果不想错过内容,记得读完点一下“在看”,加个“星标”,这样每次新文章推送才会第一时间出现在你的订阅列表里。点“在看”支持我们吧!

原网站

版权声明
本文为[Java知音_]所创,转载请带上原文链接,感谢
https://dalin.blog.csdn.net/article/details/125476702