Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/BearStudio/formiz
🐜 React forms with ease! Composable, headless & with built-in multi steps
https://github.com/BearStudio/formiz
form form-validation form-validation-react formiz forms hacktoberfest multi-step-form react typescript wizard
Last synced: 11 days ago
JSON representation
🐜 React forms with ease! Composable, headless & with built-in multi steps
- Host: GitHub
- URL: https://github.com/BearStudio/formiz
- Owner: BearStudio
- License: mit
- Created: 2019-04-23T08:58:54.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2024-10-09T12:54:59.000Z (about 1 month ago)
- Last Synced: 2024-10-29T17:11:46.647Z (12 days ago)
- Topics: form, form-validation, form-validation-react, formiz, forms, hacktoberfest, multi-step-form, react, typescript, wizard
- Language: TypeScript
- Homepage: https://formiz-react.com/
- Size: 11.3 MB
- Stars: 391
- Watchers: 7
- Forks: 50
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# Formiz
```
npm install @formiz/core
```[👉 Getting Started](https://formiz-react.com/getting-started)
## Features
- 🏗 Composable API and validations
- 🧙 Built-in multi steps
- 💅 Headless, build your own UX!
- 📋 Turn everything into fields
- ⚛️ Built with Typescript & hooks
- 📱 React Native compatible## Concept
The idea behind **Formiz** is to allows you to build advanced forms with
**multiple steps, complex validations** and a **good UX** without pain.The main idea is to build fields as independent reusable components.
**Fields can be anything**, not just inputs. Once you have built your fields,
you can use them everywhere.When you use a field built with Formiz, you can apply validations on it.
**Only the mounted fields will apply their validation** to the current step and to the form.```jsx
// Field Example```
---
# Contributing
## Installation
Requirements
- [NodeJS](https://nodejs.org/)
- [pnpm](https://pnpm.io/installation)
- On React Native : add [os](https://github.com/DiegoRBaquero/node-os) in package.json```sh
pnpm install
```## Development
```sh
pnpm dev
```- Documentation available on [localhost:3000](http://localhost:3000/)
- Examples available on [localhost:3001](http://localhost:3001/)# Sponsors
Thanks to our sponsors. [Become one of them](https://opencollective.com/formiz).