React Hook Form

manage your data using with react hook form and yup and send it to your server

📜libraries

• 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")
});