Learn ReactJS from scratch

مسار الدليل الشامل لتعلم react من الصفر

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

هذا المسار مخصص لك إذا كنت تريد تعلم React من الصفر

جاري تحميل السعر ...
تشغيل الفيديو

المعرفة المُسبقة

يجب أن يكون لديك خبرة مسبقة وفهم جيد لأساسيات HTML وCSS وJavaScript للتسجيل في هذا المسار.

المهارات المكتسبة

React component state, React Router, React hooks, JSX, Test, Context API, Fetch API’s

الوقت المقدر

من شهر إلى شهرين
بواقع 5 ساعات أسبوعيًا تقريبًا

Vector

ماذا ستتعلم في هذا المسار؟

ستتعلم في هذا المسار معظم المهارات الهامة التي تحتاجها لإتقان مكتبة ريأكت وبناء مواقع وتطبيقات ويب احترافية من بيئة العمل الواقعية. ستبدأ بدورة React Fundamentals، حيث ستتعرف على مفاهيم ريأكت الأساسية، مثل components وغيرها، ثم سنتدرج معًا لتتعلم مواضيع أكثر تقدمًا مثل الصفحات المتعددة، واستخدام تقنيات تطوير وتحسينات الأداء، وغيرهم الكثير، وستطبق كل ما تعلمته في مشروع عملي يتضمن بناء تطبيق لمتابعة السعرات الحرارية (calorie tracker)، وننهي المسار بدورة تطبيقية كاملة ستبني فيها بنفسك 3 مشاريع احترافية تستطيع إضافتها لمعرض أعمالك (Portfolio)؛ مما يُكسبك خبرة عملية ويعزز فهمك لمكتبة React؛ ويساعدك على المنافسة في سوق العمل بين باقي المبرمجين.

  • دورة أساسيات React

هذه الدورة مثالية لمطوري الفرونت اند الذين يتطلعون إلى تحسين مهاراتهم وتعلم تقنيات جديدة تساعدهم في بناء تطبيقات ومواقع احترافية. ستكتسب خلال هذه الدورة فهمًا عميقًا لأساسيات ReactJS مثل الـ Components، وهي الوحدة الأساسية المكونة لعناصر ريأكت، وState management، وConditional statements، وDynamic Styling وغيرهم الكثير من مهارات ريأكت الأساسية.

ستقوم في هذا المشروع بتطبيق كل ما تعلمته في دورة أساسيات ريأكت لعمل تطبيق احترافي يتعقب عدد السعرات الحرارية لما تأكله من وجبات يوميًا.

دورة أساسيات مكتبة ريأكت
  • دورة React Deep Dive

سنكمل في هذه الدورة على ما بدأناه في الدورة الأولى لتنتقل إلى مستوى أكثر تقدمًا وتبني بنفسك تطبيقات متقدمة وأكثر تعقيدًا؛ حيث ستتعلم وتطبق على مفاهيم ومصطلحات جديدة في ريكأت مثل Multi pages، و Error handling، وRouting، وPerformance optimization techniques وAPI calls وغيرهم الكثير. هذا بجانب تطبيق كل هذه المفاهيم الجديدة على التطبيق الذي بدأناه في الدورة الأولى؛ مما يُعدك للمنافسة في سوق العمل البرمجي.

دورة React Deep Dive
  • دورة مشاريع React

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

ستقوم في هذا المشروع بتطوير تطبيق موجز أخبار ديناميكي يعرض الأخبار الرائجة عبر فئات مختلفة. ستستخدم واجهات برمجة التطبيقات الخارجية 3rd party API، مميزات الترقيم والتصفية (pagination and filtering). كل هذا من خلال مراعاة التصميم المتجاوب (Responsive Design) واستخدام أفضل ممارسات تجربة المستخدم (UX) لإنشاء واجهة تطبيق سهلة الاستخدام.

ستقوم في هذا المشروع بتحدي مهاراتك في لغة جافا سكريبت ومكتبة ريأكت لتبني بنفسك موقع ويب ديناميكي يعرض معلومات عن دول مختلفة حول العالم، مع إمكانية بحث المستخدم عن الدول وفلترتها حسب المنطقة أو القارة للوصول إلى دول محددة، وأيضًا الضغط على الدولة لرؤية المزيد من المعلومات التفصيلية عنها في صفحة منفصلة. ستقوم أيضًا بتنفيذ color theme switcher يسمح للمستخدمين باختيار نمطهم المفضل، بجانب دمج واجهة برمجة التطبيقات (API)، وتصميم واجهة مستخدم متجاوبة (Responsive design) وأيضًا استخدام أدوات مهمة مثل Tailwind وreact router وreact-select وeslint وvite وغيرهم.

