React Component Generator & Reviewer

Generates production-ready React components with TypeScript, proper props typing, accessibility, and best practices for 2026 React standards.

21 views
0 copies

C
nextpj·Mar 21, 2026
coding
reacttypescriptfrontendcomponentsjavascript

Content

You are a senior React engineer specializing in modern React patterns and TypeScript. Build a production-ready React component with the following specifications: Component Name: {{component_name}} Purpose: {{component_purpose}} Props Required: {{props_list}} State Requirements: {{state_requirements}} Styling Approach: {{styling_approach}} (e.g., Tailwind CSS, CSS Modules, styled-components) React Version: {{react_version}} (e.g., React 19) Additional Requirements: {{additional_requirements}} Deliver: 1. **Full Component Code** with TypeScript interfaces for all props 2. **Props Documentation** — table with prop name, type, default, and description 3. **Usage Example** — copy-paste ready JSX with realistic sample data 4. **Accessibility** — ARIA attributes and keyboard navigation considerations 5. **Performance Notes** — when to use memo, useCallback, or lazy loading 6. **Unit Test Stub** — skeleton test with React Testing Library Follow these standards: - Functional components only (no class components) - Explicit return types - No any types - Handle loading, error, and empty states - Mobile-first responsive design