https://github.com/itsjonq/formit
๐Formit: A speedy way to create HTML forms.
https://github.com/itsjonq/formit
Last synced: about 2 months ago
JSON representation
๐Formit: A speedy way to create HTML forms.
- Host: GitHub
- URL: https://github.com/itsjonq/formit
- Owner: ItsJonQ
- License: mit
- Created: 2018-05-13T20:14:19.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2018-05-14T02:04:15.000Z (about 8 years ago)
- Last Synced: 2025-01-13T19:41:24.344Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 171 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# ๐ Formit
> A speedy way to create HTML forms.
* โก๏ธ **Tiny**, around 1.35 KB gzipped
* ๐ **Zero dependences**
* ๐ **Styleless** by design, allowing you to add your own.
**[Check out the demo](http://formit.surge.sh/)**
## ๐ง Installation
```
npm install --save formit
```
Then, import it into your Javascript workflow:
```js
import Formit from 'formit'
```
The UMD build is also available via [unpkg](https://unpkg.com):
```html
```
## ๐น Usage
Here's a quick example of how you can compose HTML forms with Formit:
#### 1. Prepare the HTML
Create somewhere for your Formit elements to render to:
```html
```
#### 2. Generate with Formit
Target your selector, and pass in the Formit elements you want to generate:
```js
Formit('#form', [
{
label: 'First name',
type: 'text',
placeholder: 'First',
autofocus: true,
},
{
label: 'Last name',
placeholder: 'Last',
type: 'text',
},
{
type: 'submit',
value: 'Go!'
},
])
```
#### 3. Check out your rendered form
Aw yea! Your selector is now populated with ready-to-use form elements.
A cool feature of Formit is that it'll automatically generate unique IDs and associate the `` (if generated) with the field.
```html
First name
Last name
```
## ๐ Notes
Tests and additional docs coming soon!
## โค๏ธ Thanks
A big thanks to [developit](https://github.com/developit) for his amazing tools and for being a source of inspiration.