frontend-dev-guidelines

Comprehensive guide for modern React development, emphasizing Suspense-based data fetching, lazy loading, proper file organization, and performance optimization.

| @/ | src/ | import { apiClient } from '@/lib/apiClient' | | types | src/types | import type { User } from 'types/user' | | components | src/components | import { SuspenseLoader } from 'components/SuspenseLoader' | | features | src/features | import { authApi } from 'features/auth' |

| Create a component | component-patterns.md | | Fetch data | data-fetching.md | | Organize files/folders | file-organization.md | | Style components | styling-guide.md | | Set up routing | routing-guide.md | | Handle loading/errors | loading-and-error-states.md | | Optimize performance | performance.md | | TypeScript types | typescript-standards.md |

إرشادات تطوير الواجهة الأمامية لتطبيقات React/TypeScript. الأنماط الحديثة بما في ذلك Suspense، والتحميل البطيء، وuseSuspenseQuery، وتنظيم الملفات مع دليل الميزات، وتصميم MUI v7، وTanStack Router، وتحسين الأداء، وأفضل ممارسات TypeScript. يُستخدم عند إنشاء المكونات أو الصفحات أو الميزات أو جلب البيانات أو التصميم أو التوجيه أو العمل باستخدام كود الواجهة الأمامية. المصدر: sebas-aikon-intelligence/antigravity-awesome-skills.