The ReactJS form library

Createform provides you an intuitive way to create, and manage forms easily in ReactJs applications.


onChange Demo

Try mode onChange feature now and experience the power of Createform

Form

Values

{
  "email": "",
  "password": "",
  "confirmPassword": "",
  "terms": false
}

Zod schema

{
  "email": "z.string().email()",
  "password": "z.string().min(8)",
  "passwordConfirm": "z.string().min(8)",
  "terms": "z.boolean()"
}

Errors

{}

Createform highlights

Nested forms

Createform supports nested forms using dot notation, allowing for easy access to nested objects within a form data structure.

Validation

Createform offers Yup or Zod validation options with the option for schema validation through the createForm function or inline validation through the register function.

Flexible

Createform is a form builder that allows you to create forms with custom fields and validation rules. It supports onSubmit, onChange, and debounced events and can be used in either controlled or uncontrolled mode for flexibility in form design.

pin1
Easy

Createform simplifies form creation in React with less code, eliminating the need for additional libraries like React Context or Redux. Sharing forms is easy with the hook created by the createForm function.

Performance

Createform offers efficient performance with just one render required to fulfill and submit a form. Unlike other form libraries that can be heavy and limited in form creation options, Createform allows for versatile form design while maintaining optimal performance.

Effortless

Createform makes it easy to share forms between different components in your React application through the hook created by the createForm function.

Createform features

Debounced

The debounce parameter delays the updating of the state until the user has stopped changing inputs for a predetermined amount of time.

OnChange

This form mode, allow to create a form that will update the inputs state whenever the user type something in the fields.

OnSubmit

Fullfil all fields, nad submit it with just one render, it's the most performative way to create a form.

Inline validation

Pass a value schema in register function as a param to have a inline validation.

Dot notation

Use dot notation to access nested values in form objects, or to register a field.

More

you can find more valuable feature reading the complete documentation...