AI တို့ရဲ့ သမိုင်းကြောင်းအစ 📝

အခုဆိုရင် လူတိုင်းလိုလိုရဲ့ ပါးစပ်ဖျားမှာ AI AI ဆိုတာ ပြောလာကြတာကို တွေ့ရမှာဖြစ်သလို AI ကလည်း ကျောင်းသုံး၊ ရုံးသုံးကိစ္စတွေမှာပါ အသုံးများလာတာကို တွေ့ရမှာပါ။

သူတို့တွေ ဖြစ်ပေါ်လာပုံရဲ့သမိုင်းကြောင်းကို ကြည့်မယ်ဆိုရင် 
လူတွေရဲ့ အသိဉာဏ်လို အသုံးပြုနိုင်တဲ့ စက်တစ်ခုကို တီထွင်ခဲ့တဲ့ idea ကနေအစပြုရမှာပါ။ ၁၉၅၀ ခုနှစ်မှာ သချာ်ပညာရှင် Alan Turing ကနေ Computing Machinery and Intelligence ဆိုတဲ့ paper တစ်ခုကိုတင်ပြခဲ့ပါတယ်။ သူ့ရဲ့ရည်ရွယ်ချက်ကတော့ စက်တစ်ခုက လူတစ်ယောက်ရဲ့အသိဉာဏ်နဲ့ အပြုအမူတွေကို ပုံတူကူးထားနိုင်လားဆိုတာ သိရှိရဖို့ဖြစ်ပါတယ်။

‌၁၉၅၆ မှာပြုလုပ်ခဲ့တဲ့ Dartmouth Conference မှာတော့ သိပ္ပံပညာရှင်တွေစုစည်းပြီး AI စတင်ဖန်တီးနိုင်မှုကို ဆွေးနွေးခဲ့ကြပါတယ်။ ၁၉၆၀ နဲ့ ၁၉၇၀ နှောင်းပိုင်းမှာ တီထွင်မှုတွေကို စတင်ပြုလုပ်ခဲ့ကြပြီး စိန်ခေါ်မှု၊ အခက်အခဲများစွာကိုလည်း ကြုံတွေ့ခဲ့ကြရပါတယ်။ ၁၉၈၀ နဲ့ ၁၉၉၀ ကာလတွေအရောက်မှာတော့ Machine Learning နဲ့ Algorithm တွေကိုအသုံးပြုလာခဲ့ကြပါတယ်။ 

အခုခေတ်မှာဆိုရင်တော့ AI လောကရဲ့ ကျယ်ပြန့်လာမှုကို မြင်တွေ့ရမှာပါ။ နည်းပညာတွေကို အမှီလိုက်နိုင်ဖို့ မျက်ခြည်မပြတ်လေ့လာထားဖို့လည်း လိုအပ်ပါသေးတယ်။ 

Developer ကြီးတို့ကရော AI ရဲ့တိုးတက်လာမှုတွေကို ဘယ်လိုထင်ပါသလဲ?

Comment မှာဆွေးနွေးပေးသွားကြပါဦးနော် 👀

#creative_coder_myanmar
#artifical_intelligence

Creative Coder Website မှာ Live Chat Feature နဲ့ စုံစမ်းမှုပြုလုပ်နိုင်ပါပြီ 🥳

အတန်းအကြောင်းစုံစမ်းချင်တာလား ?
စာမေးချင်တာလား?

သိချင်တာတွေအကုန်လုံးကိုအဖြေရှာဖို့အတွက် Creative Coder Website မှာ Live Chat Feature လေးကို မိတ်ဆက်လိုက်ပြီပဲဖြစ်ပါတယ်။
ဒီ feature မှာဆိုရင် website မှာတင် admin နဲ့ကိုယ်တိုင်စကားပြောနိုင်ပြီး ဆက်သွယ်စုံစမ်းမှုတွေပြုလုပ်နိုင်မှာဖြစ်ပါတယ်။

