JSON
SCHEMA
FORM

WHY JSON schema?

  • Quick and easy way to boostrap your app.
  • Intuitive - Easy to consume and modify
  • Little ambiguity - Vocabulary is standardized
  • Performance gains through code reuse
  • Framework agnostic 

Basic

Validation

Future

Complex

Overview

Customization

Demo

BASIC

BASIC SCHEMA DEFINITION

STRING

number /INTEGER

BOOLEAN

DROPDOWN

Similar to string/number properties except the addition of enum keyword which is an array of possible values in the dropdown

advanced

advanced SCHEMA

refERENCES

Provides a mechanism to reuse  portions of schema

DEPENDENCIES

DEPENDENCIES - subschemas

VALIDATON

VALIDATION - STRINGS

minLength - minimum length of string

maxLength -  maximum  length of string

pattern - matches provided regular expression

VALIDATION - NUMBERS

minimum - minimum number allowed

maximum - maximum number allowed

VALIDATION - OBJECT ( or ROOT LEVEL)

required - an array of required properties

customization

CUSTOM SCHEMA - ui schema

  • Introduction of another schema
  • Responsible for custom rendering options
  • Takes care of how to render fields and leaves what to data schema
  • Follows similar tree structure to data  schema

STYLING

  • By default form is responsive
  • Rendering is in order of definition unless options such as lastFieldOnRow is used

custom error handling

future

FUTURE ADDITIONS

  • Support for Field Arrays
  • Property dependencies defined in schema
  • Custom Field renderers
  • Support more default components  - textareas, radio buttons etc
  • Order of properties
  • Extend this to other UI elements
Made with Slides.com