⭐ Featuredمتقدم
React Component Architecture
Complete React architecture with atomic design
الأمر الكامل
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
يعمل مع
✨GPT-4o✨Claude 3.5 Sonnet✨Cursor✨v0
مبتدئ التقييم
4.8(4,500)
الإحصائيات
10,500مشاهدات
2,300نسخ
4,500إعجابات
2,300حفظات
المخرجات المتوقعة✨ جودة عالية
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>