Sobes.tech
Middle+

Parlez-nous de votre travail avec Formik et Yup : à quel point les formulaires étaient complexes, comment avez-vous construit les schémas de validation ?

sobes.tech IA

Réponse de l'IA

Formik est une bibliothèque pour gérer l'état des formulaires dans React, et Yup est utilisée pour la validation des données. J'ai travaillé avec des formulaires de différentes complexités : des simples avec quelques champs aux formulaires multi-étapes et dynamiques.

Pour construire des schémas de validation avec Yup, j'ai utilisé des chaînes de méthodes, par exemple :

import * as Yup from 'yup';

const validationSchema = Yup.object().shape({
  email: Yup.string().email('Format email invalide').required('Champ obligatoire'),
  password: Yup.string().min(8, 'Au moins 8 caractères').required('Champ obligatoire'),
  age: Yup.number().min(18, 'L'âge doit être au moins 18').nullable(),
});

Formik s'intègre avec Yup via la propriété validationSchema, ce qui permet de valider automatiquement le formulaire lors des modifications. Pour les formulaires complexes, j'ai divisé le schéma en parties et les ai combinées, en utilisant également une validation conditionnelle en fonction de l'état du formulaire.