JSON Editor
Was der JSON Editor kann: JSON formatieren, validieren, reparieren und transformieren — in Baum-, Tabellen- und Code-Ansicht, komplett im Browser.
Ein Editor für JSON — formatieren, prüfen, umbauen
Der JSON Editor ist ein vollwertiger JSON-Editor im Browser. Du fügst JSON-Daten ein — getippt, aus der Zwischenablage oder als Datei — und arbeitest damit in drei Ansichten: als aufklappbarer Baum (Tree), als Tabelle für Datensätze und als reine Code-Ansicht mit Syntax-Hervorhebung. Formatieren, minifizieren, validieren, reparieren, sortieren, durchsuchen und transformieren ist alles eine Sache von einem Klick oder einem Tastenkürzel.
Gedacht ist das Tool für alle, die regelmäßig mit JSON hantieren: Entwicklerinnen und Entwickler, die eine API-Antwort schnell lesbar machen, ein Config-File entwirren oder kaputtes JSON aus einem Log retten wollen; Daten-Leute, die eine Liste von Objekten wie eine Tabelle durchsehen; und alle, die mal eben prüfen müssen, ob ein JSON-Schnipsel überhaupt gültig ist. Kein Account, keine Installation, kein Upload — alles passiert lokal in deinem Browser.
Was der Editor kann
Die Funktionen lassen sich in drei Gruppen denken: aufbereiten, prüfen und umbauen.
- Formatieren und minifizieren — Format (Beautify) rückt das JSON mit zwei Leerzeichen sauber ein und macht es lesbar; Compact presst es wieder in eine einzige Zeile ohne überflüssige Leerzeichen für die Auslieferung. Dazu sortiert Sort alle Objekt-Schlüssel rekursiv alphabetisch.
- Validieren und reparieren — der Editor prüft das JSON in Echtzeit auf Syntaxfehler und zeigt die Stelle an. In der Text-Ansicht bietet er bei ungültigem JSON eine Auto-Reparatur an, die häufige Fehler behebt — etwa abschließende Kommas, einfache statt doppelte Anführungszeichen oder fehlende Klammern.
- Transformieren und durchsuchen — über das eingebaute Transform-Werkzeug filterst, sortierst und projizierst du Daten (per Abfrage-Assistent mit Live-Vorschau); Suchen & Ersetzen, Tastatur-Navigation, Undo/Redo und Drag-and-drop im Baum gehören ebenfalls dazu.
Dazu kommen die praktischen Helfer: Datei öffnen und als data.json herunterladen, in die Zwischenablage kopieren oder daraus einfügen, der Vollbild-Modus und eine automatische Speicherung im Browser, die deinen Stand über Reloads hinweg hält. Welche Funktion genau was tut, steht im Manual.
Drei Ansichten auf dieselben Daten
Das Herzstück ist die Möglichkeit, jederzeit zwischen drei Sichten auf dasselbe Dokument zu wechseln:
- Tree — der aufklappbare Baum: Knoten ein- und ausklappen, per Drag-and-drop umsortieren, Schlüssel und Werte direkt bearbeiten, Kontextmenü per Rechtsklick.
- Table — eine tabellarische Sicht, ideal für ein Array von Objekten: bearbeiten wie in einer Tabellenkalkulation, Spalten durch Klick sortieren, Zeilen hinzufügen und entfernen.
- Text — die reine Code-Ansicht mit Syntax-Hervorhebung, Zeilennummern, Code-Faltung sowie Suchen & Ersetzen.
Komplett im Browser
Architektonisch ist der JSON Editor eine reine Client-Anwendung: Es gibt keinen Server, der deine Daten sieht, keinen Upload und kein API. Geladene Dateien liest der Browser lokal, der Download entsteht ebenfalls im Browser. Unter der Haube arbeitet die quelloffene Bibliothek vanilla-jsoneditor von Jos de Jong (englisch); die Code-Ansicht basiert auf CodeMirror 6. Dein Arbeitsstand wird automatisch im Local Storage deines Browsers gesichert — bequem, aber auf einem geteilten Rechner ein Punkt, den du kennen solltest (Details im Manual).
Jetzt ausprobieren
→ JSON Editor öffnen — JSON einfügen oder eine Datei laden, Ansicht wählen, loslegen. Ohne Account, kostenlos, direkt im Browser. Beim ersten Öffnen liegt ein kleines Beispiel-Dokument im Editor, an dem du alle Funktionen sofort durchprobieren kannst.
Verwandte JPKCom-Tools
Wenn JSON nur eine Station in deinem Workflow ist, helfen diese Tools weiter:
- Convertor PRO — JSON in andere Formate wandeln und zurück: YAML, TOML, XML, Unicode/UTF-8 und mehr. Der direkte Partner, wenn dein JSON woanders hin soll.
- CSV Editor — tabellarische Daten als CSV bearbeiten und exportieren, mit Format-Erkennung. Praktisch, wenn dein Array von Objekten eigentlich eine Tabelle ist.
- Coder — HTML-Entities, URLs, Base64, JWT-Tokens und Data-URIs en- und decodieren. Nützlich, wenn in deinem JSON kodierte Werte stecken.
Tiefer geht es auf den Unterseiten: das Manual mit jeder Funktion und Ansicht im Detail, Beispiele aus der Praxis und gesammelte Tipps & Tricks.