Robust React Hook with AbortController & Cache
Generates production-ready TypeScript React custom hooks handling race conditions, retry backoff, and caching.
Customize Placeholders in Real-Time
Specify hook name and desired features such as debounce or persistence.
Write a production-grade TypeScript React custom hook named useFetchWithCache<T>(url: string, options?: RequestInit). Features required: 1) In-memory LRU cache with TTL, 2) Automatic cancellation of in-flight requests using AbortController on unmount/re-query, 3) Exponential backoff retry logic (up to 3 attempts), 4) Strict TypeScript types with generic response inference, and 5) Jest unit test suite testing error boundaries.
Optimization Tips & Parameters
Ideal for building lightweight web apps without heavy dependencies like React Query.
Associated Tags & Use Cases
More frontend development Prompts
View full library →
1:1
Type-Safe Accessible Form Engine with Zod & React Hook Form
Generates accessible, type-safe multi-field form components with asynchronous validation, field arrays, and WCAG AA compliance.
Write a production-grade, accessible form component in React and TypeScript using 'react-hook-form' and '@hookform/resolvers/zod'. Form requirements: 1. Fields: Name, Email (with async domain check), Password (with live strength meter scoring 4 criteria), Country Select, Terms Checkbox, and Dynamic Tag Array (add/remove items). 2. Zod Schema: Strict types, custom regex patterns, and descriptive error messages for every failure state. 3. Accessibility: - Proper 'aria-invalid', 'aria-describedby', and 'role="alert"' linkages for error states. - Screen-reader announceable validation feedback. - High-contrast visible focus rings conforming to WCAG 2.1 AA. 4. State Handling: Disabled submit button while isSubmitting or isValidating, inline spinner, server-side error mapping, and form reset on success. 5. Unit Test: Vitest / React Testing Library test suite validating error triggers on empty submit and happy-path submission.