react-createForm

Create hooks to manage your forms.

React create form is experimental open source project that allow you to create form easily, different from the others options, this package guide you to create custom hooks to manage your forms, you can use the same form in different components without context API.

• As other packages, you can also use yup validation to validate your form.
• You can also use different approach to handle your form, like onSubmit | onChange | debounce.
• Less code, than other options.

This project is based on use-form, so you can find some similar features and code implementation. I like to think that react-create-form is the evolution of use-form.

Motivation

Today we have a lot of form packages, and this project don't pretend to be the number one, this is just a new way to create hooks to manage your forms. But if you guys like this project, we can publish it, and maintain it.

First step

The first step is to create your form with the createForm function, this function returns a hook that you can use to manage your form, wherever you want to use.

export const useLoginForm = createForm({
  initialValues: {
    email: '[email protected]',
    password: 'yourpassword',
  }
})

Second step

The second step is to create a component to render your form, you can use the useLoginForm hook to get the form state and manage it.

   import { useLoginForm } from 'react-create-form'
   
   const LoginForm = () => {
      const { handleSubmit, register } = useLoginForm()

      function onSubmit(values) {
        console.log(values)
      }
   
      return (
         <form onSubmit={handleSubmit(onSubmit)}>
         <input type="email" ref={register('email')} />
         <input type="password" ref={register('password')}/>
         <button type="submit">Submit</button>
         </form>
      )
   }

It's All.