Skip to content
JSON2Schema is a small WebApp running totally in your browser, that supports developers in creating a JSON Schema for the JSON Editor developed by Jeremy Dorn and forked from his discontinued package in https://www.github.com/niebert/json-editor
Shell
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
docs
.gitignore
LICENSE
README.md
create_repo_folders.sh

README.md

Migration of JSON2Schema to GitLab

This repository contains the old JSON2Schema Tool.

JSON2Schema on GitLab

The current version of JSON2Schema tool is now available on GitLab. It generates

  • JSON schema from a give JSON,
  • provide an editor (ACE) to modify labels, ... in the generated JSON schema,
  • you can save the generated JSON schema,
  • NEW on GitLab you can download a complete JSON editor of Jeremy Dorn with the generated JSON schema.

JSON2Schema

JSON2Schema is a small WebApp running totally in your browser, that supports developers in creating a JSON Schema for the JSON Editor originally developed by Jeremy Dorn and is now available and maintained as json-editor package in https://www.github.com/json-editor/json-editor

Online Demo JSON2Schema

You can check the JSON2Schema tool with the following URL:

https://niebert.github.io/JSON2Schema

Copy a JSON of your choice into the JSON2Schema tool and create a raw JSON schema, that works in the JSON editor

JSON Schema

A JSON Schema is a basically a file, that defines the layout of the input and chosen editor elements for each key-value pair in given JSON for the JSON Editor of Jeremy Dorn, i.e. it defines if the user of the JSON editor:

  • Edit a string,
  • uses a select box for different options the graphical user interface GUI,
  • select a color,
  • select a data,
  • increase or decrease an integer value,
  • ...

How Create a JSON Schema

Define a JSON you want to use for you application.

{
  "name":"Hans Mustermann",
  "age":36,
  "weightlist": [
    {
      "date":"2018-05-23T8:37:58.258Z",
      "value":76.0
    }
  ],
  "temperaturelist": [
    {
      "date":"2018-05-24T07:22:55.332Z",
      "value":36.5
    }
  ]
}

As in example we create a privacy-friendly WebApp, that stores health related personal data WITHOUT sending the collected data to a server for commercial data harvesting (like fitness tracker). A patient measure temperature and weight on a daily basis. The collected data is stored in the mobile device in JSON file without connecting a server. The storage format of the JSON is defined by a JSON Schema. If you plugin the JSON Schema into the JSON Editor originally generated by Jeremy Dorn, then the JSON editor will provide the Graphical User Interface (GUI) to input the data. Creating a WebApp in general or using the JSON Editor does to specify does not imply that the collected data is not submitted from the mobile device to remote server. OpenSource architecture of the WebApp assures that the computer scientist can validate, if the source code contains hidden components that submit the collected JSON data to remote server. For a privacy friendly WebApp for the data mentioned above could be stored (even encrypted) on the SD-card of the mobile device or in the local storage of the browser (see AppLSAC).

Use the sample JSON in the Demo JSON2Schema WebApp to play around the Schema generation and edit the generate Schema to understand how the JSON Schema defines the Graphical User Interface of the JSON Editor.

Acknowledgement

Special thanks to the following individual developers and teams of OpenSource JavaScript projects:

  • Font Awesome Icons - 4.7.0 thanks to fontawesome.com for providing the free 4.7.0 version for local application for this WebApp. The fonts in version 4.7.0 are created by Font Awesome and licensed under SIL OFL 1.1. The javascript-code for injecting the icon into the DOM licensed under MIT License. The Documentation for Font Awesome - 4.7.0 licensed under CC BY 3.0.
  • FileSaver.js Developer Eli Grey provided the FileSaver.js that is used to store created JSCC files to the local filesystem. JSCC uses the same mechanism of browsers, that allows a Save as... in the context menu of a web pages or image. So not uncontrolled write access to your file system is implemented, because users have to select the locations in which the user whats to store the file (e.g. JSON, Javascript or HTML).
  • JointJS JointJS is a JavaScript diagramming library. It can be used to create either static diagrams. JointJS is used in this project to create UML-diagrams, that are interactive diagramming in conjunction and application builder in Javascript.
  • Inheritage for JavaScript with protoypes by Gavin Kistner
  • 3 ways to define a JavaScript class by Stoyan Stefanov
  • JQuery is used for the theme and standard operations in the Document Object Model (DOM) of HTML-pages. The JQuery-Themeroller was used to create a JQuery theme for JSCC.
  • JSZip - LibreOffice files, Geogebra files (Open Source applications) have file extensions that are actually ZIP files. To handle, change and generate those documents in a browser is possible the library JSZIP. Even a small file system for WebApps that can be stored with a folder structure in a ZIP file can be generated in a browser. So JSZip is a multi-functional JavaScript class for generating and reading ZIP files. Thank you for sharing this great library with the Open Source community.
You can’t perform that action at this time.