หน้าแรก>การเขียนโปรแกรมที่เกี่ยวข้อง>ซอร์สโค้ดอื่น ๆ
ดาวน์โหลด

มาถึงคุณโดย trigger.dev

JSON Hero ถูกสร้างขึ้นและได้รับการดูแลโดยทีมงานที่อยู่เบื้องหลัง Trigger.dev ด้วย trigger.dev คุณสามารถเรียกเวิร์กโฟลว์จาก APIs ตามกำหนดเวลาหรือตามความต้องการ เราทำการโทร API ได้ง่ายด้วยการตรวจสอบความถูกต้องสำหรับคุณและคุณสามารถเพิ่มความล่าช้าที่ทนทานซึ่งอยู่รอดเซิร์ฟเวอร์รีสตาร์ท

ฮีโร่ JSON

JSON Hero ทำให้การอ่านและเข้าใจไฟล์ JSON เป็นเรื่องง่ายโดยให้ UI ที่สะอาดและสวยงามเต็มไปด้วยคุณสมบัติพิเศษ

  • ดู JSON ทุกวิธีที่คุณต้องการ: มุมมองคอลัมน์, มุมมองต้นไม้, มุมมองตัวแก้ไขและอื่น ๆ
  • จะทำให้เนื้อหาของสตริงโดยอัตโนมัติและให้ตัวอย่างที่เป็นประโยชน์
  • สร้างสคีมา JSON ที่อนุมานได้ซึ่งสามารถใช้ในการตรวจสอบ JSON ของคุณ
  • สแกนค่าที่เกี่ยวข้องอย่างรวดเร็วเพื่อตรวจสอบกรณีขอบ
  • ค้นหาไฟล์ JSON ของคุณ (ทั้งปุ่มและค่า)
  • สามารถเข้าถึงคีย์บอร์ดได้
  • URL ที่แชร์ได้ง่ายพร้อมการรองรับเส้นทาง

คุณสมบัติ

ส่งไปยัง JSON Hero

ส่ง JSON ของคุณไปที่ JSON Hero ได้หลายวิธี

  • มุ่งหน้าไปที่ jsonhero.io แล้วลากและวางไฟล์ json หรือวาง json หรือ url json ในรูปแบบที่ให้ไว้

  • รวมสตริงที่เข้ารหัส base64 ของ payload json: jsonhero.io/new?j=eyaizm9vijogimjhciigfq========================

  • รวม URL JSON ไปยังจุดสิ้นสุด new : jsonhero.io/New?url=https://jsonplaceholder.typicode.com/todos/1

  • ติดตั้งส่วนขยายรหัส VS และเปิด JSON จาก VS Code

  • ผู้ใช้ Raycast? ตรวจสอบส่วนขยายของเราที่นี่

  • ใช้ API ที่ไม่เป็นทางการ:

    • ส่งคำขอ POST ไปที่ jsonhero.io/api/create.json พร้อมร่างกาย JSON ต่อไปนี้: 
    {
  "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 มุมมองคอลัมน์เป็นวิธีใหม่ในการเรียกดูเอกสาร JSON

มันมีคุณสมบัติทั้งหมดที่คุณคาดหวัง: การนำทางแป้นพิมพ์แถบเส้นทางประวัติศาสตร์

นอกจากนี้ยังมีคุณสมบัติที่ดีที่ช่วยให้คุณ "ถือ" การเลือกสืบเชื้อสายและเดินทางผ่านลำดับชั้นจากนั้นย้ายระหว่างพี่น้องและดูค่าต่าง ๆ ที่พบในเส้นทางนั้น มันยากที่จะอธิบาย แต่นี่คือภาพเคลื่อนไหวที่จะช่วยสาธิต:

อย่างที่คุณเห็นการถือ Option (หรือคีย์ Alt บน Windows) ในขณะที่ย้ายไปที่ผู้ปกครองจะช่วยให้ส่วนหนึ่งของเอกสารที่เลือกและแสดงในบริบทของ JSON โดยรอบ จากนั้นคุณสามารถสำรวจระหว่างรายการในอาร์เรย์และเปรียบเทียบค่าของการเลือกข้ามลำดับชั้นลึก Cahnges

มุมมองบรรณาธิการ

ดูเอกสาร JSON ทั้งหมดของคุณในตัวแก้ไข แต่เก็บตัวอย่างที่ดีและค่าที่เกี่ยวข้องที่คุณได้รับจากแถบด้านข้างในขณะที่คุณย้ายไปรอบ ๆ เอกสาร:

มุมมองต้นไม้

ใช้มุมมองต้นไม้แบบดั้งเดิมเพื่อสำรวจเอกสาร JSON ของคุณด้วยส่วนที่ยุบได้และลัดแป้นพิมพ์ ทั้งหมดในขณะที่รักษาตัวอย่างที่ดี:

ค้นหา

เปิดแผงการค้นหาอย่างรวดเร็วและค้นหาไฟล์ JSON ทั้งหมดของคุณในมิลลิวินาที ค้นหาผ่านชื่อคีย์เส้นทางคีย์ค่าและแม้กระทั่งค่าที่ได้รับการจัดรูปแบบสวย (เช่นการค้นหา "Dec" จะพบสตริงวันที่ในเดือนธันวาคม)

ตัวอย่างเนื้อหา

JSON Hero จะทำให้เนื้อหาของสตริงโดยอัตโนมัติและให้ตัวอย่างที่เป็นประโยชน์และคุณสมบัติของค่าที่คุณเลือก มันคือ "Show Don't Tell" สำหรับ JSON:

วันที่และเวลา

URL ภาพ

URL เว็บไซต์

URL ทวีต

json urls

สี

ค่าที่เกี่ยวข้อง

ดูค่าที่เกี่ยวข้องทั้งหมดได้อย่างง่ายดายในเอกสาร JSON ทั้งหมดของคุณสำหรับฟิลด์เฉพาะรวมถึงค่า undefined หรือ null

ข้อบกพร่องและคำขอคุณสมบัติ

มีข้อผิดพลาดหรือคำขอคุณสมบัติ? อย่าลังเลที่จะเปิดปัญหาใหม่

นอกจากนี้คุณยังสามารถเข้าร่วมช่อง Discord ของเราเพื่อออกไปเที่ยวและหารือเกี่ยวกับสิ่งที่คุณต้องการ

การพัฒนา

ในการทำงานในพื้นที่ให้โคลน repo ก่อนและติดตั้งการอ้างอิง: 

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

จากนั้นสร้างไฟล์ที่รูทของ repo ที่เรียกว่า .env และตั้งค่า SESSION_SECRET : 

 SESSION_SECRET=abc123

จากนั้นเรียกใช้ npm run build หรือ npm run dev เพื่อสร้าง

ตอนนี้เรียกใช้ npm start และเปิดเบราว์เซอร์ของคุณไปที่ http://localhost:8787

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด