لماذا يجب أن تتعلم ReactJS وأفضل 12 مصدرًا لتتعلمه منها

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

ما هو ReactJS؟

ReactJS هي مكتبة جافا سكريبت مفتوحة المصدر لإنشاء واجهات مستخدم (UI). تم تطويره في البداية بواسطة Facebook ويتم صيانته الآن من قبل جميع المساهمين مفتوحين المصدر ، بما في ذلك FB.

كيف يعمل ReactJS؟

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

تم تطويره مع مراعاة السرعة

Facebook هو موقع ديناميكي ، ولتحميل محتوى جديد ؛ ليس من المجدي عرض DOM بالكامل بشكل متكرر لإجراء تغييرات صغيرة على صفحة الويب حيث سيؤدي ذلك إلى إبطاء موقع الويب بأكمله. يعالج React هذه المشكلة بطريقة فريدة ؛ يحتفظ بـ “DOM الظاهري” ، وهو نسخة من DOM الفعلي الذي يتم عرضه للمستخدم.

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

الطريقة الجديدة

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

من ناحية أخرى ، تقوم تطبيقات الصفحة الواحدة بتحميل صفحة الويب (HTML و CSS و JS) مرة واحدة فقط ، وأي تفاعل إضافي مع التطبيق لا يؤدي إلا إلى تحميل البيانات المطلوبة أو تنفيذ إجراء على الخادم. لا يؤدي هذا مطلقًا إلى إعادة تحميل التطبيق بالكامل مما يجعله أخف وزناً في نهاية الخادم وكذلك أسرع.

Gmail و Facebook و Twitter كلها أمثلة على SPA.

مشهد تطوير الويب

لقد قطعنا شوطا طويلا في التنمية.

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

  إصلاح اتصال سطح المكتب البعيد حدث خطأ داخلي

واجهات برمجة التطبيقات للإنقاذ

واجهة برمجة التطبيقات (API) هي جزء من التعليمات البرمجية التي تحدد طريقة لمكونات مختلفة من الكود للتفاعل مع بعضها البعض. يمكن أن يمتلك أي شخص هذه الرموز ويمكن أن تكون في أي مكان. إنها طريقة رائعة للفصل بين وظائف الكود وقابليته للاستخدام. تسمح واجهات برمجة التطبيقات للمبرمج بإنشاء / تحديث / قراءة / حذف البيانات (CURD) دون الحاجة إلى فهم الطريقة التي يتم بها تنفيذ هذه العمليات بواسطة الخادم.

أصبحت واجهات برمجة التطبيقات (API) هي الطريقة الأكثر شيوعًا التي تتواصل بها تطبيقات الواجهة الأمامية الآن مع الخادم وتتبادل البيانات. تستفيد React من واجهات برمجة التطبيقات على أكمل وجه ، وتتم معظم التفاعلات مع العالم الخارجي باستخدام واجهات برمجة التطبيقات ، وبالتالي فهي تساعد حقًا في فصل كود الواجهة الأمامية عن الواجهة الخلفية.

صعود Node.js

كما لخصت تماما على ويكيبيديا، “Node.js هي بيئة تشغيل جافا سكريبت مفتوحة المصدر ومتعددة الأنظمة الأساسية تقوم بتنفيذ كود جافا سكريبت خارج متصفح الويب.”

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

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

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

دع البيانات تتحدث عن نفسها.

الآن دعونا نلقي نظرة على ما يقوله الآلاف من المطورين حول خياراتهم المهنية التالية. أجرت Hackerrank استبيانًا استجاب فيه 116000 مطور. فيما يلي الأفكار ذات الصلة من أبلغ عن.

يجب أن تعرف اللغة

Javascript ، وهي اللغة المستخدمة لتطوير الواجهة الأمامية وكذلك React ، هي أفضل لغة معروفة بين المطورين وأصبحت شائعة بشكل متزايد منذ عام 2018.

أنت في الطلب

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

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

رد فعل تجاوز AngularJS

تتزايد شعبية React عامًا بعد عام ومن المتوقع أن تتولى زمام الأمور أنجولار جي إس هكذا. سهولة التعلم والمزايا التقنية التي تقدمها هي الأسباب الكامنة وراء هذا الاتجاه.

  كيفية إلغاء اشتراك eharmony

الجميع يتعلم React.

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

من أين أتعلمها؟

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

كود مع مش

يعد أسلوب موش في التدريس من أفضل الأساليب المتوفرة. إنه يفهم المشكلات التي قد يواجهها الطالب بالضبط ويعلمها في مقاطع الفيديو. إنه متمرس للغاية ، وجميع دوراته جيدة الإعداد. يتمتع بخبرة تزيد عن 20 عامًا في البرمجة ، فهو مدرس رائع.

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

الدليل الكامل

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

تخصص رد الفعل

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

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

النانو

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

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

للمبتدئين

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

تأخذك سلسلة البرامج التعليمية هذه من Viswash عبر React من الأساسي جدًا. إنه برنامج تعليمي جيد للمبتدئين ، وبعد ذلك يمكنهم التقدم إلى الدورات المتوسطة.

رد فعل للمبتدئين

Reactforbeginners.com يقوم بإنشاء تطبيق ويب كامل من البداية أثناء تدريس هذه الدورة. يعلمك أيضًا كيفية نشر التطبيق على Netlify.

  كيفية إنشاء نص عشوائي في Word

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

تطوير المكدس الكامل

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

يستخدم البرنامج أيضًا قاعدة بيانات غير علائقية تسمى MongoDB في الخلفية.

freeCodeCamp

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

أفضل جزء هو أنه يمكنك أخيرًا استخدام مهاراتك المكتسبة حديثًا ومساعدة مؤسسة خيرية في بناء موقعها والمساعدة في دعم قضية جيدة.

الترميز لرجال الأعمال

إذا كنت شخصًا يتطلع فقط للبدء وبناء شيء ما باستخدام React ASAP ، فيمكنك البدء بمشروع من خلال codingforentrepreneurs.com. قد لا يغطي المشروع جميع الأساسيات ولكنه سيعلمك ما يكفي للبدء والتعلم من خلال بناء المشاريع.

الخلاف

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

خلاف آخر مخصص بالكامل لـ React هو رياكتيفلوكس.

رديت

تحتوي الصفحة الأولى للإنترنت أيضًا على صفحة أمامية لـ ReactJS. ستجد هنا جميع أنواع الأشياء الرائعة التي يستخدمها الأشخاص باستخدام React. يوفر لك طريقة للنظر في مشاريع من مستخدمين آخرين وأيضًا نشر مشاريعك وأسئلتك.

توثيق

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