はじめに Reactでライブラリを利用してフォームバリデーションを実現する時、ナイーブな実装だとすぐにUIとフォームライブラリが密結合してしまいます。例えば、React Hook Formの場合は以下のようになります。 import { useForm, SubmitHandler } from "react-hook-form"; type Inputs = { example: string, exampleRequired: string, }; export default function App() { const { register, handleSubmit, watch, …