📋
← Rehberlere dön

JSON Güzelleştirme: Okunabilirlik İçin JSON Nasıl Formatlanır

· Etiketler: json, pretty-print, json-formatter, json-indentation, developer-tools

JSON Güzelleştirme Nedir?

JSON güzelleştirme, ham, kompakt (sıkıştırılmış) JSON verilerini alıp, insan tarafından okunabilir hale getirmek için uygun girintileme, satır sonları ve boşluklarla yeniden biçimlendirme işlemidir. Güzelleştirilmiş bir JSON belgesi, iç içe nesnelerin ve dizilerin hiyerarşisini ortaya çıkaran tutarlı girintileme ve net yapısal formatlama kullanır.

Aynı verilerin bu iki temsilini karşılaştırın:

Sıkıştırılmış (okunması zor):

{"users":[{"id":1,"name":"Alice","roles":["admin","editor"]},{"id":2,"name":"Bob","roles":["viewer"]}],"total":2}

Güzelleştirilmiş (okunması kolay):

{
  "users": [
    {
      "id": 1,
      "name": "Alice",
      "roles": ["admin", "editor"]
    },
    {
      "id": 2,
      "name": "Bob",
      "roles": ["viewer"]
    }
  ],
  "total": 2
}

Güzelleştirilmiş ve Sıkıştırılmış JSON

Güzelleştirilmiş ve sıkıştırılmış JSON arasındaki seçim, kullanım durumuna bağlıdır:

| Görünüm | Güzelleştirilmiş | Sıkıştırılmış | |--------|-------------|----------| | Okunabilirlik | Yüksek — net yapı | Düşük — tüm veriler tek satırda | | Dosya boyutu | Daha büyük (daha fazla boşluk) | Daha küçük (boşluk ek yükü yok) | | Ağ aktarımı | Büyük yükler için daha yavaş | Daha hızlı, daha az bant genişliği | | Hata ayıklama | Geliştirme için ideal | İnceleme için pratik değil | | Üretim kullanımı | Nadiren kullanılır | API yanıtları için standart |

Üretim API'leri bant genişliğini azaltmak için genellikle sıkıştırılmış JSON sunarken, geliştiriciler geliştirme ve hata ayıklama sırasında JSON'u güzelleştirir.

Girinti Stilleri

Çoğu formatlayıcı iki yaygın girinti stilini destekler:

2 Boşluklu Girinti (En Yaygın)

{
  "name": "Alice",
  "age": 30,
  "address": {
    "city": "New York"
  }
}

Şunlar için önerilir: JavaScript/TypeScript projeleri, modern web geliştirme ve çoğu genel kullanım.

4 Boşluklu Girinti

{
    "name": "Alice",
    "age": 30,
    "address": {
        "city": "New York"
    }
}

Şunlar için önerilir: Python projeleri (PEP 8 stili) ve netlik için daha geniş girintiyi tercih eden ekipler.

Sekme Girintisi

Bazı geliştiriciler, özellikle kullanıcıların düzenleyicilerinde sekme genişliğini ayarladığı erişilebilirlik odaklı iş akışlarında sekme tabanlı girintiyi tercih eder.

Doğru Girintiyi Seçme

Çoğu ekip, okunabilirliği yatay alan verimliliğiyle dengelediği için 2 boşluk üzerinde standartlaşır. JavaScript ekosistemi (Node.js, React, Vue) ezici bir çoğunlukla 2 boşluklu girinti kullanır. Python ağırlıklı bir ortamda çalışıyorsanız, 4 boşluklu girinti daha doğal gelebilir. Anahtar nokta tutarlılıktır — bir stil seçin ve Prettier veya EditorConfig gibi bir araçla projeniz genelinde bunu zorunlu kılın.

Farklı Programlama Dillerinde JSON Güzelleştirme

JavaScript / Node.js

const formatted = JSON.stringify(data, null, 2);
console.log(formatted);

Python

import json
formatted = json.dumps(data, indent=2)
print(formatted)

Java

import com.fasterxml.jackson.databind.ObjectMapper;
ObjectMapper mapper = new ObjectMapper();
String formatted = mapper.writerWithDefaultPrettyPrinter()
    .writeValueAsString(data);

Go

