Edit in JSFiddle

var FG            = window.FormGenerator
  , t             = window.FormGenerator.tools
  , GeneratedForm = FG({});

var App = React.createClass({
    getInitialState: function () {
        return {
            value:   t.evalDefaults( meta ),
            errors:  {}
        };
    },

    handleFormChanged: function ( newValue, change, fldErrors ) {
        this.setState({ 
            value:   newValue,
            errors:  t.merge( this.state.errors, fldErrors )
        });
    },
        
    render: function() {
        return (<GeneratedForm meta={meta}
                               value={this.state.value}
                               errors={this.state.errors}
                               onChange={this.handleFormChanged}/>);
    }
});

React.render( <App />, document.body );

<script src="http://facebook.github.io/react/js/jsfiddle-integration.js"></script>
<script src="http://azaviruha.github.io/repo/js/react-form-generator.global.min.js"></script>

<script>
    window.meta = {
    "fields": {
        "field1": {
            "renderer": "textarea",
            "defaultValue": "111",
            "validators": [
                {
                    "rule": "required",
                    "message": "Field is required"
                },
                {
                    "rule": "maxLength",
                    "value": 5,
                    "message": "Maximum length of field is 5 characters"
                }
            ]
        },
        "field2": {
            "renderer": "checkbox",
            "defaultValue": 1,
            "rendererSpecific": {
                "truthMap": {
                    true:  1,
                    false: 0
                }
            },
            "validators": [
                {
                    "rule": "required",
                    "message": "Field is required"
                }
            ]
        }
    },
    "layout": {
        "grid": {
            "css": "container demo-form",
            "rows": [{
                "css": "row",
                "cells": [{
                    "css": "col-xs-12 col-sm-12 col-md-10",
                    "content": [{
                        "renderer": "default",
                        "rendererSpecific": {
                            "fieldID": "field1",
                            "label": "Field #1:",
                            "css": {
                                "wrapper": "row",
                                "label": "col-xs-2 col-sm-2 col-md-2",
                                "field": "col-xs-10 col-sm-10 col-md-10",
                                "errors": "col-xs-12 col-sm-12 col-md-12"
                            }
                        }
                    }]
                }]
            }, {
                "css": "row",
                "cells": [{
                    "css": "col-xs-12 col-sm-12 col-md-10",
                    "content": [{
                        "renderer": "default",
                        "rendererSpecific": {
                            "fieldID": "field2",
                            "label": "Field #2:",
                            "css": {
                                "wrapper": "row",
                                "label": "col-xs-2 col-sm-2 col-md-2",
                                "field": "col-xs-10 col-sm-10 col-md-10",
                                "errors": "col-xs-12 col-sm-12 col-md-12"
                            }
                        }
                    }]
                }]
            }]
        }
    }
}
</script>


<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>