JSON Schema Editor With Vue.js 2 and Firebase

Description:

An intuitive editor for JSON schema which provides a tree view to present structure of schema and a property inspector to edit the properties of schema element. Develop with Vue.js 2 and Firebase.

Features:

• Pallet of schema elements: List of all elements of JSON schema, could drag and drop to tree view.
• Pallet of user schemas: List of all user schemas, which are stored in Firebase. User could save, load, delete and import schemas, schema could drag and drop to tree view.
• Tree View of schema elements: The structure of schema, could expend or collapse at any level.
• Context Menu: Right-click on the element in tree view could bring out the context menu for that element, and perform actions specific for that element.
• Property Inspector of schema elements: A panel to edit properties of schema element.
• Text View of schema: A text view to display content of schema.
• Drag and Drop: The element of JSON schema could drag and drop from pallet to tree view or within tree view.
• Undo/Redo: Undo and Redo could keep track of every update of schema.
• Schema Repository: User could save/load schemas to/from Firebase repository, import schema from file.

Preview:

Download Details:

Author: tangram-js

Live Demo: https://json-schema-editor.tangramjs.com/

Download Link: https://github.com/tangram-js/json-schema-editor/archive/master.zip

Official Website: https://github.com/tangram-js/json-schema-editor

Install & Download:

$ npm install json-schema-editor

You Might Be Interested In: