json schema editor

JSON-SCHEMA 편집자

스키마의 구조를 제시하기위한 트리 뷰와 스키마 요소의 속성을 편집하기위한 속성 검사관을 제공하는 JSON 스키마의 직관적 편집기. Vue.js 2 및 Firebase로 개발하십시오. 자세한 내용은 프로젝트 웹 사이트를 참조하십시오.

특징

스키마 요소의 팔레트

JSON 스키마의 모든 요소 목록은 트리 뷰로 드래그 앤 드롭 할 수 있습니다.

사용자 스키마의 팔레트

Firebase에 저장된 모든 사용자 스키마 목록. 사용자는 스키마를 저장,로드, 삭제 및 가져올 수 있으며 스키마는 트리 뷰로 드래그 앤 드롭 할 수 있습니다.

스키마 요소의 트리보기

스키마의 구조는 어느 수준에서든 소비하거나 붕괴 될 수 있습니다.

맥락 메뉴

Tree View의 요소를 마우스 오른쪽 버튼으로 클릭하면 해당 요소의 컨텍스트 메뉴가 나오고 해당 요소에 맞는 작업을 수행 할 수 있습니다.

스키마 요소의 속성 검사관

스키마 요소의 속성을 편집하는 패널.

스키마의 텍스트보기

스키마 컨텐츠를 표시하는 텍스트보기.

드래그 앤 드롭

JSON 스키마의 요소는 팔레트에서 트리 뷰로 또는 트리 뷰로 드래그 앤 드롭을 드래그 앤 드롭 할 수 있습니다.

실행 취소/다시

실행 취소 및 Redo는 모든 스키마 업데이트를 추적 할 수 있습니다.

스키마 저장소

사용자는 Firebase 리포지토리에 대한 스키마를 저장/로드 할 수 있으며 파일에서 스키마를 가져올 수 있습니다.

설치하다

git clone https://github.com/tangram-js/json-schema-editor.git

짓다

 # install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

Firebase 구성 정보

이 프로젝트는 올바르게 작동하려면 유효한 Firebase 구성이 필요합니다. /src/firebase/index.js 의 config를 Firebase 구성으로 바꾸십시오.

 // Initialize firebase
// Replace following config with your Firebase config
var config = {
  apiKey : 'your firebase api key' ,
  authDomain : 'your firebase auth domain' ,
  databaseURL : 'your firebase database url' ,
  projectId : 'your firebase project id' ,
  storageBucket : 'your firebase storage bucket' ,
  messagingSenderId : 'your firebase message sender id'
} 

JSON 편집자 정보

JSON 편집기는 JSON 스키마 편집기의 후속 인이며, JSON 스키마를 포함한 JSON 문서의 스키마 인식 편집기입니다. JSON 문서의 구조를 제시하기 위해 트리 뷰를 제공하며 사용자는 컨텍스트 메뉴에서 JSON을 조작 할 수 있습니다. JSON 문서의 내용을 제시하는 텍스트보기가 있습니다. 사용자는 JSON을 편집 할 수 있습니다. 사용자 계정 및 사용자 스키마 저장소를 공유하므로 사용자는 하나의 계정을 사용하여 편집자와 액세스 스키마를 모두 로그인 할 수 있습니다.