Form handling tests your grasp of controlled inputs, validation timing, and UX. Interviewers often ask about libraries vs rolling your own.
Common Interview Questions
Q: When validate — onChange, onBlur, or onSubmit?
Answer: onSubmit for minimal noise; onBlur for field-level feedback after touch; onChange for strict real-time needs (password strength). Combine touched/dirty flags for good UX.
Q: React Hook Form advantages?
Answer: Uncontrolled inputs with refs reduce re-renders, integrates with Zod/Yup resolvers, and simplifies large forms vs manual useState per field.
Q: Schema validation with Zod?
Answer: Define schema once, infer TypeScript types, validate on server and client. Resolver bridges Zod errors to form libraries.
const schema = z.object({
email: z.string().email(),
age: z.number().min(18),
});
Q: Accessibility for form errors?
Answer: Associate errors with aria-describedby, use aria-invalid, announce errors to screen readers, and do not rely on color alone.
Key Points for Interviews
-
Balance UX vs validation aggressiveness
-
Reuse schemas on client and server
-
Libraries reduce boilerplate for large forms
-
Always handle submit loading and error states
-
Prevent default on submit handler