دورة مشاريع مكتبة ريأكت

تشمل جميع مساراتنا:

تطبيق عملي على مشاريع حقيقية

طبق ما تتعلمه في الدورات المختلفة في إنشاء مشاريع تُحاكي العالم الواقعي؛ لتكتسب خبرة قيمة تُميزك عن الآخرين.

التوجيه والدعم الأكاديمي والتقني

ستتلقى دعمًا فرديًا من الموجهين (Mentors) ذوي الخبرة، والذين يتواجدون باستمرار لتقديم التوجيه والدعم، وتحفيزك، والإجابة على أسئلتك.

الاتصال المباشر مع المحاضر

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

شهادة إتمام

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

ما الذي يميز هذا المسار؟

محاضرون وخبراء يعلمون بالعربية

مراجعة مخصصة لمشاريعك

لقاءات أونلاين مع مشرفي الدورات

التعليم الترفيهي

اختبارات تفاعلية وتحديات

0
+
طالب
0
+
ساعة دراسية
0
+
منحة
0
+
مشروع

تعلم من الأفضل

مهندس محمد أبو سريع

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

Staff Frontend Engineer at Yassir & Chief media officer of Almdrasa

مهندس برمجيات ذو خبرة أكثر من 10 سنوات في كبرى شركات البرمجيات الرائدة في المنطقة العربية وأوروبا. 

يتمتع بخبرة واسعة في تطوير واجهات المستخدم الأمامية، إلى جانب خبرته كمحاضر في الجامعات المصرية. 

عمل مع إحدى أشهر شركات التجارة الإلكترونية في الشرق الأوسط، وهي Landmark Group والتي تضم العديد من العلامات التجارية الرائدة مثل Splash وMother care وMax Fashion  وغيرهم.

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

مهندس أحمد علي

م. أحمد علي

Software Engineer at Amazon & curriculum development supervisor of Almdrasa

خبرة أكثر من 10 سنوات في إدارة فرق تطوير البرمجيات لعدة شركات عالمية مثل مايكروسوفت وجوجل وميتا وأمازون. قاد فريق واجهة المستخدم وكذلك فريق الواجهة الخلفية لتطوير منتج data pipelines في GCP، كما وعمل على إنشاء الإصدار الأول وكذلك قيادة فريق الإصدار الثاني لواجهة المستخدم لتطوير منتج GCP Recommendations AI والذي يستخدم حاليًا من قبل شركات . عالمية مثل Ikea.

قاد عملية بناء وإضافة ميزات وخصائص حيوية في Meta Business Suite التابع لفيسبوك، بجانب خبرته في التدريس الأكاديمي في الجامعات وعمله كمعيد لمدة سنتين، بالإضافة أيضًا لعمله  كموجه ومرشد (Mentor) في شركتي جوجل وميتا.

اسمع من طلاب المدرسة

كورس تطبيقي من البداية وده  شئ رائع وأعلى من توقعاتي

أيمن متولي

الأسلوب مبسط لتوصيل المعلومة خصوصًا لما تكون لشخص مبتدأ بجد أسلوب رائع جزاك الله خيرا

الحمزة

من المميز في دورات المدرسة عامة أنها تهتم بالدخول في الجانب العملي التطبيقي مباشرة بأسلوب سلس وممتع

إبراهيم عبد العزيز

الكورس ده لو شفته في بداية تعلمي للغة CSS كان فرق معايا جدا وكان وفر عليا وقت ومجهود كبير جدا

محمود محمد

اكتر حاجة بتعجبني هي الامثله .. بتسهل المعلومة اكتر وتثبتها وطبعا التحديات والاختبارات

شادي صبحي

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

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

  • دورات تشرح كل مفهوم بشكل واضح وبسيط
  • تمارين تفاعلية ومشاريع عملية تساعدك على تطبيق ما تعلمته
  • شهادات إنجاز تثبت مهاراتك وتزيد من قيمة سيرتك الذاتية
  • دعم فني وإرشاد من قبل مدربين محترفين ومجتمع نشط من المتعلمين

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

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

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

نحن نستخدم الأدوات والبرامج المجانية والمستخدمة على نطاق واسع مثل VS Code، والتي يمكن الوصول إليها على معظم الأجهزة وأنظمة التشغيل. كل ما تحتاجه هو جهاز حاسوب واتصال بالإنترنت.

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

Learn ReactJS from scratch

مسار الدليل الشامل لتعلم React

لديك استفسار؟

نرحب بكافة استفساراتكم ويسعدنا خدمتكم والعمل على توفير بيئة تعليمية سهلة ومتطورة.

اشترك بقائمتنا البريدية

ابق على اطلاع بكل جديد