Skip to main content
@react-form-builder/core is the free, MIT-licensed runtime at the heart of FormEngine, a React library that renders forms from JSON schemas. Define a form as a JSON object, pass it to FormViewer, and it renders with full state management, validation, conditional logic, and event handling. The UI layer is pluggable: use Material UI, React Suite, Mantine, or your own component library. No seat limits, no attribution required — production-ready and zero cost.
FormEngine Core — responsive form rendered on desktop, tablet, and mobile from a single JSON schema

​
Key capabilities

JSON-driven rendering

Form structure, validation rules, and behavior all live in a portable JSON schema

Conditional logic

Show or hide fields declaratively in the schema, no custom JSX conditionals required

Computed properties

Derive field values and states from other form data

Actions and events

Attach named handlers to field events; trigger validation, navigation, or API calls

Localization

Built-in multi-language support with per-language property overrides

Pluggable UI

Swap the component layer (MUI, Mantine, custom) without changing the schema

Zod validation

Built-in validation rules backed by Zod; custom rules are supported

TypeScript support

Typed schema and component props throughout

​
Why JSON instead of JSX?

If you’re coming from React Hook Form or Formik, the main difference is that FormEngine Core replaces per-field JSX with a single JSON object that describes the entire form.
TaskReact Hook Form / FormikFormEngine Core
Define a formWrite JSX + useForm hooks for each fieldOne JSON object → FormViewer renders it
Add a new fieldNew JSX component, register, validation codeAdd one entry to JSON
Show/hide a field conditionallyWrite {condition && <Field />} in JSXSet "visible": { "rule": "..." } in JSON
Switch UI libraryRewrite all JSX for the new libraryChange the view adapter — JSON stays the same
Let non-developers edit formsNot possible without custom toolingFormEngine Designer outputs the same JSON
Update a live formChange code → build → deployUpdate JSON — no redeploy
This matters when you have dozens of forms, when business users need to change forms without developers, or when the same form needs to render with different UI libraries.

​
How it works

FormEngine Core separates the form definition from the renderer. A JSON object describes the form structure, component types, props, validation rules, and event handlers. A view adapter maps those component types to real React components. FormViewer receives both and renders the live form.
1

Define your form as JSON

{
  "form": {
    "key": "Screen",
    "type": "Screen",
    "children": [
      {
        "key": "muiTextField1",
        "type": "MuiTextField",
        "props": {
          "label": { "value": "First name" }
        }
      }
    ]
  }
}
2

Render with FormViewer

function MyApp() {
  return <FormViewer view={muiView} getForm={() => JSON.stringify(myForm)} />
}
The view prop is a component library adapter. Pre-built adapters are available for Material UI (@react-form-builder/components-material-ui), Mantine (@react-form-builder/components-mantine), and React Suite. You can also build an adapter for your own design system.

​
UI library support

FormEngine Core’s pluggable architecture means the default UI components are replaced — not stacked on top — when you switch to an external library. This is what makes FormEngine competitive on bundle size when used with Material UI or Mantine. See Bundle Size Comparison for measured data.

​
Support

​
License

FormEngine Core is free forever under the MIT license. Use it in commercial products, SaaS apps, internal tools — no seat limits, no attribution required, no strings attached.

Installation

Set up FormEngine Core in your project.

Rendering Forms

Render JSON form definitions with production-ready runtime behavior.

Validation

Add field and form validation with scalable rule management.

Actions and Events

Implement dynamic logic and integration behavior in runtime flows.
Last modified on April 16, 2026