⭐ FeaturedAvanzado
React Component Architecture
Complete React architecture with atomic design
Prompt Completo
Design and implement a comprehensive React component architecture for a SaaS dashboard using Next.js 14 App Router, TypeScript strict mode, and Tailwind CSS. Use atomic design methodology, compound component pattern, custom hooks with SWR, Zustand for UI state and React Query for server state, error boundary hierarchy, and accessible WAI-ARIA patterns
Compatible con
✨GPT-4o✨Claude 3.5 Sonnet✨Cursor✨v0
Principiante Rating
4.8(4,500)
Stats
10,500Vistas
2,300Copias
4,500Me gusta
2,300Guardados
Salida Esperada✨ Alta Calidad
A comprehensive React component architecture with atomic design, compound patterns, and accessible ARIA
The AI would generate a complete architecture:
components/
atoms/ → Button, Input, Badge, Icon
molecules/ → SearchBar, UserAvatar, StatCard
organisms/ → Navbar, Sidebar, DataTable
templates/ → DashboardLayout, AuthLayout
pages/ → Dashboard, Settings, Profile
hooks/
useAuth.ts, useDebounce.ts, useMediaQuery.ts
With compound component patterns:
<DataTable>
<DataTable.Header />
<DataTable.Body>
<DataTable.Row />
</DataTable.Body>
</DataTable>