超酷的JSON数据可视化工具：JSON眼！

在现代的软件开发中，处理 JSON 数据是一项常见的任务。为了更轻松、直观地查看和理解 JSON 文件，开发人员需要一款功能强大、界面友好的工具。今天，我们介绍的是一款名为 JSON Hero 的开源工具，它正是一款高颜值的 JSON 数据可视化神器！

JSON Hero 简介

JSON Hero 是由 Trigger.dev 团队开发的一款开源工具，旨在为开发人员提供一个方便、美观的界面来浏览、搜索和导航 JSON 文件。该项目目前在 GitHub 上已获得 8.5K stars，备受开发者欢迎。

功能特性

JSON Hero 提供了一系列强大的功能，使得处理 JSON 数据变得更加轻松：

1. 多种视图方式：支持以列视图、树视图和编辑器视图等方式查看 JSON 文件，满足不同需求。
2. 自动推断和预览：自动推断字符串的内容并提供预览，包括图片预览，让您一目了然。
3. 键值检索：支持根据 JSON 的键值进行检索，快速定位需要的内容。
4. 键盘导航：通过键盘快捷键进行操作，提升操作效率。
5. 本地构建和 Docker 部署：提供了多种部署方式，方便开发者快速部署和使用。

在线体验和部署

您可以通过 JSON Hero 官方网站 进行在线体验，也可以访问 GitHub 获取源代码。另外，JSON Hero 还提供了 VS Code 插件，方便在编辑器中处理 JSON 数据。

本地构建和 Docker 部署

如果您希望在本地构建 JSON Hero，只需按照以下步骤操作：

克隆源码到本地：

<code>git clone https://github.com/triggerdotdev/jsonhero-web.git</code>

安装依赖并构建：

<code>cd jsonhero-web</code>，<code>npm install</code>，<code>npm run build</code>

启动服务：

<code>npm start</code>

在浏览器中访问：http://localhost:8787

如果您习惯使用 Docker，可以使用以下命令进行一键部署：

<code>docker run -d \ --restart unless-stopped \ --name jsonhero-web \ -p 8787:8787 \ henryclw/jsonhero-web:latest</code>

功能预览

以下是 JSON Hero 的一些功能预览：

• 列视图：以 macOS Finder 风格浏览 JSON，提供全新的查看方式。
• 键盘导航：通过键盘快捷键进行导航和选择，提升操作效率。
• 搜索：快速打开搜索面板并模糊搜索整个 JSON 文件，快速定位需要的内容。

结语

JSON Hero 界面美观、功能实用，是处理 JSON 数据的绝佳工具。如果您经常需要处理 JSON 数据，那么 JSON Hero 绝对是您的好帮手！现在就尝试一下吧！

附项目的链接：

开源地址：https://github.com/triggerdotdev/jsonhero-web

在线体验：https://jsonhero.io