أساسيات React
من الصفر إلى نشر واجهات تفاعلية حقيقية باستخدام React 19.
- 4.8 (1,284 تقييمًا)
- 12,400 متعلّم
- مبتدئ
- 5 س 20 د إجمالًا
- حُدّثت في يونيو 2026
ما ستتعلّمه
- بناء واجهات تفاعلية باستخدام الـ components والـ props والـ state
- تجهيز بيئة عمل حديثة بـ React 19 وVite من الصفر
- التعامل بثقة مع الأحداث والنماذج والـ controlled inputs
- إدارة الآثار الجانبية باستخدام useEffect بالطريقة الصحيحة
- تركيب شاشات معقّدة من قطع صغيرة قابلة للاختبار
- نشر مشروع مكتمل على Vercel في بيئة الإنتاج
لمن هذه الدورة
React هي الطريقة التي تبني بها أغلب فرق المنتجات واجهاتها اليوم، وأساسياتها لم تكن يومًا أصغر ولا أوضح مما هي عليه الآن. تبدأ من مجلد فارغ، وتجهّز React 19 مع Vite، ثم تتعلّم الأفكار القليلة التي تؤدي معظم العمل: الـ components والـ props والـ state والأحداث والـ effects. كل درس ينتهي بشيء تبنيه وتشغّله في المتصفّح بنفسك.
الدورة كلها تبني تطبيقًا حقيقيًا واحدًا: Watchlist للأفلام التي تنوي مشاهدتها. تضيف العناوين من خلال نموذج، وتعلّم ما شاهدته، وتصفّي القائمة، وتحفظها في localStorage حتى تبقى بعد تحديث الصفحة. وفي القسم الأخير تنسّقها باستخدام Tailwind CSS v4، وتنشرها على Vercel، وتخرج برابط حيّ وخطة واضحة لما تتعلّمه بعد ذلك.
- لمن هذه الدورة
- المتحوّلون إلى البرمجة والمطوّرون المبتدئون الذين يعرفون شيئًا من HTML وCSS وJavaScript ويريدون بناء واجهات حقيقية باستخدام React.
- قبل أن تبدأ
- أساسيات JavaScript بثقة: المتغيّرات والدوال والمصفوفات والكائنات والـ arrow functions ودوال المصفوفات مثل map وfilter.
تدريب عملي
- تمارين موجَّهة: اكتشف الخطأ، وأكمل الأمر، ورتّب الخطوات.
- ابنِ مكوّنات React في بيئة تجريب حيّة، والفحوص تعمل أثناء كتابتك.
- اكتب JavaScript وشغّله في بيئة معزولة مع فحوص تلقائية.
محتوى الدورة
4 وحدات · 18 درسًا · 5 س 20 د إجمالًا
- لماذا React في 20269 دقائق
- تجهيز المشروع باستخدام Vite14 دقيقة
- أول component لك18 دقيقة
- قواعد JSX الأساسية17 دقيقة
- اختبار الوحدة5 أسئلة
- التفكير بالـ components16 دقيقة
- الـ props بالتفصيل21 دقيقة
- أنماط التركيب (Composition)19 دقيقة
- العرض الشرطي14 دقيقة
- عرض القوائم باستخدام الـ keys22 دقيقة
- اختبار الوحدة5 أسئلة
- أساسيات useState20 دقيقة
- التعامل مع الأحداث15 دقيقة
- النماذج والـ controlled inputs24 دقيقة
- رفع الـ state للأعلى18 دقيقة
- أساسيات useEffect19 دقيقة
- اختبار الوحدة5 أسئلة
- بناء تطبيق Watchlist26 دقيقة
- التنسيق باستخدام Tailwind17 دقيقة
- النشر على Vercel12 دقيقة
- إلى أين بعد ذلك19 دقيقة
- اختبار الوحدة5 أسئلة
مدرّبك
مايا تشين
مهندسة واجهات أمامية أولى · Verse
- تقييم المدرّب 4.7
- 38,400 متعلّم
- 3 دورات
أمضت مايا تسع سنوات في بناء واجهات يستخدمها الناس كل يوم، وآخرها محرّر المستندات في Verse، حيث يتحوّل أي بطء في الكتابة إلى بلاغ عن خطأ خلال ساعة. تعلّمت JavaScript قبل أن تصبح أطر العمل هي القاعدة، وانتقلت إلى React عام 2016، ثم إلى React Native حين أطلقت Verse تطبيقها للجوال.
ماذا يقول المتعلّمون
4.8
1,284 تقييم
Alicia Grant
قبل شهرين
حاولت تعلّم React مرتين من قبل وتوقفت في المرتين. الإيقاع هنا هو ما جعل فكرة الـ components تتّضح لي أخيرًا.
Tom Nakamura
قبل 4 أشهر
دروس قصيرة، ومشروع حقيقي، ولا حشو على الإطلاق. أنهيتها في أسبوعين من استراحات الغداء.
Fatima El-Sayed
قبل 3 أشهر
أساسيات ممتازة. كنت أتمنى قسمًا أعمق عن الحالات الخاصة في useEffect، لكنها بداية رائعة.