အသေးစိတ်ရှင်းပြထားတဲ့ အကြောင်းအရာကို ပုံတစ်ပုံချင်းစီကိုနှိပ်ပြီး ကြည့်ရှုနိုင်ပါတယ်။

http://creativecodermm.com

Recoil နဲ့ Redux တို့ဟာ React Ecosystem မှာရှိတဲ့ state management library တွေပဲဖြစ်ပါတယ်။ ဒါပေမယ့် သူတို့ကိုအသုံးချမှုနဲ့ design ပေါ်မူတည်ပြီးကွဲပြားမှုလေးတွေရှိနိုင်ပါတယ်။

👉 Recoil ကတော့ Facebook က develop လုပ်ခဲ့တဲ့ state management library အသစ်တစ်ခုဖြစ်ပါတယ်။ React Application တွေမှာပါ၀င်တဲ့ state တွေကို လွယ်ကူစွာ manage လုပ်နိုင်ဖို့ရည်ရွယ်ပါတယ်။

သူ့ရဲ့ key feature တွေကတော့ atom တွေနဲ့ selector တွေပဲဖြစ်ပါတယ်။ atom တွေက react ရဲ့ဘယ် component တွေကိုမဆိုဖတ်နိုင်ပြီး selector ကတော့ complex ဖြစ်တဲ့ state logic တွေကို ထိန်းချုပ်ဖို့အသုံးပြုပါတယ်။

Recoil မှာဆိုရင် state တစ်ခုချင်းစီကို ထိန်းချုပ်တဲ့နေရာမှာ တစ်ခုချင်းစီကို လွတ်လပ်စွာ ထိန်းချုပ်နိုင်တာကြောင့် ထိန်းသိမ်းဖို့လွယ်ကူပါတယ်။

Performance ပိုင်းမှာဆိုရင်လည်း component တွေကို re-render လုပ်တာက state ပြောင်းတဲ့အပေါ်မူတည်တာကြောင့်
မလိုအပ်ဘဲ rendering လုပ်တာတွေကို လျှော့ချပေးပြီး လုပ်ဆောင်မှုကို ပိုအားကောင်းစေပါတယ်။

နောက်အချက်ကတော့ atom သို့မဟုတ် selector ကနေတဆင့် တစ်ခုခုပြောင်းလဲလိုက်ရင် subscribe ဖြစ်ပြီးသား component တွေကိုပါ အကုန် update ဖြစ်သွားစေပါတယ်။

Recoil ကို state တစ်ခုချင်းစီ ခွဲခြားပြီး
manage လုပ်ဖို့လိုတဲ့အခါ အသုံးပြုကြပါတယ်။

👉 Redux ကတော့ Javascript ရဲ့ state management library တစ်ခုဖြစ်ပြီး ခန့်မှန်းရလွယ်ကူတဲ့ container pattern တွေနဲ့ data flow တွေပါ၀င်ပါတယ်။

Redux က application တစ်ခုလုံးကို store တစ်ခုတည်းမှာတင် ထိန်းချုပ်ပေးတာဖြစ်ပါတယ်။

Redux မှာပါ၀င်တဲ့ action တွေ reducers တွေက type , reload တွေနဲ့အတူ state ပြောင်းလဲမှုကို ဖော်ပြပေးပြီး pure function တွေကနေတဆင့် current state ကနေ new state တစ်ခုကို return ပြန်ပေးပါတယ်။ Reducers တွေဟာ state ပြောင်းလဲမှုအပေါ်ဖြစ်ပေါ်တဲ့ response action တွေကိုလည်း ဖော်ပြပေးပါတယ်။

Redux မှာပါ၀င်တဲ့ middleware တွေက logging, asynchronous action နဲ့ side effects management စတဲ့အပိုင်းတွေအတွက် လုပ်ဆောင်မှုအပိုင်းကို ပိုပြီးကောင်းစေပါတယ်။

Redux မှာ developer tool တွေ၊ plugin တွေ၊ extension တွေလည်းပါ၀င်တာကြောင့် debugging, testing နဲ့ functionality ပိုင်းမှာ အဆင်ပြေစေမှာပါ။

