zinoojs

Much Easier Approach to React

စိတ်ဝင်စားတဲ့သူများနေလို့ လေ့လာကြည့်ပေမယ့် "React က ခက်လိုက်တာ" လို့များတွေးနေသလား? တစ်ကယ်တော့ React က မခက်ပါဘူး။ ရေးနည်း တွေးနည်းတွေက မူလရိုးရိုး ရေးနည်းတွေးနည်း စနစ်တွေကနေ လုံးဝပြောင်းသွားလို့ "ပြောင်းရခက်နေတာ" ပါ။ Official Documentation နဲ့ အင်တာနက်က Tutorial တွေလေ့လာကြည့်လိုက်ရင်လည်း -- ES6 တွေ၊ Arrow Function တွေ၊ Class တွေ၊ JSX တွေနဲ့ ဟိုကနေဒီရောက်၊ ဟိုကနေဒီရောက် ဖြစ်နေပြီး -- သူတို့ရှင်းပြမှ ပိုရှုပ်သွားတယ် ဆိုသလို ဖြစ်နေတာကို တွေ့ရပါတယ်။

ဒီပို့စ်မှာ React ကို ချည်းကပ်ပုံတစ်မျိုးနဲ့ ပြောင်းလဲဖော််ပြပေးသွားမှာပါ။ ကျွန်တော်ပို့ချနေတဲ့ Rockstar Developer Course က သင်တန်းသူ သင်တန်းသားတွေကို ဒီနည်းနဲ့ သင်မယ်လို့ ရည်ရွယ်ထားပေမယ့် လက်တမ်း ချသင်ကြည့်တဲ့အခါ သိပ်အဆင်မပြေလို့ အခုလိုစာအဖြစ် ရေးသားလိုက်တာပါ။ JavaScript အခြေခံရှိသူ မည်သူမဆို နားလည်ပြီး စိတ်ဝင်စားလိမ့်မယ်လို့ ထင်ပါတယ်။

Plain JavaScript

ဘာ Library, ဘာ Framework မှ မပါတဲ့ ရိုးရိုး JavaScript နဲ့ HTML Element တစ်ခုတည်ဆောက်မယ်ဆိုရင် အခုလို တည်ဆောက်နိုင်ပါတယ်။

zinoojs

The Most Minimal React-Redux

Redux ဟာ လေ့လာသူတိုင်းကို ခေါင်းမူးစေတဲ့ နည်းပညာတစ်ခုပါ။ ဒီလောက်ကြီး ခက်လှလို့မဟုတ်ပါဘူး။ သူသုံးထားတဲ့ နည်းစနစ်တွေကြောင့် လူတွေကို မျက်စိလည်စေတာပါ။ ဒီတော့ ရသလိုလို မရသလိုလိုတွေဖြစ်ပြီး စိတ်ညစ်ကုန်ကြရော။ ဒီနေရာမှာ အခြေခံအကျဆုံးနဲ့ အရှင်းဆုံး Redux ကုဒ်နမူနာကို ဖော်ပြပေးပါမယ်။ ရှုပ်ထွေးတဲ့ နည်းပညာတွေ ပါဝင်မှာ မဟုတ်ပေမယ့် ကုဒ်ရဲ့ဖွဲ့စည်းပုံ ဆန်းပြားလို့ Programming အမြင် အတော်လေးရှိဖို့ လိုအပ်နိုင်ပါတယ်။ ဒီထက်ရှင်းအောင်တော့ ရေးပြလို့ ရနိုင်တော့မှာ မဟုတ်ပါဘူး။

လက်တွေ့ စမ်းသပ်ကြည့်နိုင်ဖို့အတွက် ပထမဦးဆုံး Project ဖိုဒါတစ်ခုဆောက်ပြီး အထဲမှာ Redux ကို Install လုပ်လိုက်ပါ။

npm install redux --save

zinoojs

var x =typeof("76");
var y = typeof("turtle");
if(y == "string" && x == "number"){
    console.log(x+y);
    
}else{
    console.log(y[4]);
    
}

zinoojs

<div id="wrap">
    <h1>Todo List <span>0</span> </h1>
    <h1 class="dad">checked List <span>0</span></h1>
    <ul id="todo"></ul>
    <ul id="done"></ul>
    <div id="new">
        <input type="text"><button>+</button>
    </div>
    </div>
    <script src="jquery.js"></script>