JSON Schema Viewer Build Status

JavaScript tool for visualizing json-schemas, includes validator.

Fair warning, the code "just works" - it could use a good refactoring. Pull requests welcome. The JSV was built to support a specific use case, so support for JSON schema(draft v4) keywords are added on an as-needed basis. You may also notice a few extensions to the spec, e.g. example, translation, version, deprecated, etc.

The demo is rendering the mdJson-schemas. There's also a basic example without the jQuery Mobile interface elements.

JSDocs are here

Built using:


  1. Clone repository: git clone git@github.com:jlblcc/json-schema-viewer.git
  2. Enter project directory: cd json-schema-viewer
  3. Install dependencies via Bower: bower install
  4. Install dependencies via NPM: npm install
  5. Build project via Grunt: grunt
    • grunt dev: Development build. This will create dev.html and basic.html in the project root(these files are .gitignored). This build will load all unminified js files individually.
    • grunt prod: Production build. This will create a production version at ./prod/<%= pkg.version %>/<%= now %>/<%= ver %>. The production version includes concatenated and minified js/css. Note: jQuery/JQuery Mobile are not included in the js builds. The prod directory is also .gitignored.
  6. Serve with your favorite web server:
    • Use grunt connect:server:keepalive to start a basic server at http://localhost:9001
    • example basic nginx config
    • Python: python -m SimpleHTTPServer 9001
    • php 5.4+: php -S localhost:9001


Edit the templates to modify layout:

  • index.html: jQuery Mobile interface. Copied to /dev.html on grunt dev.
  • basic.html: a basic example without jQuery Mobile or Sass dependency(css included in <head>).
  • latest.html: redirects to the last production build. Copied to /index.html on grunt prod.


See [Gruntfile.js] (https://github.com/jlblcc/json-schema-viewer/blob/master/Gruntfile.js) or the JSDocs for details on the available Grunt tasks. grunt --help will also list available tasks.

This project was inspired by robschmuecker’s block #7880033.