တစ်ခုရှိတာက sync function အပိုင်းမှာဆိုရင် Recoil မှာက built in support အနေနဲ့ပါပြီးသားဖြစ်ပါတယ်။ Redux မှာဆိုရင်တော့ တိုက်ရိုက်အသုံးပြုလို့မရဘဲ thunk ကိုလိုအပ်ပါတယ်။

Redux ကိုအသုံးပြုတဲ့နေရာတွေကတော့ complex ဖြစ်တဲ့ state တွေပါ၀င်တဲ့ large-scale application တွေကို manage လုပ်ဖို့အသုံးပြုကြပါတယ်။

Developer တို့အတွက် Redux နဲ့ React အပေါ်ရွေးချယ်မှုကတော့ ကိုယ်အသုံးပြုနေတဲ့ application ပေါ်မှာပဲ အဓိကမူတည်သွားမှာပါ။

React Developer ကြီးတို့ကရော ကိုယ်ကဘာကိုအသုံးပြုနေလဲဆိုတာ comment မှာရေးပေးသွားကြပါဦးနော် 💬👀

#creative_coder_myanmar

Website မှာ အခမဲ့ လေ့လာလို့ရတဲ့ PHP Solid Design Course 🥳🎉

Website မှာ အသစ်ရောက်နေတဲ့ Course လေးအကြောင်းသိပြီးကြပြီလား Developer ကြီးတို့ရေ

Developer တို့အနေနဲ့ အလုပ်ထဲမှာ ကျစ်လစ်ပြီး maintain လုပ်ရလွယ်တဲ့ code တွေရေးတတ်ဖို့အတွက် PHP Solid Design Principle ကိုသိထားခြင်းက အထောက်အကူပြုပါလိမ့်မယ်။

PHP basic & OOP အခြေခံရှိထားသူတိုင်း ဒီအတန်းလေးကိုတက်ရောက်နိုင်ပါတယ်။

🔥 OOP concept တွေကို ပိုပြီး နားလည်ချိတ်ဆက်ပြီး မြင်သွားနိုင်ဖို့
🔥 Maintain လုပ်ရတာပိုလွယ်ကူတဲ့ Flexible ဖြစ်တဲ့ code တွေပိုရေးသားလာနိုင်ဖို့
🔥 အလုပ်ထဲမှာ PHP Design Principle တွေသုံးထားရင် စိမ်းနေမှာ မဟုတ်တော့ပဲ နားလည်နေစေဖို့ ရည်ရွယ်ပါတယ်။

Course Outline အနေနဲ့ကတော့
👉 Single Responsibility
👉 Open Closed Principle
👉 Liskov Substitution Principle
👉 Interface Segregation
👉 Dependency Inversion တို့ပဲဖြစ်ပါတယ်။

အတန်းပြီးရင် Creative Coder Certificate လေးပါထုတ်ယူနိုင်ဦးမှာဖြစ်ပါတယ်။

ဒီ course လေးကို တက်ရောက်ဖို့အတွက်ဆိုရင်တော့
👉 creativecodermm.com ကိုသွားပြီး register လုပ်ပြီး free course တွေစလေ့လာလို့ရပါပြီ။
👉 register လုပ်ပြီးသွားတဲ့သူတွေကတော့
https://creativecodermm.com/courses/php-solid-design-principle
ကနေ၀င်ပြီးလေ့လာလိုက်ရုံပါပဲ။

Certificate တွေစုပြီး Level up နိုင်မယ့် Game Level Up Feature လေးလည်းရှိတာကြောင့် assignment တွေလုပ်ပြီး certificate တွေယူထားဖို့မမေ့နဲ့နော် 👀

#creative_coder_myanmar
#php

Image Upload တဲ့နေရာမှာ Developer တို့ကို အကူအညီပေးနိုင်တဲ့ function တစ်ခု

