تعلم React يمكن أن يكون تحديًا في البداية، خاصةً عندما تكون غير متأكد من كيفية البدء أو تجد نفسك تحدق في محرر الشفرة الفارغ. ولكن الدورة الصحيحة يمكنها مساعدتك على فهم المفاهيم الأساسية ومساعدتك على اكتساب الخبرة العملية من خلال بناء مشاريع حقيقية.

لقد قمنا للتو بنشر دورة على قناة YouTube الخاصة بـ freeCodeCamp.org تعلمك React الحديث بأكثر الطرق تشويقًا وعملية. تم إنشاء هذه الدورة بواسطة بوب زايرويل من Scrimba، وهي مليئة بأكثر من 170 تحديًا برمجيًا وستة مشاريع مثيرة. بحلول النهاية، ستكون لديك المهارات والثقة لتطوير تطبيقات React التي تحل مشاكل الحياة الواقعية. كانت الدورة السابقة لبوب حول React واحدة من أشهر الطرق لتعلم React وقام بتحديث هذه الدورة بالكامل لتعليم جميع المفاهيم الجديدة في React.

ما ستتعلمه في هذه الدورة

تم تقسيم الدورة إلى ستة أقسام شاملة، تبدأ من الأساسيات وتتقدم تدريجيًا إلى مفاهيم أكثر تعقيدًا:

  1. الأساسيات في React
    انغمس في أسس React، بما في ذلك JSX، العناصر، الخصائص، الحالة، ومبادئ التصميم الواضح والقابل للتكوين في React. مشروعك الأول، ReactFacts، هو مقدمة بسيطة وممتعة لبناء العناصر الوظيفية وتطبيق الأنماط.

  2. مشروع يوميات السفر
    تعلم كيفية إنشاء مكونات قابلة لإعادة الاستخدام والعمل مع الخصائص. ستستخدم وظيفة .map() في JavaScript لعرض يوميات السفر بشكل ديناميكي، مما يجعلها وظيفية وجذابة بصريًا.

  3. مشروع الشيف كلود
    استكشاف إدارة الحالة والنماذج أثناء بناء تطبيق الوصفات. ستمارس التعامل مع الأحداث، والعرض الشرطي، وإدارة الحالات المعقدة باستخدام مصفوفات وكائنات. بحلول نهاية هذا القسم، ستكون لديك فهم عميق لكيفية التعامل مع تفاعلات المستخدم في React.

  4. مشروع مولد النكت
    جلب البيانات من واجهات برمجة التطبيقات واستخدام خطافات React useState و useEffect. ستقوم بإنشاء مولد نكت يحمل ويُخصص الصور النكتية ديناميكيًا، مما يمنحك تجربة في جلب البيانات واستخدام المكونات المتحكمة.

  5. لعبة تنزيز
    قم ببناء لعبة رمي النرد التي تتيح للمستخدمين رمي واحتجاز ومطابقة النرد للفوز. هذا المشروع رائع لممارسة تنسيق المكونات، المنطق الشرطي، وميكانيكا الألعاب في React.

  6. مشروع نهاية الجمعية
    انهاء الدورة بلعبة تخمين كلمات تتحدي قدرتك على التخطيط وتنفيذ ميزات متقدمة أكثر، بما في ذلك تحسينات الوصولية، مشاركة الحالة، ومكونات واجهة المستخدم التفاعلية.

تنتهي الدورة بنصائح وأدوات لتعزيز بيئة تطويرك، بما في ذلك إضافات VS Code وأدوات مطور React التي تبسط عمليات تصحيح الأخطاء وتزيد من الإنتاجية.

الختام

مستعد لاتخاذ خطوتك الأولى في عالم React الحديث؟ تفضل بزيارة الدورة على قناة يوتيوب freeCodeCamp.org (مدتها 16 ساعة).