JSON Formatter

Apa itu JSON formatter?

JSON formatter (juga disebut JSON beautifier atau pretty-printer) mengubah JSON yang ringkas atau berantakan menjadi data yang rapi dan berindentasi. Ini salah satu alat developer yang paling sering dipakai: untuk memeriksa respons API, membaca file konfigurasi, men-debug log, membandingkan test fixture, dan memindahkan data antara kode frontend dan backend.

JSON adalah format yang ketat: key harus memakai tanda kutip ganda, string harus memakai tanda kutip ganda, koma harus di tempat yang benar, dan setiap { atau [ pembuka harus ditutup. Formatter membuat struktur itu terlihat, dan validator bawaannya memberi tahu persis di mana sintaksnya rusak kalau memang ada yang rusak.

JSON adalah singkatan dari JavaScript Object Notation. Meski lahir dari JavaScript, hampir setiap bahasa pemrograman punya dukungan bawaan untuk membaca dan menulis JSON, karena itulah JSON menjadi cara standar bertukar data terstruktur di web.

Yang akan kamu pelajari saat memakainya

• Object memakai {} untuk field bernama, array memakai [] untuk daftar berurutan, dan keduanya bisa bersarang satu sama lain sampai kedalaman berapa pun.
• JSON yang rapi dan JSON yang di-minify adalah *data yang sama*: spasi mengubah keterbacaan, bukan makna. Server biasanya mengembalikan JSON yang di-minify untuk menghemat byte.
• Nilai JSON terbatas pada enam tipe: string, number, boolean, null, object, dan array. Tidak ada undefined, tidak ada fungsi, dan tidak ada komentar.
• Error validasi biasanya menunjuk ke dekat masalahnya, tetapi kesalahan sebenarnya (kurung yang tidak ditutup, tanda kutip yang hilang) bisa ada beberapa karakter sebelumnya.

Cara memformat JSON langkah demi langkah

1. 1

   Tempel JSON-mu ke kotak input

   Salin JSON dari respons API, file log, atau konfigurasimu, lalu tempel di sebelah kiri. Formatter menerima input yang di-minify maupun yang sebagian sudah terformat.

2. 2

   Pilih lebar indentasi

   Dua spasi adalah gaya yang paling umum, dan empat spasi juga banyak dipakai. Pilih yang cocok dengan gaya yang sudah ada di proyekmu.

3. 3

   Baca hasil validasinya

   Kalau JSON-nya valid, output yang terformat muncul di sebelah kanan. Kalau tidak, pesan error memberi tahu baris dan karakter tempat parsing gagal.

4. 4

   Jelajahi tampilan pohon

   Pakai pohon yang bisa dilipat untuk menyembunyikan object dan array yang bersarang dalam. Ini cara tercepat memahami bentuk respons API yang belum kamu kenal.

5. 5

   Salin atau minify hasilnya

   Salin versi yang rapi ke kode atau dokumentasimu, atau minify kembali menjadi satu baris untuk disimpan dan dikirim lewat jaringan.

Referensi cepat sintaks JSON

Kumpulan lengkap komponen JSON. Apa pun di luar daftar ini bukan JSON yang valid. Spesifikasi: RFC 8259 dan ECMA-404.

Contoh JSON untuk dicoba

{"user":{"id":7,"name":"Maya"},"skills":["HTML","JavaScript"]}

{  "user": {    "id": 7,    "name": "Maya"  },  "skills": ["HTML", "JavaScript"]}

{  "name": "Coddy",  "active": true,}

{  "count": 3,  "countText": "3",  "enabled": true}

{  "data": {    "orders": [      { "id": 101, "items": [{ "sku": "A", "qty": 2 }] },      { "id": 102, "items": [] }    ]  }}

Kesalahan umum soal JSON

• Memakai tanda kutip tunggal, bukan kutip ganda, di sekitar key atau string. JSON hanya mengizinkan tanda kutip ganda.
• Memperlakukan JSON seperti object JavaScript: komentar, fungsi, dan undefined tidak valid di JSON, dan koma di akhir akan gagal di-parse.
• Lupa bahwa number di JSON tidak boleh diawali +, tidak boleh punya nol di depan (kecuali 0 itu sendiri), dan tidak boleh diapit tanda kutip kalau kamu memang ingin tipe number.
• Menempel token, data pelanggan, atau rahasia production ke alat yang mengunggah inputmu. Formatter Coddy berjalan secara lokal sehingga aman, tetapi selalu cek dulu sebelum memakai situs pihak ketiga.

FAQ JSON Formatter