Developer တို့အနေနဲ့ Web Application တွေတည်ဆောက်တဲ့နေရာမှာ handleImageUpload function လေးက ကိုယ်တင်လိုက်တဲ့ image တွေကို preview ကြည့်လို့ရအောင်လုပ်ပေးပါတယ်။
Example code အနေနဲ့ကတော့

function handleImageUpload(inputElement, previewElement) {
inputElement.addEventListener('change', function() {
const file = this.files[0]; // Get the selected file
if (file) {

if (!file.type.startsWith('image/')) {
console.log('Selected file is not an image.');
return;
}

const reader = new FileReader();
reader.onload = function(e) {
previewElement.src = e.target.result;
};
reader.readAsDataURL(file);

} else {
previewElement.src = '';
}
});
}
ဒီ code လေးမှာဆိုရင် ပထမဆုံး handleInamgeUpload function နဲ့အတူ parameter နှစ်ခုပါ၀င်ပါတယ်။ ပထမတစ်ခုက inputElement ဖြစ်ပြီး ဒုတိယတစ်ခုကတော့ previewElement အတွက်ပါ။

function handleImageUpload(inputElement, previewElement) {

ပြီးရင်တော့ file input change အတွက် eventlistener ကိုထည့်သွင်းထားပါတယ်။ user ဆီက file ကိုလက်ခံတဲ့အခါ event change သွားရင်အသုံးပြုတာဖြစ်ပါတယ်။

ပြီးရင်တော့ ပထမဆုံး const file နဲ့ user ရွေးထားတဲ့ file ကိုလက်ခံပါတယ်။ if condition နဲ့ file ကိုရွေးချယ်ပြီးပြီလားဆိုတာ စစ်ဆေးပါတယ်။ file က message မဟုတ်ဘဲ image ဖြစ်တယ်ဆိုရင်တော့ function ကိုအသုံးပြုပါတယ်။

const file = this.files[0]; // Get the selected file
if (file) {
// Check if the selected file is an image
if (!file.type.startsWith('image/')) {
console.log('Selected file is not an image.');
return;
}

ဒီအဆင့်မှာတော့ image preview အတွက် file reader ကလုပ်ဆောင်ပေးပါတယ်။

တကယ်လို့ user က ဘာ file မှ မပို့ဘူးဆိုရင်တော့ previewElement ရဲ့ src attribute ကနေ preview ကိုဖယ်ပေးမှာပါ။

} else {
previewElement.src = ''; // Clear the preview if no file selected
}
});
}

example အနေနဲ့

const uploadInput = document.getElementById('uploadInput'); ကနေတစ်ဆင့် file input element ကိုသူ့ရဲ့ ID ကနေတစ်ဆင့် ရယူပေးပါတယ်။

နောက်တစ်ဆင့်ကတော့

const previewImage = document.getElementById('previewImage');

ကနေ image element ကိုရယူပါတယ်။

နောက်ဆုံးမှာတော့

handleImageUpload(uploadInput, previewImage);

ကနေ handleImageUpload function ကိုခေါ်ပြီး image review ကိုပြသပေးပါတယ်။

အကျဉ်းချုပ်ရရင် ဒီ function လေးက web application တွေမှာ user upload လုပ်လိုက်တဲ့ image ကို File reader api ကနေတစ်ဆင့် image preview ပြပေးတဲ့ function လေးပဲဖြစ်ပါတယ်။
File reader API ကိုအသုံးပြုပြီး file ကိုဖတ်ပြီး image element ကို display လုပ်ပေးပါတယ်။ ဘယ် file မှမပေါ်လာတာဖြစ်စေ၊ ရွေးလိုက်တဲ့ file image မဟုတ်ဘူးဆိုရင်တော့ preview ပြပေးမှာမဟုတ်ပါဘူး။

ဒီ function လေးက developer တွေအတွက်အသုံး၀င်မယ်လို့လည်း မျှော်လင့်ပါတယ်။

အခြား developer တွေလည်းသိသွားအောင် sharing လုပ်ပေးဖို့လည်း မမေ့နဲ့နော် 👀

#creative_coder_myanmar