Resumen
Edita, formatea, repara, busca, compara, valida y convierte JSON localmente en el navegador sin subir documentos.
Funciones
- Lokaler JSON-Editor
- Formatierung und Reparatur
- Schema-Validierung
- Diff und Konvertierung
Manual
Estado: P0031_RC2
Finalidad y principio básico
JSON Studio es un entorno local y apto para uso sin conexión destinado a editar, inspeccionar, comparar y convertir datos estructurados. Source siempre es la representación autoritativa. Tree, Table, Schema, Validator, Semantic, Graph y Diff muestran ese documento o trabajan explícitamente con una fuente de comparación. Las modificaciones realizadas en una vista se trasladan a Source de forma trazable y se pueden deshacer.
Las funciones principales no suben ni guardan automáticamente el contenido. Desktop y Web comparten Workbench y Core; solo cambian los adaptadores de archivos, descargas y portapapeles.
Requisitos
Se necesita un navegador actual o la aplicación de escritorio Akyao y datos estructurados locales. JavaScript debe estar activo. El acceso a archivos y portapapeles solo se solicita tras una acción del usuario.
Pasos
Abra un archivo o introduzca JSON, revise Source con Diagnostics o las vistas especializadas, ejecute los cambios o conversiones y guarde o descargue expresamente el resultado.
Parámetros
Sangría, nueva línea final, expresiones Search y Query, schema, fuente Diff, opciones de conversión, filtros, paginación y tamaños de vista se configuran en Workbench.
Resultado
El resultado es Source JSON comprobado o una exportación local creada expresamente junto con diagnósticos, informes o patches trazables.
Errores frecuentes
Sintaxis no válida, estructura no tabular, formato de conversión inadecuado o permisos del navegador ausentes pueden bloquear acciones concretas. Source nunca se sustituye silenciosamente.
Solución de problemas
Abra Diagnostics, navegue a la posición indicada, aplique Repair solo tras revisar la vista previa y restablezca Workspace para problemas de layout. Para archivos o portapapeles compruebe formato, permiso y contexto seguro.
Barra de herramientas e IconButtons
El tooltip y el nombre accesible explican cada comando sin depender del color. Estos AT-IconButtons corresponden a las acciones centrales de la interfaz.
| IconButton | Comando | Efecto |
|---|---|---|
| Abrir | Abre JSON directamente o inicia una importación confirmada de TOML, YAML, JSON5, NDJSON, CSV o XML. | |
| Guardar | Guarda JSON en el destino actual; el navegador descarga un archivo local. | |
| Guardar como | Guarda con otro nombre o inicia una nueva descarga. | |
| Pegar | Lee texto después de autorizar expresamente el portapapeles. | |
| Copiar | Copia Source o el valor, ruta, informe o patch indicado. | |
| Deshacer | Revierte la última modificación de Source. | |
| Rehacer | Restaura la última modificación deshecha. | |
| Restablecer | Vacía Source únicamente por acción expresa del usuario. | |
| Formatear | Formatea JSON válido con 2 espacios, 4 espacios o tabulador y nueva línea final opcional. | |
| Minify | Elimina espacios innecesarios de JSON válido. | |
| Ordenar claves | Ordena las claves tras confirmación; el cambio se puede deshacer. | |
| Repair | Muestra únicamente reparaciones seguras antes de aplicarlas. | |
| Buscar | Abre la búsqueda de Source. | |
| Buscar y reemplazar | Abre la barra de reemplazo. | |
| Seleccionar contenido completo | Selecciona el contenido completo de Source. | |
| Ajuste de línea | Activa o desactiva el ajuste visual de líneas. | |
| Restablecer workspace | Restaura vistas, filtros y divisores sin cambiar Source. |
Áreas de trabajo y layout
La barra lateral izquierda contiene Inspector, Diagnostics, Search y Query. A la derecha están Code / Data Tools, Tree, Table, Schema, Validator, Semantic, Graph y Diff. Las barras y divisores se redimensionan con puntero o teclado; el panel derecho se puede plegar. Ctrl+Shift+0 restaura el layout canónico sin modificar el documento.
Los estados distinguen JSON válido, texto intermedio no válido pero editable y el último análisis válido. Un error en una vista derivada nunca sobrescribe Source.
Archivos, arrastrar y soltar y portapapeles
Desktop utiliza diálogos nativos para Abrir, Guardar y Guardar como. En el navegador los archivos permanecen locales: Abrir usa el selector y Guardar o Exportar generan descargas. JSON se carga directamente. TOML, YAML, JSON5, NDJSON, CSV y XML muestran una conversión explícita. Cancelar, un archivo ilegible o una conversión fallida no alteran Source.
Arrastrar y soltar emplea el mismo flujo seguro. El portapapeles del navegador necesita una acción del usuario y, según el caso, permiso. Si una operación falla se conserva el último contenido válido.
Editor Source, formato y Repair
CodeMirror ofrece resaltado, números de línea, folding, emparejamiento de corchetes, búsqueda/reemplazo, ajuste de línea, marcadores y undo/redo. Los estados intermedios no válidos siguen siendo editables. La navegación desde cualquier análisis enfoca la posición correspondiente en Source.
Formatear acepta solo JSON válido. Minify elimina espacios sin cambiar valores. Ordenar claves modifica intencionadamente el orden y exige confirmación. Repair enumera correcciones de sintaxis seguras antes de aplicarlas.
Inspector y Diagnostics
Inspector muestra tipo, clave, valor, JSONPath, JSON Pointer, subtree y detalles semánticos del nodo elegido. Valores, rutas, pointers y subtrees se pueden copiar. Los valores primitivos se editan como cambios de Source que admiten undo.
Diagnostics informa de sintaxis, claves duplicadas e integers inseguros. Las entradas permiten navegación, Previous/Next y copiar un informe. Las reparaciones colectivas seguras siguen siendo una acción Repair confirmada.
Search y Query
Search recorre claves, valores y rutas con filtros por tipo. Los resultados permiten navegación anterior/siguiente y copiar JSONPath o Pointer; history y favoritos conservan búsquedas recurrentes.
Query usa localmente un núcleo JSONPath con child, índices, wildcard, recursive descent, slices, unions y filtros. IntelliSense, history y favoritos ayudan a introducir consultas. Los resultados se pueden enfocar y copiar. No se utiliza JavaScript eval.
Tree y Table
Tree permite expandir/contraer, seleccionar root o filas completas, sincronizar con Source, copiar ruta/pointer y editar primitivos. Las modificaciones son pasos Source normales y reversibles.
Table aparece para arrays de objetos con estructura tabular. Las columnas se derivan de las claves. Orden y filtros afectan solo a la vista; las celdas editadas vuelven a Source. AT-Spreadsheet virtualiza tablas grandes.
Schema y Validator
Schema genera Draft 2020-12 e indica que los tipos se infieren de datos de ejemplo. El schema se puede abrir, guardar, editar y copiar. Una acción expresa puede generar un documento de ejemplo.
Validator comprueba Source contra el schema actual. Los resultados incluyen rutas JSON y Schema, origen y categoría. Ofrece filtros, Previous/Next, Refresh e informe copiable; los errores de sintaxis del documento y del schema permanecen separados.
Semantic Explorer y Graph
Semantic reconoce URL, email, colores, imágenes, fecha/hora, Base64 y JSON incrustado sin sustituir el tipo JSON real. Búsqueda, filtros, paginación, Previous/Next, reindexado e informes trabajan sobre el índice local.
Graph visualiza la jerarquía y sincroniza la selección con Source. Búsqueda, zoom, ajuste, profundidad, minimap y foco de subtree ayudan con estructuras grandes. Se pueden editar claves y valores, añadir o eliminar nodos y exportar SVG/PNG localmente.
Los datos de imagen integrados se muestran localmente. Las URL de imágenes externas no se cargan automáticamente; Abrir URL las abre solo tras una acción explícita.
Diff, Patch y Review
Diff compara Source con otra fuente y distingue Added, Removed, Changed, Type Changed y Moved. Filtros, F7/Shift+F7 y selección múltiple facilitan la navegación. Es posible aplicar cambios individuales, seleccionados, filtrados o todos en ambos sentidos.
JSON Patch usa operaciones RFC 6902 y escaping RFC 6901. Los guarded patches añaden operaciones test. También se incluyen root replacement, detección de movimientos, estrategias de conflicto, review/skip, snapshots, bundles, sesiones portátiles e informes.
Data Tools y formatos
Data Tools incluye TOML↔JSON, YAML↔JSON, JSON5↔JSON, NDJSON↔JSON, CSV↔JSON, XML↔JSON, Flatten/Unflatten, JSON Patch, Merge Patch, Schema Generate/Validate, TypeScript, corrección de claves duplicadas, ordenación del nodo elegido y RFC 8785/JCS. Los mappings XML y CSV son deterministas, pero no todas las estructuras permiten una conversión sin pérdidas; una entrada inadecuada no se reinterpreta en silencio.
El input puede proceder de Source, archivo o Live Input. History, chaining, verificación roundtrip y Converter Audit registran el flujo. Un resultado JSON solo sustituye Source tras una orden expresa y como un único paso reversible.
Teclado
| Atajo | Función |
|---|---|
Ctrl+F / Ctrl+H | Buscar / buscar y reemplazar en Source |
Ctrl+Z / Ctrl+Y | Deshacer / rehacer |
Ctrl+Shift+0 | Restablecer workspace sin cambiar Source |
Alt+1 a Alt+6 | Abrir Code, Tree, Table, Schema, Validator o Semantic |
F7 / Shift+F7 | Cambio Diff siguiente / anterior |
Alt+ArrowLeft / Alt+ArrowRight | Cambiar página Semantic |
| Flechas sobre un divisor | Redimensionar el área adyacente |
En macOS se aplican las variantes habituales con Cmd. docs/KEYBOARD_SHORTCUTS.md contiene los atajos Diff adicionales.
Almacenamiento local, privacidad y solución de problemas
En el navegador solo se guarda en localStorage estado de interfaz con namespace, como layout, filtros e history; Source no se persiste automáticamente. Sesiones, snapshots y archivos Desktop aparecen únicamente tras las acciones locales descritas. Las funciones principales no requieren upload, tracking ni servicios externos.
Si la sintaxis no es válida, abra Diagnostics y navegue a la posición indicada. Para importaciones inadecuadas cancele la conversión y revise el archivo. Si el portapapeles está bloqueado, compruebe permisos y contexto seguro. Para documentos grandes use filtros, paginación y vistas virtualizadas. Restablecer workspace corrige el layout sin borrar Source.
Fuentes de datos
akyao.development.json-studio
Sin datos externos integrados. Los documentos e imágenes de entrada los proporciona el usuario.
Dependencias de ejecución por herramienta
- @dagrejs/dagre 3.1.1: MIT
- @dagrejs/graphlib 4.0.5: MIT
- @dmsnell/diff-match-patch 1.1.0: Apache-2.0
- @hyperjump/browser 1.5.0: MIT
- @hyperjump/json-pointer 1.1.2: MIT
- @hyperjump/json-schema-formats 1.0.6: MIT
- @hyperjump/json-schema 1.17.8: MIT
- @hyperjump/pact 1.4.0: MIT
- @hyperjump/uri 1.3.6: MIT
- @types/d3-color 3.1.3: MIT
- @types/d3-drag 3.0.7: MIT
- @types/d3-interpolate 3.0.4: MIT
- @types/d3-selection 3.0.11: MIT
- @types/d3-transition 3.0.9: MIT
- @types/d3-zoom 3.0.8: MIT
- @xyflow/react 12.11.2: MIT
- @xyflow/system 0.0.79: MIT
- classcat 5.0.5: MIT
- content-type 1.0.5: MIT
- d3-color 3.1.0: ISC
- d3-dispatch 3.0.1: ISC
- d3-drag 3.0.0: ISC
- d3-ease 3.0.1: BSD-3-Clause
- d3-interpolate 3.0.1: ISC
- d3-selection 3.0.0: ISC
- d3-timer 3.0.1: ISC
- d3-transition 3.0.1: ISC
- d3-zoom 3.0.0: ISC
- idn-hostname 15.1.19: MIT
- json-stringify-deterministic 1.0.16: MIT
- jsondiffpatch 0.7.6: MIT
- just-curry-it 5.3.0: MIT
- punycode 2.3.1: MIT
- react-dom 19.2.8: MIT
- react 19.2.8: MIT
- scheduler 0.27.0: MIT
- use-sync-external-store 1.6.0: MIT
- uuid 14.0.1: MIT
- zustand 4.5.7: MIT