Shaking React Form: Build React Form Easily


Hi everyone, I just published a new project: Shaking React Form, to help build react forms with validations easily. I Hope you’d love to use and help maintain and develop.:slight_smile:


a tiny demo:

import ShackingForm from 'shaking-react-form';
import RawShakingReactFormField from 'raw-shaking-react-form-field';

const schemas = {
    username: {
        label: 'Username',
            if (!v) return 'username is required'
        options: {
            placeholder: 'input username'

    password: {
        label: 'Password',
        type: 'password',
            if (!v || v.length < 6) return 'password cannot be less than 6 letters'

class SomeReactComponent extends React.Component {
    // you can save form values as you like, here is just for convenience saving them directly into state
    constructor(props) {
        this.state = {};
        Object.keys(schemas).forEach(key=>this.state[key] = null);

    render() {
        return <div>
        onSubmit={(values)=>console.log('submit', values)}
        onErrors={(errors)=>console.log('errors', errors)}
            <button type="submit">Submit</button>


Interesting thing !
will use in next login form.:grin:


thanks for support :slight_smile:
as its new, if you find any problem or have any suggestion, please tell us
let’s build it together


Thanks for support. I have pushed a new version 1.0.x, now it’s much easier to create your own field class.
Although there are some break changes in some field types such as group.*, but now they are more straightforward to use.
If you already used the old version, please check the doc.


hello, nice. Is it possible to use aldeed:simple-schema ?


as you see, the schema is different from simple-schema, so you can’t use ss directly.
it is possible to write a mapper to convert ss into srf schema, you can try and contribute to us, thanks :slight_smile:
once I figure out the relation between them, I will also try to write such a mapper


I hope this gets more attention. Looks very promising!


Nothing in 3 months – what ever come to this? I’m looking at doing something like this for one of my forms right now in fact.

Do you have any client side/form validations – for example if radio button 1 is Yes, the show FIelds 1 and 2? Or how about masking, where you have to enter a phone number in correctly?

Looking at the repo the orgininal is depreciated in favor of rf-form, but even rf-form has no activity in 3 months.

The RF-Form demo is nice.