React JS من الصفر إلى الاحتراف: الدليل الشامل
React JS من الصفر إلى الاحتراف: الدليل الشامل
أتقن مكتبة React.js من البداية. تأخذك هذه الدورة الشاملة المكونة من 60 درساً من مستوى المبتدئ تماماً إلى المستوى الاحترافي، حيث تغطي الـ Hooks، وإدارة الحالة (State Management)، وتكامل واجهات البرمجة (API integration)، وتحسين الأداء.
الدروس
- مقدمة إلى React والنظام البيئي (Ecosystem)
- إعداد بيئة التطوير الخاصة بك
- إنشاء أول مشروع React باستخدام Vite
- فهم هيكلية المشروع
- مقدمة في JSX
- المكونات الوظيفية (Functional Components)
- الـ Props: تمرير البيانات إلى المكونات
- التنسيق في React: ملفات CSS والأنماط المضمنة
- التعامل مع الأحداث (Events)
- الـ useState Hook: مقدمة في الـ State
- الرندر الشرطي (Conditional Rendering)
- القوائم والمفاتيح (Lists and Keys)
- الـ useEffect Hook: الأساسيات
- عمليات التنظيف والتبعيات في useEffect
- بناء أول مشروع صغير: قائمة مهام (Todo List)
- رفع الحالة للأعلى (Lifting State Up)
- المكونات المتحكم بها مقابل غير المتحكم بها
- الـ useRef Hook
- الـ useMemo Hook
- الـ useCallback Hook
- الـ Hooks المخصصة: إعادة استخدام المنطق
- مقدمة في Context API
- useContext والـ Contexts المتعددة
- الـ useReducer Hook
- مقدمة في React Router v6
- التوجيه الديناميكي وبارامترات الرابط (URL Params)
- المسارات المتداخلة والـ Outlets
- المسارات المحمية والمصادقة
- جلب البيانات باستخدام Fetch API
- التعامل مع حالات التحميل والخطأ
- مقدمة في Axios
- عمليات CRUD: الـ GET والـ POST
- عمليات CRUD: الـ PUT والـ DELETE
- مقدمة في Redux Toolkit
- Redux: الـ Slices وإعداد الـ Store
- Redux: استخدام useSelector و useDispatch
- Redux غير المتزامن باستخدام createAsyncThunk
- أساسيات React Query (TanStack Query)
- استخدام Formik و Yup للتحقق من النماذج
- React Memo والمكونات النقية (Pure Components)
- الـ Portals: الرندر خارج الـ Root
- المكونات عالية الرتبة (HOC)
- حدود الأخطاء (Error Boundaries)
- مقدمة في اختبار الوحدة باستخدام Vitest
- اختبار الـ Hooks والخدمات
- تحليل الأداء (Performance Profiling)
- تقسيم الكود باستخدام React.lazy
- Next.js: مستقبل React؟
- العمل مع متغيرات البيئة
- النشر على Vercel/Netlify
- أنماط المكونات المتقدمة: المكونات المركبة
- احتراف الـ useId Hook
- العمل مع Styled Components
- استخدام Tailwind CSS مع React
- انتقالات React: استخدام useTransition
- الـ useDeferredValue Hook
- المشروع النهائي: الجزء 1 - الهندسة والبناء
- المشروع النهائي: الجزء 2 - الميزات
- المشروع النهائي: الجزء 3 - اللمسات الأخيرة
- الخاتمة والمسار الوظيفي