Build a Form with Validation
Get a complete form with client-side validation, error messages, loading states, and accessible markup.
5-10 min|Intermediate
BuildDeep WorkDeveloper
Prompt Template
Build a [type] form (e.g. signup, contact, settings) with these fields: [List each field with: name, type, required/optional, validation rules] Example: - Email: required, must be valid email format - Password: required, minimum 8 characters, must include a number - Name: optional, max 50 characters Requirements: - Show inline error messages below each field (red text, appears on blur or submit) - Disable the submit button while submitting, show a spinner - On success: [describe what happens, e.g. show success toast, redirect to /dashboard] - On error: [describe what happens, e.g. show error message above form] - Use [controlled/uncontrolled] components - Styling: Tailwind CSS, dark mode support - Accessibility: proper labels, aria-invalid on error, focus management on submit error Do NOT use a form library (like React Hook Form or Formik) unless I specify one." **Output format:** Complete component code.
Listing every field with its validation rules eliminates back-and-forth. The "do NOT use a form library" constraint keeps things simple unless you want the complexity.
Any time you need a form. Adapt the fields and validation rules to your specific use case.