En
ع
Search
⌘ K
AI Features
Log In
تعلم React 19: الدليل الكامل لتطبيقات الويب الحديثة
1.
قبل أن نبدأ
مقدمة عن الدورة
2.
JavaScript لـ React: مراجعة سريعة
المتغيرات وأنواع البيانات
الدوال، ودوال الأسهم، ووظائف الاستدعاء
النطاق والإغلاقات
الكائنات والمصفوفات
البرمجة غير المتزامنة في JavaScript
ميزات JavaScript الحديثة و ES6+
أساسيات DOM لمطوري React
اختبار: أساسيات JavaScript لـ React
التحدي: تطبيق قائمة المهام الديناميكية
الحل: تطبيق قائمة المهام الديناميكية
3.
مقدمة إلى React
لماذا React؟
ما هو React؟
DOM الافتراضي: قوة React
فهم بناء جملة JSX
عرض عناصر JSX في React
اختبار قصير: مقدمة إلى React
التحدي: عرض صفحة ملف تعريف ديناميكية
الحل: عرض صفحة ملف تعريف ديناميكية
4.
مكونات React
مقدمة إلى مكونات React
تمرير الخصائص إلى المكونات
تنسيق المكونات في React
معالجة الأحداث في مكونات React
إنشاء مكونات عديمة الحالة
اختبار: مكونات React
التحدي: صفحة عرض المنتجات
الحل: صفحة عرض المنتجات
5.
الخطافات: إدارة الحالات والتأثيرات في مكونات React
فهم الخطافات في React
خطاف حالة الاستخدام
خطاف useEffect
دمج حالتي الاستخدام وتأثير الاستخدام للتفاعلات الديناميكية
خطاف استخدام السياق
خطاف useRef
خطاف useMemo
اختبار: خطافات React
التحدي: نظام إدارة المخزون مع تصميمات مميزة
الحل: نظام إدارة المخزون مع قوالب تصميمية
6.
React Router and Navigations
مقدمة إلى React Router
تحديد المسارات في React
التنقل بين الصفحات في React
التوجيه الديناميكي
المسارات المتداخلة
صفحة الخطأ 404 ومسارات الأحرف البديلة
التنقل بين البرامج
اختبار قصير: React Router والتنقل
التحدي: تطبيق مبسط للتجارة الإلكترونية
الحل: تطبيق مبسط للتجارة الإلكترونية
7.
تحسينات جديدة في React 19
الحكم كدعامة
وظائف تنظيف المراجع
السياق كمزود خدمة
دعم بيانات تعريف المستندات
دعم البرامج النصية غير المتزامنة
اختبار: تحسينات React 19
Mock Interview
Premium
Test Your React Skills
8.
الخطافات المتقدمة في الممارسة
لماذا لا تكفي الخطافات الأساسية
إدارة الحالة المعقدة باستخدام useReducer
تحسين عمليات إعادة العرض باستخدام useCallback و useMemo
استخدام متقدم: حفظ البيانات ومنع إعادة العرض
الخطافات المخصصة: إعادة استخدام المنطق عبر المكونات
اختبار: تطبيق تقنيات الخطافات المتقدمة
التحدي: بناء تطبيق لتدوين الملاحظات باستخدام أدوات متقدمة
الحل: تطبيق لتدوين الملاحظات مع ميزات متقدمة
9.
التزامن لواجهات مستخدم سلسة
المشكلة: واجهات مستخدم بطيئة
خطاف الانتقال الاستخدامي
خطاف استخدام القيمة المؤجلة
الاختيار بين استخدام الانتقال واستخدام القيمة المؤجلة
اختبار: التزامن لواجهات مستخدم سلسة
التحدي: لوحة معلومات الأسهم في الوقت الفعلي
الحل: لوحة معلومات الأسهم في الوقت الفعلي
10.
التعامل مع النماذج في React (المكونات المتحكم بها وغير المتحكم بها)
المشكلة: إدارة مدخلات المستخدم بالطريقة الصعبة
المكونات المتحكم بها في React
إدارة المدخلات المتعددة في React
معالجة عملية تقديم النماذج والتحقق من صحتها
استخدام المراجع للمدخلات غير المتحكم بها
بناء مكون إدخال قابل لإعادة الاستخدام
تحسين إمكانية الوصول إلى النماذج باستخدام خطاف useId
إدارة حالة إرسال النموذج باستخدام خطاف useFormStatus
إدارة حالة النموذج والإجراءات باستخدام خطاف useActionState
بناء ردود فعل فورية باستخدام useOptimistic
اختبار: التعامل مع النماذج في React
التحدي: نموذج تسجيل ديناميكي مع ردود فعل إيجابية
الحل: نموذج تسجيل ديناميكي مع تقييم إيجابي
11.
جلب البيانات وتكامل API
لماذا تفشل طرق جلب البيانات التقليدية؟
جلب البيانات باستخدام React
التعامل مع التحميل والأخطاء بسلاسة
تبسيط عملية جلب البيانات باستخدام Axios
تهيئة مثيلات Axios لإعادة الاستخدام
معالجة الأخطاء العالمية والمعترضات باستخدام Axios
إلغاء الطلبات أثناء الرحلة مع أكسيوس
استعلام React : جعل جلب البيانات تصريحيًا
التخزين المؤقت والتحديثات في الخلفية باستخدام استعلام React
الطفرات وواجهة المستخدم المتفائلة باستخدام استعلام React
اختبار قصير: جلب البيانات وتكامل API
التحدي: تطبيق البحث عن مستخدمي GitHub
الحل: البحث عن مستخدمين GitHub
Mini Project
Premium
لوحة تحكم مدير المهام
12.
تصميم تطبيقات React على نطاق واسع
فهم أنواع الحالة في تطبيقات React القابلة للتوسع
فلسفة ملكية الدولة
تجزئة السياق لتطبيقات React القابلة للتوسع
هياكل المجلدات القائمة على الميزات
نمط مُخفِّض الحالة
مكونات مخفض السرعة ثنائي الوضع
مكون تبديل قائم على المُخفِّض
توسيع سلوك المكونات باستخدام حقن المُخفِّض
المكونات غير الرأسية: منطق بدون واجهة مستخدم
المكونات المركبة: أنماط الطفل التعاونية
دمج الأنماط المعمارية في React
دراسة حالة: إعادة هيكلة ميزة على نطاق واسع
اختبار: تصميم تطبيقات React على نطاق واسع
التحدي: بناء سمة ولوحة إشعارات
الحل: إنشاء سمة ولوحة إشعارات
13.
تحسينات الأداء وآليات العرض في React 19
فهم بنية الألياف
مرحلتا العرض والتثبيت
العرض المتزامن والتجميع التلقائي
تحليل مكونات React
متى ولماذا يفيد الحفظ عن ظهر قلب
مآزق وأنماط الحفظ عن بعد
أساسيات React.memo والمقارنة السطحية
المحددات والتفاعل الدقيق
دراسة حالة: لوحة معلومات الثروة الحيوانية الحية (الجزء 1)
دراسة حالة: لوحة معلومات الثروة الحيوانية الحية (الجزء الثاني)
اختبار: هندسة أداء React 19
التحدي: إعادة هيكلة تطبيق عرض التعليقات البطيء
الحل: تطبيق عرض التعليقات المعاد تصميمه
14.
خاتمة
اختتم رحلتك مع React
Home
Courses
تعلم React 19: الدليل الكامل لتطبيقات الويب الحديثة
اختبار: تطبيق تقنيات الخطافات المتقدمة
اختبر فهمك للخطافات المتقدمة.
سنغطي ما يلي...
...