manage your data using with react hook form and yup and send it to your server
- React js or Next js
- React hook form
- yup
- Axios
- Express js
- Cors
in client folder you can see the react hook form and yup tool and axios that can send your data to server
const userSchema = yup.object().shape({
Username: yup.string().required(),
Age: yup.string().required(),
});
const { register:registeruser, handleSubmit:handleSubmituser, formState: { errors:errorsuser }, reset:resetuser } = useForm({
resolver: yupResolver(userSchema),
});
//posting your data from yup to server
const onSubmitHandleruser = (data) => {
axios({
method: 'post',
url: `http://localhost:3001/api/user`,
data: data,
})
.then(function (response) {
setDatas(response.data)
setLoading(true)
//console.log(response)
}).catch(function (error) {
console.log(error);
})
}; the server folder is a basic express server that will be available response your requests
app.post("/api/user", (req, res) => {
const username = req.body.Username;
const age = req.body.Age;
res.send({"name" : username, "age" : age})
console.log("data receive")
});
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent