React with TypeScript

تعلم React مع TypeScript لبناء تطبيقات ويب متقدمة

هل تعلم أن آلاف الفرص الوظيفية اليوم تتطلب إتقان مكتبة React؟ وهل تعلم أن React تُعد من ضمن الاختيارات الأولى لتنفيذ مشروعك عند طلبك تنفيذ أي Website من الذكاء الاصطناعي (AI)؟

سعر الدورة $29
اشترك الآن
تصفح المنهج
  • +500طالب
  • 94درس
  • 11قسم
  • 17اختبار
  • متوسطالمستوى
عن الدورة

تعرّف على الدورة

هل تعلم أن آلاف الفرص الوظيفية اليوم تتطلب إتقان مكتبة React؟ وهل تعلم أن React تُعد من ضمن الاختيارات الأولى لتنفيذ مشروعك عند طلبك تنفيذ أي Website من الذكاء الاصطناعي (AI)؟

ReacJS ليست فقط مكتبة لواجهات المستخدم، بل هي قلب تطوير الويب الحديث، والشركات اليوم تبحث عن مطورين يجمعون بين قوة React ودقة TypeScript.

في هذه الدورة الاحترافية والمتقدمة، ستتعلم كيفية تطوير واجهات مستخدم تفاعلية باستخدام مكتبة React.js الأشهر في العالم والمدعومة من شركة Meta، بالإضافة إلى كيفية إعداد لغة TypeScript داخل مشروع React لكتابة كود secure, clear, maintainable.

لماذا تختار دورة React with TypeScript؟

  • دمج أقوى تقنيتين في تطوير الواجهات: React و TypeScript هما الخيار المثالي لبناء تطبيقات حديثة وقابلة للتوسع.
  • محتوى تطبيقي: جميع المفاهيم مدعومة بمشاريع تطبيقية تحاكي احتياجات سوق العمل.
    فرص وظيفية متزايدة: دمج React مع TypeScript يزيد من فرصك للحصول على وظائف عالية المستوى محليًا وعالميًا.
  • وصول مدى الحياة: يمكنك الوصول إلى الدورة ومراجعة محتواها فيديوهات/ملخصات/امتحانات في أي وقت ومدى الحياة.
  • محاضر خبير: الدورة من إعداد وتقديم محمد أبوسريع، مهندس برمجيات ذو خبرة واسعة لأكثر من 12 عام، وعمل في عدة شركات عالمية في أوروبا والخليج.

اشترك الآن واحترف مكتبة ReactJS الأشهر في العالم

تشمل الدورة

  • شهادة موثقة
  • قياس مستوى التقدم والانجاز عبر الدورة
  • إجابة من مشرفي الطلاب على كل الأسئلة
  • فاعليات حصرية
  • شارات تميز للطلبة المتقدمين
  • اشعارات تذكير وتحفيز لإنهاء الدورة
  • اشتراك مدى الحياة
سعر الدورة $29
اشترك الآن

دفع آمن ووصول فوري للدورة

منهج الدورة

ماذا ستتعلم خطوة بخطوة

اضغط على أي قسم لعرض دروسه. الدروس المجانية متاحة للمشاهدة قبل الاشتراك.

