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 19
تصميم واجهات مستخدم تعتمد على البث المباشر
التحميل الكسول المعماري باستخدام React.lazy
استراتيجيات تقسيم الكود والتحميل المسبق
اختبار: التشويق، والبث المباشر، وتقسيم الشفرة
التحدي: بناء عارض مقالات متدفقة مع تشويق
الحل: إنشاء عارض مقالات متدفقة مع خاصية التشويق
15.
مكونات الخادم (RSC)
لماذا توجد مكونات الخادم
ما هي مكونات الخادم فعلياً
فهم مسار معالجة الصور في RSC
الترطيب وحدود العميل في مركز خدمات إعادة التأهيل
تصميم مكونات لحدود الخادم
الانتقال إلى RSC تدريجيًا
اختبار: مكونات الخادم (RSC)
التحدي: الحفاظ على استقرار الغلاف باستخدام محاكاة RSC المحلية
الحل: الحفاظ على استقرار الغلاف باستخدام محاكاة RSC المحلية
16.
طبقة بيانات متقدمة مع استعلام React
تحليل معمق لذاكرة التخزين المؤقت للاستعلامات في React
الاستعلامات التابعة في استعلام React
الاستعلامات اللانهائية وأنماط الترقيم
الطفرات والتحديثات المتفائلة
الإبطال الانتقائي وإعادة الجلب المشروط
اختبار: طبقة البيانات المتقدمة باستخدام استعلام React
التحدي: لوحة تحكم متزامنة متعددة علامات التبويب
الحل: لوحة تحكم متزامنة متعددة علامات التبويب
17.
استراتيجيات العمل في الوقت الفعلي، والعمل في الخلفية، والعمل دون اتصال بالإنترنت
أنماط البيانات في الوقت الحقيقي
مزامنة الخلفية ونمط التعطل أثناء إعادة التحقق
تقنية Web Workers في React (تفريغ العمليات الثقيلة)
استراتيجيات واجهة المستخدم في وضع عدم الاتصال أولاً
اختبار: استراتيجيات الوقت الفعلي، والعمل في الخلفية، والاستراتيجيات غير المتصلة بالإنترنت
التحدي: لوحة تحكم الدردشة في الوقت الفعلي
الحل: لوحة تحكم الدردشة الفورية
18.
النماذج المعقدة وسير العمل على نطاق واسع
نماذج متعددة الخطوات ونماذج المعالج
نماذج المعاملات باستخدام React 19
التحقق على نطاق واسع: طبقات الحقول، والطبقات غير المتزامنة، وطبقات المخططات
أنماط نماذج سهلة الاستخدام لواجهات مستخدم جاهزة للإنتاج
اختبار: النماذج المعقدة وسير العمل على نطاق واسع
التحدي: نموذج طلب متعدد الخطوات
الحل: نموذج طلب متعدد الخطوات
19.
استراتيجيات اختبار الثقة
أساسيات الاختبار في React
اختبار الخطافات والمنطق غير المتزامن
اختبار حدود الخطأ والتشويق
اختبار إمكانية الوصول باستخدام مكتبة اختبار React
اختبار: استراتيجيات اختبار الثقة
التحدي: اختبار سير عمل نموذج معقد
الحل: اختبار سير عمل نموذج معقد
20.
إمكانية الوصول، والتدويل، وأنظمة التصميم
بنية واجهة مستخدم سهلة الوصول
أنماط التدويل (i18n)
رموز التصميم والقوالب
واجهات برمجة تطبيقات المكونات غير الرأسية
اختبار: إمكانية الوصول، والتدويل، وأنظمة التصميم
التحدي: مكتبة مكونات سهلة الوصول وقابلة للتخصيص
الحل: مكتبة مكونات سهلة الوصول وقابلة للتخصيص
21.
الأمن والأداء والميزانيات والتسليم
الأمن كحدود للعرض في تطبيقات React
ميزانيات الأداء والمراقبة
خطافات مراقبة الأخطاء واستعادتها
أفضل ممارسات النشر
اختبار: الأمن، ميزانيات الأداء، والتسليم
التحدي: تدقيق تحصين الإنتاج
الحل: تدقيق تحصين الإنتاج
22.
خاتمة
اختتم رحلتك مع React
Project
Premium
Build a Product Launch Readiness Board Using React 19
Claim your Certificate
Home
Courses
تعلم React 19: الدليل الكامل لتطبيقات الويب الحديثة
اختبار: استراتيجيات اختبار الثقة
اختبر فهمك لاستراتيجيات الاختبار.
سنغطي ما يلي...
...