تعلم React Native

كيف أصبح مطور React Native لكي أستطيع تطوير تطبيقات الموبايل بلغة البرمجة جافاسكريبت ؟ هذا السؤال وصلني مرات عديدة من متابعي وقراء المدونة، ولعل جميع من طرحوا علي هذا السؤال قرؤوا مقالنا الذي عرفنا فيه بهذه التقنية الجديدة والتي باتت لاعبا مهما في ميدان صناعة تطبيقات الهواتف الذكية.

ولكي أجيب على هذا السؤال المهم، سأحاول أن أعرض عليك، صديقي، أبرز الخطوات التي يجب اتباعها لتصبح مطور تطبيقات الهواتف الذكية بواسطة React Native.

1. تعلم جافاسكريبت

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

ربما سمعت في السنتين الأخيرتين عن ES 2015 أو ES6، المصطلحين مترادفين ويقصد بهما النسخة الكبيرة والجديدة لجافاسكريبت. هذا الإصدار حمل معه تحسينات بالجملة ل JavaScript كي يصبح الأخير لغة أكثر حداثة وعصرية.

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

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

دورات مقترحة لتعلم جافاسكريبت على يوتيوب :

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

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

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

2. تعلم React.js

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

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

إطار العمل React Native يعتمد على React.js بشكل مباشر، وطريقة كتابة الأكواد في مشاريعه تشبه بشكل شبه كامل طريقة كتابتها في مشاريع React.js، وبالتالي فتعلم الأخير سيسهل بشكل مثالي دخولك لعالم برمجة تطبيقات الموبايل بواسطة React Native.

يمكن اعتبار الموقع الرسمي لمكتبة React.js مكانا جيدا لتعلم أساسياتها وفكرتها العامة، ثم تبحث بعد ذلك عن دورات على اليوتيوب أو يوديمي وأمثاله (إذا كنت مستعدا لاستثمار قليل من المال) للتعمق أكثر والإنتقال لمستويات أعلى من الفهم والإستيعاب.

بحثت على اليوتيوب ولم أجد سوى دورة عربية واحدة لقناة بغداد الجديدة، يمكنك البدء بها حالما تنتهي من الإطلاع على التوثيق من الموقع الوسمي.

3. تعلم React Native

بما أنت أصبحت قادرا على التعامل بارتياح مع React.js فأنت بالضرورة تستطيع فعل ذلك مع React Native، فهما يتشاركان نفس الفلسفة و لا يوجد أي اختلاف يذكر بينهما سوى في بعض التفاصيل الصغيرة. مثلا في React لا يمكنك استخدام الوسوم p ،div وغيرها، وتستخدم عوضا عنها مكونات (Components) جديدة وأصلية مثل Text ،View إلخ…

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

4. تعلم Redux

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

ما هو Redux ؟

Redux هو مكتبة جافاسكريبت لإدارة State. جميع البيانات المتحكمة في حالة التطبيق ستكون مخزنة في مكان واحد اسمه Store وبذلك يسهل الوصول إليها من أي مكان في تطبيقنا وتبادلها بين المكونات، وهو الأمر الذي لا يكون بنفس البساطة والسلاسة عندما نقوم بذلك يدويا باستخدام الواجهة البرمجية API ل React.js فقط.

Redux مشروع قائم بذاته ولا علاقه له ب React.js ويمكن استخدامه في أي مكان بشكل مستقل.

دورة بناء تطبيق لتحويل العملات، الذي أشرنا إليها أعلاه، تم فيها الإستعانة ب Redux وبالتالي يمكن الإستفادة منها كذلك في تعلم كيفية دمجه واستخدامه مع في مشروع RN. ولكن ينصح قبل ذلك قراءة التوثيق الرسمي وفهم آلية العمل والفلسفة التي يعتمد عليها (Actions, Reducers, Store).

هذا وأشجع بقوة على قراءة هذا المقال الذي يشرح الموضوع بشكل رائع وفي متناول أبسط المبتدئين :

النهاية

أتمنى أن تكون الصورة أكثر وضوحا الآن عزيزي القارئ.

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

سأكون كذلك مسرورا بالإجابة على أسئلتك حول React Native في التعليقات أو عن طريق صفحة اتصل بنا.

 

3 تعليقات

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

    • وعليكم السلام ورحمة الله،
      أشكرك عزيزي أحمد على هذا الكلام الجميل.
      القادم أفضل بحول الله.

ترك الرد

Please enter your comment!
Please enter your name here