# ๐ซ Just Submit
Submit simple form, with safe types, without management!
[](https://www.npmjs.com/package/just-submit)
[](https://github.com/jsun969/just-submit/blob/dev/LICENSE)
[](https://bundlephobia.com/result?p=just-submit)
[](https://www.npmjs.com/package/just-submit)
## โจ Features
- ๐ TYPE SAFE
- โก Speedy DX
- ๐ถ Beginner-Friendly
- ๐งช Well-Tested
- ๐ Ultra Light
- ๐งฉ Framework-Agnostic
## ๐ฆ Install
```bash
pnpm add just-submit
```
## ๐ฏ Quickstart
> [!IMPORTANT]
> Don't forget to add a **default value** for **optional** fields.
```ts
const handleSubmit = createSubmit({
fullName: 'string',
age: 'number',
birthday: 'date',
wantGift: 'boolean',
});
// Inside form submit event handler
handleSubmit((data) => {
// ^ { fullName: string; age: number; birthday: Date; wantGift: boolean }
});
```
## ๐ Examples
### React
```tsx
import { createSubmit } from 'just-submit';
const Form = () => {
const handleSubmit = createSubmit({
fullName: 'string',
age: 'number',
birthday: 'date',
wantGift: 'boolean',
});
return (
);
};
```
### Vue
```vue
```
### Vanilla
```html
```
```ts
import { createSubmit } from 'just-submit';
const handleSubmit = createSubmit({
fullName: 'string',
age: 'number',
birthday: 'date',
wantGift: 'boolean',
});
const form = document.querySelector('form')!;
form.addEventListener(
'submit',
handleSubmit((data) => {
// ...
}),
);
```
### CDN
```html
```
## ๐ Troubleshooting
### Form Field Converting Error
This library can only convert `string` values from `FormData`.
For **optional** fields, add a **default value** in case they are `null` in submission.
### How to control form? (watch value changes / form state / etc.)
This library is for simple forms that don't need to be controlled.
If you are working on a complex form, try [the libraries here](#-thanks) instead.
### Can I use it with ...(other framework) ?
You probably **CAN**! The `handleSubmit` function can be used in any submit event that has `preventDefault` and `currentTarget`.
The examples provided include only the frameworks that have passed our tests. If you find this library works with any other framework, please don't hesitate to **create a PR** for it. We greatly appreciate your contributions and support!
## ๐ Thanks
Drawing inspiration and motivation from the following projects:
- [react-hook-form](https://github.com/react-hook-form/react-hook-form) (React)
- [vorm](https://github.com/Mini-ghost/vorms) (Vue)