ဖြေရှင်းထားသည်- redux logger ကို တုံ့ပြန်သည်။

Redux Logger ကို တုံ့ပြန်ပါ။ React Redux ကို အသုံးပြု၍ အပလီကေးရှင်းများ ရေးဆွဲခြင်း၏ အဓိကအစိတ်အပိုင်းတစ်ခုဖြစ်သည်။ ဤတူးလ်သည် ဆော့ဖ်ဝဲအင်ဂျင်နီယာများအား သတ်မှတ်အချိန်အတွင်း အပလီကေးရှင်း၏အခြေအနေကို လော့ဂ်လုပ်စေပြီး အမှားရှာပြင်ခြင်းကို ပိုမိုလွယ်ကူစေသည်။ ၎င်းသည် ယခင်အခြေအနေ၊ လုပ်ဆောင်ချက်နှင့် လုပ်ဆောင်ချက်တစ်ခုအား ပေးပို့သည့်အခါတိုင်းတွင် ၎င်းသည် လုပ်ဆောင်သည်။ ဤဆောင်းပါးတွင်၊ ကျွန်ုပ်တို့သည် React Redux Logger ၏အပလီကေးရှင်းတွင် နက်နက်ရှိုင်းရှိုင်း စေ့စေ့ငုကြည့်မည်၊ ဖြစ်ရိုးဖြစ်စဉ်ပြဿနာများအတွက် အဖြေများကို ရှာဖွေကာ ရှင်းလင်းစွာနားလည်နိုင်စေရန်အတွက် ကုဒ်နမူနာအချို့ကို လမ်းညွှန်ပေးပါမည်။

React-Redux Logger ပြဿနာကို နားလည်ခြင်း။

မကြာခဏဆိုသလို developer များသည် ၎င်းတို့၏ react-redux အပလီကေးရှင်းများကို အမှားရှာပြင်နေစဉ် ရုန်းကန်မှုများ ကြုံတွေ့ရလေ့ရှိသည်။ အဖြစ်များသောပြဿနာများတွင် ပြည်နယ်ပြောင်းလဲမှု၏အချက်ကို ဖော်ထုတ်ခြင်း၊ လုပ်ဆောင်ချက်စီးဆင်းမှုကို ခြေရာခံခြင်း သို့မဟုတ် အပလီကေးရှင်းတစ်ခုလုံး၏အခြေအနေကို မြင်ယောင်ရုံသာဖြစ်သည်။ ဤသည်မှာ React Redux Logger ဝင်လာပြီး state logging အတွက် ရိုးရှင်းသော်လည်း ထိရောက်သော ဖြေရှင်းချက်တစ်ခု ပေးစွမ်းသည်။

• logger အလယ်တန်းဆော့ဖ်ဝဲသည် လုပ်ဆောင်ချက်မတိုင်မီနှင့် အပြီးတွင် ပေးပို့ထားသော လုပ်ဆောင်ချက်တိုင်းကို မှတ်တမ်းတင်သည်။
• ၎င်းသည် ဆော့ဖ်ဝဲအင်ဂျင်နီယာများအား ပြည်နယ်အတွင်း အပြောင်းအလဲများကို ခြေရာခံပြီး အမှားရှာပြင်ခြင်းကို ပိုမိုထိရောက်စွာ လုပ်ဆောင်နိုင်စေပါသည်။

React-Redux Logger ကို အကောင်အထည်ဖော်ခြင်း။

React အပလီကေးရှင်းတစ်ခုတွင် redux logger ကိုအသုံးပြုခြင်းဖြင့်စတင်ရန် Redux အလယ်တန်းဆော့ဖ်ဝဲသို့ထည့်သွင်းရန်လိုအပ်သည်။

import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
import logger from 'redux-logger';
import rootReducer from './reducers';

const store = createStore(
  rootReducer,
  composeWithDevTools(
    applyMiddleware(logger) 
  )
);

Redux logger ကို redux မှတင်သွင်းသည့် `applyMiddleware` လုပ်ဆောင်ချက်အတွက် ကန့်သတ်ချက်တစ်ခုအဖြစ် ဖြတ်သန်းပါသည်။ ထို့နောက် ၎င်းသည် ယခင်နှင့် နောက်အခြေအနေများနှင့်အတူ ပေးပို့လာသော လုပ်ဆောင်ချက်တိုင်းကို မှတ်တမ်းတင်သည်။ ထို့နောက် ဤစတိုးသည် သင့်အပလီကေးရှင်း၏အမြင့်ဆုံးအဆင့်ရှိ react-redux မှ ပံ့ပိုးပေးသူအစိတ်အပိုင်းသို့ ရောက်သွားသည်၊ ပုံမှန်အားဖြင့် App.js သို့မဟုတ် index.js။

Redux Logger Configurations များကို ပိုမိုနက်ရှိုင်းစွာ တူးဖော်ပါ။

Redux သစ်ခုတ်သမား စိတ်ကြိုက်ပြင်ဆင်မှုများစွာဖြင့် ထုပ်ပိုးလာပါသည်။ အကောင့်ဝင်မည်ကို သင်ဆုံးဖြတ်နိုင်သည်။

const logger = createLogger({
  collapsed: true,
  diff: true
});

အမှန်ဟု သတ်မှတ်သည့်အခါ `ပြိုကျသော` ရွေးစရာသည် ပြိုကျသည့်လုပ်ဆောင်ချက်များကို မှတ်တမ်းပေးလိမ့်မည်၊ ဆိုလိုသည်မှာ ဆော့ဖ်ဝဲအင်ဂျင်နီယာသည် ၎င်းတို့ကို ချဲ့ထွင်ရန် နှိပ်ရန်နှင့် ယခင်နှင့် နောက်အခြေအနေများကို ကြည့်ရန် လိုအပ်သည်။ `diff` ရွေးချယ်မှုသည် ပြီးပြည့်စုံသောအခြေအနေကိုပြသမည့်အစား ယခင်နှင့်နောက်အခြေအနေကြားခြားနားချက်ကိုပြသပါမည်။

React-Redux Logger ကို အသုံးပြု၍ ပြဿနာများကို ဖြေရှင်းခြင်း။

redux logger ၏ အကျိုးကျေးဇူးများ၊ အကောင်အထည်ဖော်မှုနှင့် အသုံးပြုမှုကို နားလည်ခြင်းက သင့်ကုန်ထုတ်စွမ်းအားကို များစွာတိုးတက်စေပါသည်။ ၎င်းသည် အပလီကေးရှင်းတွင် အပြောင်းအလဲရှိပုံနှင့် မည်သည့်အချိန်တွင် အခြေအနေတို့ကို ပွင့်လင်းမြင်သာမှုပေးခြင်းဖြင့် အမှားရှာပြင်ခြင်းကို ခွင့်ပြုသည်။ မှတ်တမ်းများကို စဉ်ဆက်မပြတ်ဖတ်ရှုခြင်းသည် အချိန်ကာလတစ်လျှောက် လုပ်ဆောင်ချက်စီးဆင်းမှုနှင့် အခြေအနေတို့ကို ထိုးထွင်းသိမြင်စေပါသည်။ redux logger ကိုအသုံးပြုခြင်း၏အဆုံးစွန်ပန်းတိုင်သည်ကြီးမားသော application များ၏ထိန်းသိမ်းနိုင်စွမ်းကိုတိုးတက်စေရန်ဖြစ်ပြီး၎င်းသည်အလွန်အောင်မြင်သည်။