محتوى الدورة

  1. 1
    Introduction
  2. 2
    Course Materials
  3. 3
    React Fundamentals12 درسًا · 4 اختبارات
    1. Tools We Will Use
    2. Why React?
    3. مختصر كتابي: ?Why React
    4. اختبار قصير: ?Why React
    5. Library vs Framework
    6. مختصر كتابي: Library VS Framework
    7. اختبار قصير: Library VS Framework
    8. Declarative vs Imperative
    9. مختصر كتابي: Declarative VS Imperative
    10. Virtual DOM
    11. مختصر كتابي: Virtual Dom
    12. اختبار قصير: Virtual Dom
    13. Development Setup with Vite
    14. Public vs Assets Folder
    15. React DevTools
    16. اختبار القسم: React Fundamentals
  4. 4
    Component Fundamentals12 درسًا · 5 اختبارات
    1. Introduction to JSX
    2. JSX vs HTML
    3. مختصر كتابي: JSX VS HTML
    4. اختبار قصير: JSX VS HTML
    5. Component Fundamentals
    6. Props
    7. مختصر كتابي: Props
    8. اختبار قصير: Props
    9. Conditional Rendering
    10. React Keys
    11. مختصر كتابي: React keys
    12. اختبار قصير: React keys
    13. Event Handlers
    14. مختصر كتابي: Event handlers
    15. اختبار قصير: Event handlers
    16. React Anti-Patterns
    17. اختبار القسم: Component Fundamentals
  5. 5
    State and Data Flow11 درسًا · 3 اختبارات
    1. Understanding State
    2. مختصر كتابي: Understanding State
    3. Rendering and Commit
    4. مختصر كتابي: Rendering and commit
    5. اختبار قصير: Rendering and commit
    6. State Is a Snapshot
    7. مختصر كتابي: State is a snapshot
    8. اختبار قصير: State is a snapshot
    9. Update Snapshots Properly
    10. More About State
    11. State Objects and Arrays – Part 1
    12. State Objects and Arrays – Part 2
    13. State Objects and Arrays – Part 3
    14. اختبار القسم: State and Data Flow
  6. 6
    Hooks14 درسًا · 5 اختبارات
    1. Introduction to Hooks
    2. مختصر كتابي: Intro to Hooks
    3. useContext (Props Drilling)
    4. Hooks
    5. اختبار قصير: useContext (props drilling)
    6. useContext (Implementation)
    7. useRef (TextInput Example)
    8. مختصر كتابي: useRef (TextInput Example)
    9. اختبار قصير: useRef (TextInput Example)
    10. useRef (ScrollableBox Example)
    11. useEffect (Window Size Example)
    12. Hooks
    13. اختبار قصير: useEffect (Window Size Example)
    14. useEffect (Timer Example)
    15. Custom Hook (Note Editor Example)
    16. مختصر كتابي: CustomHook (Note Editor Example)
    17. اختبار قصير: CustomHook (Note Editor Example)
    18. Custom Hook (OnlineStatus Example)
    19. اختبار القسم: Hooks
  7. 7
    Performance7 دروس · 2 اختباران
    1. React.memo
    2. مختصر كتابي: React Memo
    3. اختبار قصير: React Memo
    4. useMemo
    5. مختصر كتابي: useMemo
    6. useCallback
    7. مختصر كتابي: useCallback
    8. Connect All Components
    9. اختبار القسم: Performance
  8. 8
    Testing20 درسًا · 3 اختبارات
    1. Introduction to Testing
    2. مختصر كتابي: Introduction to Testing
    3. اختبار قصير: Introduction to Testing
    4. Overview of Testing Tools
    5. Setting Up the Testing Environment
    6. Test Suites, Test Cases and Assertions
    7. مختصر كتابي: Test suites, Test Cases and Assertions
    8. اختبار قصير: Test suites, Test Cases and Assertions
    9. Vitest Extension
    10. Testing React Components
    11. Selectors
    12. Challenge 1
    13. Take a Snapshot of a Component
    14. مختصر كتابي: Take a Snapshot of a component
    15. Better Assertions with Jest-Dom
    16. User Events – Part 1
    17. User Events – Part 2
    18. Challenge 2
    19. Testing Forms – Part 1
    20. Testing Forms – Part 2
    21. Challenge 3
    22. Testing APIs
    23. اختبار القسم: Testing
  9. 9
    React with TypeScript12 درسًا · 2 اختباران
    1. Setting Up TypeScript in React
    2. مختصر كتابي: Setting Up TypeScript in React
    3. اختبار قصير: Setting Up TypeScript in React
    4. Simple Props
    5. مختصر كتابي: Simple props
    6. Complex Props
    7. Simple State
    8. مختصر كتابي: Simple state
    9. Complex State
    10. Event Handlers
    11. useRef
    12. Custom Hooks
    13. useMemo and API Calls
    14. اختبار القسم: React with TypeScript
  10. 10
    Conclusion
  1. الاختبار النهائي
    1. الاختبار النهائي
