jsonhero web

Trigger.dev에 의해 당신에게 가져 왔습니다

JSON HERO는 Trigger.Dev 뒤에있는 팀에 의해 만들어졌습니다. Trigger.dev를 사용하면 API, 일정 또는 주문형으로 워크 플로우를 트리거 할 수 있습니다. 우리는 API 호출을 손상시켜 손상하여 손을 잡고 서버 재시작을 살아남는 내구성 지연을 추가 할 수 있습니다.

JSON HERO

JSON HERO는 추가 기능으로 포장 된 깨끗하고 아름다운 UI를 제공하여 JSON 파일을 쉽게 읽고 이해합니다.

• 컬럼 뷰, 트리 뷰, 편집기보기 등이 원하는 방식으로 JSON보기.
• 문자열의 내용을 자동으로 주입하고 유용한 미리보기를 제공합니다.
• JSON을 검증하는 데 사용될 수있는 유추 된 JSON 스키마를 만듭니다.
• 관련 값을 빠르게 스캔하여 에지 케이스를 확인하십시오
• JSON 파일 검색 (키 및 값 모두)
• 키보드 액세스 가능
• 경로 지원이있는 쉽게 공유 할 수있는 URL

특징

JSON HERO에게 보내십시오

다양한 방법으로 JSON을 JSON Hero에게 보내십시오.

• jsonhero.io로 이동하여 JSON 파일을 드래그 앤 드롭하거나 제공된 양식에 JSON 또는 JSON URL을 붙여 넣습니다.

• JSON 페이로드의 Base64 인코딩 된 문자열 포함 : jsonhero.io/new?j=yaizm9vijogimjhciigfq==

• new 엔드 포인트에 JSON URL을 포함시켜 JSONHERO.IO/NEW?url=HTTPS://jsonPlaceHolder.typicode.com/todos/1

• VS 코드 확장 및 VS Code에서 JSON을 열어보세요.

• Raycast 사용자? 여기에서 우리의 확장을 확인하십시오

• 비공식 API를 사용하십시오.

  • 다음 JSON 본체와 함께 jsonhero.io/api/create.json 에 POST 요청을하십시오.

  {
    "title" : " test 123 " ,
    "content" : { "foo" : " bar " },
    "readOnly" : false , // this is optional, will make it so the document title cannot be edited or document cannot be deleted
    "ttl" : 3600 // this will expire the document after 3600 seconds, also optional
  }

  JSON 응답은 다음과 같습니다.

  {
    "id" : " YKKduNySH7Ub " ,
    "title" : " test 123 " ,
    "location" : " https://jsonhero.io/j/YKKduNySH7Ub "
  }

열보기

MacOS Finder에서 영감을 얻은 Column View는 JSON 문서를 탐색하는 새로운 방법입니다.

키보드 내비게이션, 경로 막대, 역사와 같은 모든 기능이 있습니다.

또한 선택된 후손을 "고정"하고 계층 구조를 통해 이동 한 다음 형제 사이를 이동하고 해당 경로에서 발견 된 다른 값을 보는 멋진 기능이 있습니다. 설명하기는 어렵지만 다음은 다음과 같은 애니메이션이 있습니다.

보시다시피, 부모로 이동하는 동안 Option (또는 Windows에서 Alt Key)을 누른 상태에서 문서의 일부를 선택하고 주변 JSON의 맥락에서 보여줍니다. 그런 다음 배열의 항목을 가로 지르고 딥 계층 구조 Cahnges에서 선택 값을 비교할 수 있습니다.

편집기보기

편집기에서 전체 JSON 문서를 보지만 문서를 주변으로 이동할 때 사이드 바에서 얻는 멋진 미리보기 및 관련 값을 보관하십시오.

나무 뷰

전통적인 트리 뷰를 사용하여 접을 수있는 섹션과 키보드 바로 가기와 함께 JSON 문서를 가로 지르십시오. 멋진 미리보기를 유지하면서 모두 :

찾다

검색 패널을 신속하게 열고 퍼지 전체 JSON 파일을 밀리 초로 검색하십시오. 키 이름, 주요 경로, 값 및 심지어 형식의 예쁜 형식의 값을 통해 검색합니다 (예 : "Dec" 를 검색하면 12 월에 DateTime String이 찾을 수 있습니다.)

컨텐츠 미리보기

JSON Hero는 STRING의 내용을 자동으로 유추하고 선택한 값의 유용한 미리보기 및 속성을 제공합니다. JSON에게 "Show Do n't Tell"입니다.

날짜와 시간

이미지 URL

웹 사이트 URL

트윗 URL

JSON URL

그림 물감

관련 값

undefined 또는 null 값을 포함하여 특정 필드에 대해 전체 JSON 문서의 모든 관련 값을 쉽게 볼 수 있습니다.

버그 및 기능 요청

버그 또는 기능 요청이 있습니까? 새로운 이슈를 열어주십시오.

또한 Discord 채널에 가입하여 원하는 것을 어울리고 토론 할 수 있습니다.

개발

로컬로 실행하려면 먼저 리포를 복제하고 종속성을 설치하십시오.

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

그런 다음 .env 라는 리포지트의 루트에 파일을 만들고 SESSION_SECRET 값을 설정하십시오.

 SESSION_SECRET=abc123

그런 다음 npm run build 또는 npm run dev 실행하여 빌드하십시오.

이제 npm start 실행하고 http://localhost:8787 로 브라우저를 열십시오.