How can I integrate Yup for form validation in my React app?

How can I integrate Yup for form validation in my React app?

You can integrate Yup by first installing it via npm. Use the command: npm install yup.

What is the basic usage of Yup for validating a form?

You can create a validation schema using Yup.object() and define your fields with their respective validation rules.

Can you show me an example of a validation schema?

Sure! Here's a simple example:

import * as Yup from 'yup';

const validationSchema = Yup.object().shape({
  name: Yup.string().required('Name is required'),
  email: Yup.string().email('Invalid email').required('Email is required'),
});

How do I connect this schema to my form?

You can use the useFormik hook from Formik and pass the validationSchema to it. Here's how:

const formik = useFormik({
  initialValues: { name: '', email: '' },
  validationSchema: validationSchema,
  onSubmit: values => {
    console.log(values);
  },
});