Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/suyesh/redux-state-validator
https://github.com/suyesh/redux-state-validator
flux json-schema redux redux-state redux-state-validation
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/suyesh/redux-state-validator
- Owner: suyesh
- Created: 2018-07-27T14:44:48.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2018-07-27T19:00:18.000Z (over 6 years ago)
- Last Synced: 2024-10-04T05:05:04.875Z (3 months ago)
- Topics: flux, json-schema, redux, redux-state, redux-state-validation
- Language: JavaScript
- Size: 8.79 KB
- Stars: 6
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.MD
Awesome Lists containing this project
README
# Redux State Validator
![Redux State Validator](http://res.cloudinary.com/dvnjqhdxp/image/upload/c_scale,w_2153/v1532706169/imgonline-com-ua-twotoone-OYK8DdNX1DBiXj.jpg)
A Simple Redux middleware to validate redux state values and object types using JSON Schema.
![How it looks](https://res.cloudinary.com/dvnjqhdxp/image/upload/v1532708882/stateValidation.gif)
## PRE-REQUIREMENT (IMPORTANT)
You need to create JSONSchema file going to [Jsonschema.net](https://jsonschema.net). Its super simple. When you go to jsonschema.net, you will see an editor on the left. Type your state in there with default values and it will autodetect the types and generate Schema on the right. Copy and paste that in a file and export it as default. Like below
![jsonSchemaEditor](http://res.cloudinary.com/dvnjqhdxp/image/upload/v1532707027/Screen_Shot_2018-07-27_at_11.56.34_AM.png)
```
export default {
$id: 'http://example.com/example.json',
type: 'object',
definitions: {},
$schema: 'http://json-schema.org/draft-07/schema#',
properties: {
firstReducer: {
$id: '/properties/firstReducer',
type: 'object',
properties: {
state1: {
$id: '/properties/firstReducer/properties/state1',
type: 'boolean',
title: 'The State1 Schema ',
default: false,
examples: [true]
},
state2: {
$id: '/properties/firstReducer/properties/state2',
type: 'integer',
title: 'The State2 Schema ',
default: 0,
examples: [22]
},
state3: {
$id: '/properties/firstReducer/properties/state3',
type: 'array',
items: {
$id: '/properties/firstReducer/properties/state3/items',
type: 'string',
title: 'The 0th Schema ',
default: '',
examples: ['apple', 'orange']
}
}
}
},
secondReducer: {
$id: '/properties/secondReducer',
type: 'object',
properties: {
state1: {
$id: '/properties/secondReducer/properties/state1',
type: 'boolean',
title: 'The State1 Schema ',
default: false,
examples: [true]
},
state2: {
$id: '/properties/secondReducer/properties/state2',
type: 'integer',
title: 'The State2 Schema ',
default: 0,
examples: [22]
},
state3: {
$id: '/properties/secondReducer/properties/state3',
type: 'array',
items: {
$id: '/properties/secondReducer/properties/state3/items',
type: 'string',
title: 'The 0th Schema ',
default: '',
examples: ['apple', 'orange']
}
}
}
}
}
};
```## Installation
Install it as:
$ npm install --save redux-state-validator
## USAGE
### Import Validator from redux-state-validator
```
import Validator from 'redux-state-validator';
```### Import Json Schema on the file
```
import stateSchema from './your-json-schema';
```### Setup `Validator` to use the schema
```
const stateValidator = Validator.Schema(stateSchema);
```### Apply to the redux middleware
```
const store = createStore(
reducers,
initialState,
applyMiddleware(stateValidator)
);
```Thats it.
By default it will log message only when the validation fails, If you also want to log the validation success message you can pass an additional parameter like follows:
```
const stateValidator = Validator.Schema(stateSchema, true)
```