Cara menggunakan JSON Viewer
- Tempel JSON atau buka file
.json. - Klik ▸ untuk membuka objek dan array, atau gunakan Expand all.
- Cari untuk menyorot key dan value yang cocok.
- Klik value mana pun untuk melihat dan menyalin path-nya, misalnya
$.items[0].sku.
Kenapa pakai JSON tree viewer?
JSON yang sudah diformat mudah dibaca untuk dokumen kecil, tetapi respons API, log, dan hasil ekspor sering mencapai ribuan baris. Tampilan pohon menunjukkan strukturnya dulu: kamu bisa langsung melihat bahwa items adalah array berisi 250 objek tanpa perlu menggulir, lalu membuka hanya cabang yang kamu butuhkan.
Fitur
- Node yang bisa dilipat dengan jumlah item dan key pada setiap objek dan array.
- Warna tipe: string, angka, boolean, dan
nullmudah dibedakan. - Pencarian menyorot key dan value yang cocok serta membuka cabang yang memuatnya.
- Path: klik sebuah value untuk mendapatkan JSONPath-nya (
$.customer.address.city), siap dipakai dijq, JavaScript, atau tool otomatisasi. - Statistik: total value, kedalaman nesting, dan ukuran.
Menggunakan path
| Tool | Path $.items[0].sku menjadi |
|---|---|
| JavaScript | data.items[0].sku |
| jq | .items[0].sku |
| Python | data["items"][0]["sku"] |
| Make / Zapier | items[1].sku (mulai dari 1) |
Untuk pemetaan tanpa kode, pencari JSON path menghasilkan path dalam format Make, Zapier, dan n8n. Untuk memperbaiki JSON yang tidak valid, gunakan formatter JSON; untuk membandingkan dua dokumen, gunakan diff JSON.
Juga dicari sebagai: json tree viewer, viewer json online, lihat json, json explorer, visualisasi json, json path finder, buka file json, tampilan pohon json.
Tool yang cocok dipakai bersama JSON Viewer
- JSON ke TypeScript — Tempel contoh JSON, misalnya respons API atau file konfigurasi, lalu dapatkan interface TypeScript siap pakai lengkap dengan tipe bersarang, properti opsional, dan union type.
- XML ke JSON — Ubah XML — respons API, feed RSS, pesan SOAP, sitemap, atau file konfigurasi — menjadi JSON yang rapi untuk dipakai di JavaScript, Python, atau API REST apa pun.
- Validator JSON Schema — Tempel schema dan JSON untuk melihat nilai mana yang melanggar aturan, atau buat schema awal dari data contoh.
- Penguji JSONPath — Ketik query JSONPath dan langsung lihat apa yang dipilihnya, lengkap dengan path persis dari setiap hasil.
Pertanyaan yang sering diajukan
Apakah bisa membuka file JSON besar?
Bisa. File berukuran beberapa megabyte berjalan dengan baik; file yang sangat besar (50 MB ke atas) mungkin lambat karena seluruh pohon dibangun di browser kamu.
Apakah JSON saya diunggah?
Tidak. Proses parsing dan rendering dilakukan secara lokal di browser kamu.
Apa itu JSONPath?
Sebuah string yang menunjuk ke value di dalam dokumen JSON, dimulai dengan
$ untuk root, misalnya $.items[0].price.Bisakah saya memasang JSON Viewer sebagai aplikasi web dan memakainya offline?
Bisa. JSON Viewer adalah aplikasi web (PWA) yang bisa dipasang. Pemasangannya lewat browser kamu, bukan diunduh dari toko aplikasi. Klik Pasang aplikasi di bagian atas halaman ini di Chrome atau Edge (Windows, macOS, Linux, ChromeOS) atau di Android. Di iPhone dan iPad, gunakan Bagikan → Tambahkan ke Layar Utama, dan di Safari 17+ pada Mac, gunakan File → Tambahkan ke Dock. Setelah itu, aplikasi akan terbuka di jendelanya sendiri dengan ikonnya sendiri. Karena berjalan sepenuhnya di browser kamu, aplikasi ini tetap bisa dipakai offline. Firefox di desktop tidak bisa memasang aplikasi web. Cara memasang aplikasi.