import "encoding/json"
formatted, _ := json.MarshalIndent(data, "", "  ")
fmt.Println(string(formatted))

Ruby

require 'json'
puts JSON.pretty_generate(data)

JSON Nasıl Güzelleştirilir

Çevrimiçi JSON Formatlayıcı Kullanma

En hızlı yöntem, ücretsiz çevrimiçi JSON formatlayıcı kullanmaktır — JSON'unuzu yapıştırın ve sözdizimi vurgulama ve hata tespiti ile anında formatlanmış çıktı alın.

Komut Satırı Araçlarını Kullanma

jq ile (en popüler):

cat file.json | jq .

Python ile:

python -m json.tool file.json

Node.js ile:

node -e "const d = require('./file.json'); console.log(JSON.stringify(d, null, 2));"

Tarayıcı Geliştirici Araçları

Tüm büyük tarayıcılar, Ağ sekmelerinde JSON yanıtlarını otomatik olarak formatlar:

  • Chrome DevTools: Ağ sekmesi JSON yanıtlarını otomatik olarak güzelleştirir
  • Firefox Developer Tools: JSON yanıtları daraltılabilir ağaç görünümleriyle görüntülenir
  • Safari Web Inspector: JSON önizlemesi otomatik formatlama içerir

JSON Formatlama için IDE Eklentileri

VS Code

VS Code mükemmel yerleşik JSON desteğine sahiptir. Herhangi bir JSON dosyasını formatlamak için Shift+Alt+F (Windows/Linux) veya Shift+Option+F (macOS) kullanın. Ek eklentiler deneyimi geliştirir:

  • Prettier — JSON, JSONC ve diğer birçok dili tutarlı bir şekilde formatlar
  • JSON Tools — Klavye kısayollarıyla JSON'u sıralayın, sıkıştırın ve formatlayın
  • JavaScript Booster — Gelişmiş JSON manipülasyon özellikleri

JetBrains IDE'ler (IntelliJ, WebStorm, PyCharm)

  • Yerleşik formatlayıcı: Ctrl+Alt+L (Windows/Linux) veya Cmd+Option+L (macOS)
  • Yapıştırmada otomatik JSON doğrulama ve formatlama

Vim / Neovim

" JSON'u yerinde formatla
:%!jq .

Gelişmiş JSON Formatlama Seçenekleri

Modern JSON formatlayıcıları temel girintiden daha fazlasını sunar:

  • Anahtar sıralama — Tutarlı çıktı için nesne anahtarlarını alfabetik olarak sıralama
  • Sözdizimi vurgulama — Renk kodlu anahtarlar, dizeler, sayılar ve boolean'lar
  • Daraltılabilir ağaçlar — Daha kolay gezinme için iç içe yapıları genişletme ve daraltma
  • Satır numaraları — Hata ayıklama sırasında belirli konumlara başvurma
  • Hata vurgulama — Sözdizimi hatalarını ayrıntılı mesajlarla görsel olarak işaretleme

JSON Okunabilirliği için En İyi Uygulamalar

  1. Formatlamadan önce her zaman doğrulayın — Bir formatlayıcı geçersiz JSON'u düzeltemez. Sözdizimi hatalarını yakalamak için önce bir JSON doğrulayıcı kullanın.
  2. Ekip standardı belirleyin — Girinti üzerinde anlaşın (2 boşluk endüstri standardıdır) ve Prettier veya bir linter ile bunu zorunlu kılın.
  3. İç içe geçmeyi sığ tutun — Derin iç içe JSON (4+ seviye), formatlamadan bağımsız olarak okunması zordur. Mümkün olduğunda yeniden yapılandırmayı düşünün.
  4. Anlamlı anahtarlar kullanın — Açıklayıcı, özlü anahtar adları, herhangi bir formatlayıcıdan daha fazla okunabilirliği artırır.
  5. Sondaki yeni satırları ekleyin — POSIX standartlarına uymak ve diff gürültüsünü önlemek için JSON dosyalarını bir yeni satır karakteri ile sonlandırın.

JSON verilerinizi özelleştirilebilir girinti ve sözdizimi vurgulama ile anında formatlamak ve güzelleştirmek için ücretsiz çevrimiçi JSON güzelleştirme aracımızı deneyin.