အားလုံးပဲ မဂၤလာပါရွင့္။
ညီမကေတာ့ Spiceworks Myanmar မွာ Web Designer အေနနဲ႔ ဝင္ေရာက္လုပ္ကိုင္ေနတဲ့ ခင္ရတနာေအာင္ ျဖစ္ပါတယ္ရွင့္။ ဒီတစ္ပတ္ ညီမ ေျပာျပမယ့္ အေၾကာင္းအရာကေတာ့ React basics ေတြျဖစ္တဲ့ Component, State နဲ႔ Props တို႔အေၾကာင္း ျဖစ္ပါတယ္။

React ဆိုတာက web နဲ႔ mobile application ေတြအတြက္ user interface ဖန္တီးတဲ့ေနရာမွာ အသုံးျပဳတဲ့ JavaScript library တစ္ခု ျဖစ္ပါတယ္။

React basics ေတြအေၾကာင္း မေျပာျပခင္ react ဘယ္လို install လုပ္ရမလဲ ဆိုတာကို ေျပာျပခ်င္ပါတယ္။ ပထမဦးဆုံး node.js ကို download လုပ္ပါ။ ေနာက္တစ္ဆင့္အေနနဲ႔ command မွာ npm i -g create-react-app ဆိုၿပီး run ပါ။ ၿပီးရင္ေတာ့ react project တစ္ခု ဖန္တီးဖို႔အတြက္ npx create-react-app folder_name ဆိုၿပီး command မွာ run ပါ။ folder create လုပ္ၿပီးသြားရင္ေတာ့ cd folder_name ဆိုၿပီး folder ရွိတဲ့ လမ္းေၾကာင္းမွာ npm start လုပ္ၿပီး project ကို server မွာ run ပါမယ္။

react ကို ဘယ္လို install လုပ္ရမယ္၊ react project တစ္ခုကို ဘယ္လိုဖန္တီးရမယ္ဆိုတာ ေျပာျပၿပီးၿပီဆိုေတာ့ အခုက react basics အေၾကာင္းကို ဆက္ရွင္းျပပါမယ္။

Component

React မွာ JSX ကို အသုံးျပဳၿပီး HTML ေရးလို႔ရပါတယ္။ Component ဆိုတာက JSX နဲ႔ ေရးသားထားတဲ့ react app ရဲ႕ interface block ျဖစ္ပါတယ္။ App တစ္ခုကို component မ်ားစြာနဲ႔ တည္ေဆာက္ထားတာ ျဖစ္ပါတယ္။ component တစ္ခု ဖန္တီးၿပီးသြားရင္ ျပန္လည္အသုံးျပဳလို႔ရတာျဖစ္တဲ့အတြက္ App မွာ component ေတြကို လိုသလို အသုံးျပဳလို႔ ရပါတယ္။

State

State ဆိုတာက component ေတြရဲ႕ data ေတြကို runtime မွာ ယာယီ သိမ္းဆည္းထားတာ ျဖစ္ပါတယ္။ State ရဲ႕ data ေတြကို ေျပာင္းလို႔ရတဲ့အျပင္ data ေတြအေပၚလိုက္ၿပီး component ေတြရဲ႕ data ေတြကို ေျပာင္းလဲလို႔ ရပါတယ္။

Props

ေနာက္ဆုံးတစ္ခုကေတာ့ Props (Properties) ျဖစ္ပါတယ္။ Props ကေတာ့ component ေတြဆီကို data ေတြ ပို႔ေဆာင္ေပးပါတယ္။ Component ရဲ႕ layout ကိုဘဲ အသုံးျပဳၿပီး မတူတဲ့ data ေတြ ျပခ်င္တဲ့အခ်ိန္မွာ Props နဲ႔ data ေတြ ေပးပို႔ၾကပါတယ္။

အခု ညီမ မွ်ေဝတဲ့ react basics အေၾကာင္းကို ဖတ္ရႈၿပီး တစ္ခုခု အက်ိဳးရွိသြားမယ္လို႔ ေမွ်ာ္လင့္ပါတယ္။ အခ်ိန္ေပး ဖတ္ရႈေပးတဲ့အတြက္ ေက်းဇူးတင္ပါတယ္။