المعلم

تعلّم على يد م. محمد أبو سريع

  • م. محمد أبو سريع
    م. محمد أبو سريع

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

آراء الطلاب

ماذا قال الطلاب عن الدورة

التقييمات والمراجعات

4.7
متوسط التقييمات
3 عدد التقييمات
5
2
4
1
3
0
2
0
1
0
كيف كانت تجربتك؟ نود أن نعرف!
Mohamed Nasser Abdalla
تم النشر قبل 5 أشهر
دورة مميزة جمعت بين React و TypeScript بشكل احترافي

الكورس وضح لي مفاهيم React بطريقة سهلة وعملية، وقدرت اطبق كل شيء مباشرة. دمج TypeScript مع React كان خطوة مهمة خلت الكود اوضح واقوى.

يوسف بدر
تم النشر قبل سنة واحدة
تجربتي مع الدورة...

المحتوى العلمي - شرح React متكامل ومنظم جدًا. - تم التطرق لموضوع Testing ودي إضافة عملية مهمة جدًا لأي مطور. التطبيق العملي - ركزت على دمج React + TS لبناء مشاريع عملية. - وفرت أمثلة عملية لاستخدام الـ Testing مع المكونات. - مناسبة لفهم استخدام TS مع React، لكنها لا تكفي لتعلم TS بعمق. سوق العمل - الجمع بين React + TS ميزة قوية جدًا ومطلوبة. - وجود Testing في الدورة بيديك ميزة إضافية لأن الشركات بتركز عليه. - الدورة بتجهزك كبداية قوية، لكن التعلم المتقدم لـ TypeScript محتاج مصادر إضافية. الخلاصة: دورة React with TypeScript ممتازة لو عايز تتعلم React مع فكرة عن TypeScript، وكمان ضافتلك قيمة كبيرة بموضوع Testing. حاجة حلوة في المهندس محمد أبوسريع -جزاه الله خيرًا- إنه مش بيكتفي بالشرح النظري، لكن كمان بيشارك تجارب عملية حقيقية عن سوق العمل وكيف الشركات والفرق شغالة، فالدورة تحسسك بالواقع المهني. عدم التعمق في TypeScript طبيعي لأنه الدورة مركزة على React، لكنها كويسة لفهم دمج TS مع React وعمل مشاريع، وللوصول للاحتراف في TS محتاج تكمل بمصادر تانية. ✨ شكر كبير لكل فريق العمل على جودة المحتوى والأنيميشن الرائعين، اللي خلوا الدورة ممتعة وواقعية.

Ahmed Fathy
تم النشر قبل سنة واحدة
⭐⭐⭐⭐⭐

استفدت جدا من الدورة محتوى منظم وشرح فوق الممتاز

لديك سؤال؟

الأسئلة الشائعة

  • مطوري الواجهات الأمامية (Frontend developers) الذين يرغبون في الانتقال إلى مستوى احترافي في بناء تطبيقات ومواقع الويب باستخدام React و TypeScript.
  • المبرمجين الراغبين في تعلم بناء تطبيقات قوية باستخدام أدوات حديثة، والاستعداد مستقبلًا لتعلم Next.JS لأنها امتداد لـ ReactJS.
  • مطوروالواجهات الخلفية (Backend developers) الذين يرغبون في التعلم والتطور ليصبحوا (Full stack developers).

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

 React مكتبة لواجهة المستخدم، بينما TypeScript هي لغة برمجة تعتمد على JavaScript وتُستخدم لكتابة كود منظم وقابل للصيانة.

نعم، يُفضل يكون عندك معرفة بأساسيات JavaScript قبل دخول هذه الدورة لتحقيق أفضل استفادة، وننصح بمسار تعلم جافا سكريبت من الصفر.

ابدأ تعلم React مع TypeScript لبناء تطبيقات ويب متقدمة اليوم

اشتراك مدى الحياة، شهادة إتمام، ودعم من فريق المدرسة طوال رحلتك.

اشترك الآن
تصفح المنهج