بعد يومين مع الـ React, إنطباعي عنها إنها جميلة وسهلة, وبتعتمد على ما لديك من سابق معرفة من HTML ,JS.
لفيت على الـ Docs الرسمي لـ React, React-router , create-react-app , فى يومين, وشفت كورس كامل وعملت مثال على اللى إتعلمته ورفعته على github, من باب المعرفة.
فى حين إنى أذكر لما Angular 1 نزلت , قضيت شهر أقرأ الـ Docs الرسمي لها, مش فاكر مع Angular 2 قضيت كام يوم فى التعلم, لكن ممكن يكون شهر أو أقل.
طبعاً فى بعض الأوقات كانت اللفة سريعة والبعض الأخر, كنت بقرأ بتمعن لما أحتاج أفهم حاجه. و دا طبعاً بيتوقف على عنوان ومحتوي الموضوع, لو بيتكلم على حاجه عارفها. خلاص. فكان ممكن أكون محتاج أعرف الـ Sytax فقط.
فيه حاجات عملتها بنفسى فى التطبيق العملى قبل ما أقرأ الـ Docs, بالتحليل المنطقى من سابق معرفتى بكلاً من KnockoutJs و بعدها Angular ومن بعدها VueJs وموخراً كانت React. فطبعاً كل اللى بتعرفه بيعمل عندك تراكم معرفي. فاللى أقصد أقوله هنا, إنك مش بالضرورة لازم تاخد يومين فى تعلم react, دا بناءاً على سابق معرفتك وخبرتك. فممكن تاخد أكثر , أو أقل , فلا تقلق.
الفضول اللى خلاني أكمل فى react, يعني إتعرفت على الـ Binding , وبعدين دفعني الفضول أعرف إزاى بيتم نقل بيانات بين الـ Components, و وبعدين إزاى نبني Forms, وسألت نفسى إزاى أشغل الـ Routing, فبحث وعرفت إنك ممكن تستخدم react-router-dom , بتحملها من npm وتشتغل, طيب, تمام. عملت Routing, وبعدين ؟
فكرت إزاى أعمل API Calls, فاستخدمت Axios, وعملت call to online fake api. والأمور مشيت تمام, إلى أن وصلت لعرض التفاصيل! . وصلت لإزاى أعمل Parameter وأستقبله من الـ URL, كانت مزعجة بعض الشئ, فاضطريت إستخدم function component بدل من class component, لإنك ممكن تبني component فى react على شكل function أو class وممكن الدمج بينهم فى مشروع واحد مفيش مشكلة إن شاء الله.
فى الطريق لعرض التفاصيل بـالـ Id من العنوان من خلال react-router-dom, قابلت ما يعرف بـ Hooks, وعرفت إنها مجموعة functions بيبدأ إسمها بكلمة use مثال : useState, useContext, useEffect, وغيرهم, وطبعاً تقدر تنشأ Hook خاص يعني تعمل Custom hook, يعني مثلاً هتلاقى useParams , useLocation و useRouteMatch موجودين مع React-router-dom, واللى من خلال useParams قرأت قيمة الـid من Route.
وإستخدمت اللى إحتجته منهم زى useState , useEffect , useParams إلى الان.
بعد ما عملت الـ Routing, فكرت إزاى يبقى Lazy Loading, ومشيت مع الـ Docs إلى أن قابلت lazy , suspense , بتقدمهم react, وعملت Routing Lazy Loading والأمور مشيت تمام.
طبعاً أنا أعرف Redux من قبل كدا, وقابلتها فى الطريق,هى بتعمل State Management. لما تحتاجها هترفع إنك محتاجها.
فى النهاية دا وصفى كمبتدئ فى الـ React وإنطباعى عنها إنها جميلة وسهلة, وبتضيف للتراكم المعرفي عندك.
فحاول تقضى فيها يوم أو يومين وتعمل مشروع صغير تطبق فيه اللى إتعلمته. مش هتخسر , بالعكس هتكسب إن شاء الله.
ودا المثال اللى كنت بطبق عليه, رفعته على github.
المشروع بدأته من غير Template, فتحت vs Code وعملت Folder فاضى, وأضفت الملفات من الصفر, قبل ما أعرف إن فيه npx create-react-app myApp . كانت تجربة لذيذة, وهحاول أوظفها إن شاء الله فى أقرب مشروع إن شاء الله.
https://github.com/AhmedMoosa/ReactJs-Demo
بالإنجاز.
ASP.Net 