JoviDeCroock / Hooked Form
Licence: mit
Performant 2KB React library to manage your forms
Stars: โญ 110
Programming Languages
typescript
32286 projects
Projects that are alternatives of or similar to Hooked Form
React Form
โ๏ธ Hooks for managing form state and validation in React
Stars: โญ 2,270 (+1963.64%)
Mutual labels: hooks, forms
Fielder
A field-first form library for React and React Native
Stars: โญ 160 (+45.45%)
Mutual labels: hooks, forms
React Hook Form
๐ React Hooks for form state management and validation (Web + React Native)
Stars: โญ 24,831 (+22473.64%)
Mutual labels: hooks, forms
Formik
Build forms in React, without the tears ๐ญ
Stars: โญ 29,047 (+26306.36%)
Mutual labels: hooks, forms
react-cool-form
๐ ๐ React hooks for forms state and validation, less code more performant.
Stars: โญ 246 (+123.64%)
Mutual labels: hooks, forms
Usetheform
React library for composing declarative forms, manage their state, handling their validation and much more.
Stars: โญ 40 (-63.64%)
Mutual labels: hooks, forms
Formium
The headless form builder for the modern web.
Stars: โญ 78 (-29.09%)
Mutual labels: hooks, forms
I7j Pdfhtml
pdfHTML is an iText 7 add-on for Java that allows you to easily convert HTML and CSS into standards compliant PDFs that are accessible, searchable and usable for indexing.
Stars: โญ 104 (-5.45%)
Mutual labels: forms
Ftpbucket
FTPbucket is a PHP script that enables you to sync your BitBucket or GitHub repository with any web-server
Stars: โญ 99 (-10%)
Mutual labels: hooks
Play2 Html5tags
HTML5 form tags module for Play Framework
Stars: โญ 101 (-8.18%)
Mutual labels: forms
Dirty Check Forms
๐ฌDetect Unsaved Changes in Angular Forms
Stars: โญ 105 (-4.55%)
Mutual labels: forms
Uniforms
A React library for building forms from any schema.
Stars: โญ 1,368 (+1143.64%)
Mutual labels: forms
Form
Form is an iOS Swift library for building and styling UIs
Stars: โญ 99 (-10%)
Mutual labels: forms
Iostore
ๆ็ฎ็ๅ
จๅฑๆฐๆฎ็ฎก็ๆนๆก๏ผๅบไบ React Hooks API
Stars: โญ 99 (-10%)
Mutual labels: hooks
React Jsonschema Form
A React component for building Web forms from JSON Schema.
Stars: โญ 10,870 (+9781.82%)
Mutual labels: forms
Clean State
๐ป A pure and compact state manager, using React-hooks native implementation, automatically connect the module organization architecture. ๐
Stars: โญ 107 (-2.73%)
Mutual labels: hooks
Hooked-Form
๐ Installation
yarn
yarn add hooked-form
npm
npm i --save hooked-form
UMD
dev:
<script src="https://unpkg.com/[email protected]/dist/hooked-form.umd.js"></script>
๐จ Example
import React from 'react';
import { HookedForm, useField } from 'hooked-form';
const StringField = ({ fieldId, label }) => {
const [{ onChange }, { touched, error, value }] = useField(fieldId);
const onInput = React.useCallback(e => onChange(e.currentTarget.value), [
onChange,
]);
return (
<label>
{label + ' '}
<input value={value} onChange={onInput} />
{touched && error && <div>{error}</div>}
</label>
);
};
const App = () => {
return (
<HookedForm
onSubmit={console.log}
validateOnBlur
initialValues={React.useMemo(() => ({ name: '' }), [])}
validate={values => (values.name ? {} : { name: 'Required' })}
>
<h3>Hooked Form</h3>
<StringField label="Name:" fieldId="name" />
<input type="submit" value="Submit" />
</HookedForm>
);
};
render(<App />, document.body);
๐ฟ Modern build
This library offers a modern build (ES2015 output), this is smaller and parses faster in the browser. So if you don't plan to target older browsers feel free to use this.
Webpack
"resolve": {
"alias": {
"hooked-form": "hooked-form/dist/hooked-form.modern.js"
}
}
Parcel
"alias": {
"hooked-form": "hooked-form/dist/hooked-form.modern.js"
}
๐ข Credits
๐Contributors
Thanks goes to these wonderful people (emoji key):
Laurens Lavaert ๐ป |
Jovi De Croock ๐ โ ๏ธ ๐ ๐ ๐ป |
Jonathan Callewaert ๐ |
Andrew Rempe ๐ป |
Corentin Leruth ๐ป |
Pavel Ravits ๐ |
Tegan Churchill ๐ |
This project follows the all-contributors specification. Contributions of any kind welcome!
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].