Creative Coder Myanmar
1.38K subscribers
548 photos
1 video
102 links
Web Development ခရီးစဉ်ကို
Creative Coder နှင့်စတင်လိုက်ပါ။🚀
Download Telegram
https://www.facebook.com/100064708297617/posts/pfbid0QQCVVwZgwQVsoSWSeLuQy596CqzPnNdH6XGvZvRhDBudpRvEUxKRDWWY4xPqCKhol/

PHP Laravel Zoom Class လေး ကျောင်းသား ၁၀ ယောက်ကျော်ထိ ရှိလာပြီဖြစ်ပါတယ်ခင်ဗျာ။🥰 ဒီ batch လေးပြီးရင် ကျွန်တော် Laravel Zoom class လေး ခဏနားပြီး တခြားအတန်း အသစ်လေး ဖွင့်ဖြစ်သွားမှာမို့ စိတ်ဝင်စားသူများ ဒီ batch နောက်မကျစေရအောင် အသိလေးပေးလိုက်ပါတယ်ခင်ဗျာ။
Laravel သမားတွေ ဒါမသိရင် အန္တရယ်များတယ်နော် !!! 👇👇👇

https://vt.tiktok.com/ZSYAhE4vf/
Telegram နဲ့ TikTok မှာ Creative Coder ရှိနေတာ သိပြီးကြပြီလား?

=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°

Creative Coder ရဲ့ အတန်းတွေအကြောင်း၊ စဉ်ဆက်မပြတ်တင်ဆက်ပေးနေတဲ့ web development နဲ့ပတ်သက်တဲ့ knowledge sharing တွေအကြောင်း အချိန်နဲ့ တစ်ပြေးညီသိရှိနိုင်ဖို့ Telegram နဲ့ TikTok မှာ Creative Coder ရှိနေပါပြီ။

Tips and Tricks တွေကို ‌sharing လုပ်ပေးနေတာဖြစ်လို့ follow ထားပြီးစောင့်ကြည့်ကြဖို့လည်း မမေ့နဲ့နော် 👀

Tiktok
https://www.tiktok.com/@creativecodermm?_t=8mufG7lMQiY&_r=1


Telegram 
https://t.me/creativecodermm


Youtube
https://youtube.com/c/CreativeCoderMyanmar


Linkedin
https://www.linkedin.com/company/creative-coder-myanmar/


Facebook
https://www.facebook.com/creativecodermm


CreativeCoder Learning Platform
http://creativecodermm.com

#creative_coder_myanmar


#creative_coder_myanmar
Visibility နဲ့ပတ်သက်ပြီး ကောင်းမွန်စွာကိုင်တွယ်နိုင်တဲ့ isInViewpoint Function 🧑‍💻

=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°

Web Development ပိုင်း မှာ visibility နဲ့ပတ်သက်တဲ့ element တွေကို ကိုင်တွယ်နိုင်ဖို့ function လေးနဲ့မိတ်ဆက်ပေးပါရစေ။

isInViewPort function ကို များသောအားဖြင့် lazy loading, infinite scroll, animation လုပ်တဲ့နေရာတေွမှာ အသုံးဝင်တဲ့ function လေးဖြစ်ပါတယ်.

function isInViewport(element) {
  const rect = element.getBoundingClientRect();
  return (
    rect.top >= 0 &&
    rect.left >= 0 &&
    rect.bottom <= (window.innerHeight  document.documentElement.clientHeight) &&
    rect.right <= (window.innerWidth  document.documentElement.clientWidth)
  );
}

// Usage
const element = document.querySelector('#myElement');
if (isInViewport(element)) {
  console.log('Element is in viewport');
}

Code example မှာဆိုရင် ပထမဆုံး isInViewpoint Function ‌ကနေပြီးတော့ <div> <img> စတဲ့ element တစ်ခုကို select လုပ်ပါတယ်။

ပြီးရင်တော့ const rect = element.getBoundingClientRect(); ဆိုတဲ့ line လေးကနေတစ်ဆင့် html web page မှာရှိတဲ့ 
element ရဲ့ position ကို ယူပြီး rect လို့ခေါ်တဲ့ variable ထဲမှာသိမ်းပေးထားပါတယ်။ 

ဒီ function ရဲ့အရေးအကြီးဆုံးအပိုင်းအနေနဲ့ကတော့ rect object ရဲ့ properties ကိုအသုံးပြုပြီး condition (4) ခု စစ်ပေးပါတယ်။ element ကိုမြင်ရတယ်ဆိုရင် true လို့ return ပြန်ပေးပြီး မမြင်ရဘူးဆိုရင်တော့ false ကို return ပြန်ပေးပါတယ်။

👉rect.top >= 0
ဒါကတော့ element ရဲ့ထိပ်ပိုင်းက viewpoint ရဲ့ ထိပ်ဆုံးမှာရောက်နေလားဆိုတာကို စစ်တာပါ။

👉rect.left >= 0

ဒါကတော့ element ရဲ့ ဘယ်ဘက်ခြမ်းက viewpoint ရဲ့ ဘယ်ဘက်ခြမ်းမှာ ရောက်နေလားဆိုတာကိုစစ်တာပါ

👉rect.bottom <= (window.innerHeight || document.documentElement.clientHeight)
ကတော့ element ရဲ့အောက်ခြေအတိုင်းအတာက viewpoint ရဲ့ height အတွင်းမှာ ၀င်နေလားဆိုတာစစ်တာပဲဖြစ်ပါတယ်။

👉rect.right <= (window.innerWidth || document.documentElement.clientWidth)

ဒါကလည်း bottom check နဲ့အလုပ်လုပ်တဲ့ပုံစံတူပါတယ်။ element ရဲ့ညာဘက်ခြမ်းက viewpoint ရဲ့အကျယ်အတွင်းမှာရှိနေလားဆိုတာစစ်ပေးတာပါ။

ဒီနည်းလမ်းလေးက web page တွေမှာ element တစ်ခုကို screen အတွင်းမှာ သေချာမြင်ရလားဆိုတာကို စစ်ဆေးပေးနိုင်တဲ့ အရိုးရှင်းဆုံးနည်းလမ်းလေးပဲဖြစ်ပါတယ်။ 

Creative Coder ရဲ့ အတန်းတွေအကြောင်း၊ စဉ်ဆက်မပြတ်တင်ဆက်ပေးနေတဲ့ web development နဲ့ပတ်သက်တဲ့ knowledge sharing တွေအကြောင်း အချိန်နဲ့ တစ်ပြေးညီသိရှိနိုင်ဖို့ Telegram နဲ့ TikTok မှာ Creative Coder ရှိနေပါပြီ။

Tips and Tricks တွေကို ‌sharing လုပ်ပေးနေတာဖြစ်လို့ follow ထားပြီးစောင့်ကြည့်ကြဖို့လည်း မမေ့နဲ့နော် 👀

Tiktok
https://www.tiktok.com/@creativecodermm?_t=8mufG7lMQiY&_r=1


Telegram 
https://t.me/creativecodermm


Youtube
https://youtube.com/c/CreativeCoderMyanmar


Linkedin
https://www.linkedin.com/company/creative-coder-myanmar/


Facebook
https://www.facebook.com/creativecodermm


CreativeCoder Learning Platform
http://creativecodermm.com


#creative_coder_myanmar
https://www.facebook.com/100064708297617/posts/pfbid02U5VCPUDmyJB67dqPP5DhCnfLB5GPqhb3WuPJMpD7gZYHBx7qYDCHg36d2HFHDkjZl/

Course Outline အသစ်နဲ့ PHP Laravel Zoom Class လေး Discount နဲ့အပ်နိုင်မို့ ကျောင်းသား ၃ ယောက်သာလိုပါတော့မယ်ခင်ဗျာ။🚀
ဒီ batch မှာ Project အသစ် တူတူရှယ်ရေးချင်ပါတယ်ဗျို့။
Vscode မှာ တစ်ခါတည်း Chatting ရိုက်မေးနိုင်မဲ့ AI Coding Assistant🚀

ကျွန်တော်တော့ တော်တော်လေး သဘောကျမိပါတယ်။ မိတ်ဆွေတို့ရော စမ်းပြီးကြပြီလားဗျ👀 👇👇👇

https://vt.tiktok.com/ZSYUC992X/
Array တွေကိုလိုသလိုခွဲ ခြမ်းစိတ်ဖြာဖို့ အသုံးပြုနိုင်တဲ့ chunkArray function 🧑‍💻

chunkArray function အကြောင်းသိပြီးကြပြီလား Developer ကြီးတို့ရေ 👀

ဒီ function လေးတွေကို ကြီးမားတဲ့ dataset တွေကို ပိုပြီးထိန်းသိမ်းရလွယ်ကူတဲ့ dataset လေးတွေအဖြစ် ပြောင်းလဲပေးတဲ့နေရာမှာ အသုံးပြုပါတယ်။ 

Code Example လေးနဲ့အတူ ကြည့်လိုက်ရအောင်။

function chunkArray(array, size) {
const result = []; for (let i = 0; i < array.length; i += size) { result.push(array.slice(i, i + size)); }
return result;
} // Usage console.log(chunkArray([1, 2, 3, 4, 5], 2)); // [[1, 2], [3, 4], [5]]

ဒီ code example လေးမှာဆိုရင် chunkArray ကိုအသုံးပြုပြထားပြီး ရရှိလာတဲ့ ရလဒ်ကိုပါ return ပြန်ပေးထားပါတယ်။ 

ဒီ code လေးကိုတစ်ဆင့်ချင်းကြည့်လိုက်မယ်ဆိုရင် 

function chunkarray(array,size){}
function မှာ parameter နှစ်ခုပါ၀င်ပြီး array parameter က ကိုယ်ဖြတ်ပိုင်းချင်တဲ့ array အစိတ်အပိုင်းကိုပြောတာဖြစ်ပါတယ်။ size parameter ကတော့ တစ်ပိုင်းစီမှာ ကိုယ်ဘယ်လောက်ဖြတ်ပိုင်းချင်လဲဆိုတာကို ပြောတာပဲဖြစ်ပါတယ်။

const result = [];
const result ထဲမှာတော့ original empty array ရှိပါတယ်။
 for (let i = 0; i < array.length; i += size)
ပြီးရင်တော့ 0 ကစတဲ့ loop ပတ်ထားပြီး ဒီကနေ array ကိုစိတ်ပိုင်းမယ့် ပမာဏကို သိရှိနိုင်ပါတယ်။

{ result.push(array.slice(i, i + size)); }

ပြီးရင်တော့ original array ကနေ ဖန်တီးထားတဲ့ sub-array တစ်ခုကိုဖြစ်ပေါ်စေမှာ ဖြစ်ပါတယ်။
result.push ကနေ ရလဒ်အသစ်တစ်ခုကို ရလဒ်စေမှာပါ။ 

ပြီးရင်တော့ return result ကနေရလာတဲ့ array ကို return ပြန်ပေးပါတယ်။

Case အနေနဲ့ကတော့ 

console.log(chunkArray([1, 2, 3, 4, 5], 2)); // [[1, 2], [3, 4], [5]]

1,2,3,4,5 ပါတဲ့ array တစ်ခုကို နှစ်ခုစီ ပိုင်းလိုက်တဲ့အခါ [[1, 2], [3, 4], [5]] ဆိုတဲ့ အပိုင်းလေးတွေပိုင်းပေးပြီး ပိုတဲ့ array ကိုလည်း ဖော်ပြပေးပါတယ်။


chunkArray function လေးရဲ့ အသုံး၀င်ပုံကိုသိပြီးကြပြီဆိုတော့ စမ်းသုံးကြည့်ဖို့လည်းမမေ့ကြနဲ့နော် Developer ကြီးတို့ရေ 👀

#creative_coder_myanmar
https://www.facebook.com/100064708297617/posts/pfbid02UD8iMqFWA6WZpme1x3yLBYUtfvz7A4Qr6Yid1P1Eev1adrrXZg4R93swb7MRufMbl/

PHP Laravel Zoom Class လေးနောက်ဆုံး ကျောင်းသား ၄ ယောက်သာ ထပ်လိုပါမယ်ခင်ဗျာ။🚀

- One by One Meeting နဲ့စာမေးနိုင်ခြင်း
- စဉ်းစားပုံနဲ့ Why Question တွေ အဓိက သွားသော သင်ကြားမှူ ပုံစံ
- Real World Project Base Learning နဲ့သွားမှာဖြစ်လို့ နောက်မကျစေနဲ့နော်ဗျို့။ 🚀
Creative Coder ရဲ့ အတန်းအတွက် Discussion တွေကို Telegram နဲ့ Zoom မှာ အဓိကထားပြုလုပ်သွားမှာ ဖြစ်ပါတယ်။

Creative Coder မှာ learning platform အတန်းဖြစ်စေ၊ Zoom အတန်းဖြစ်စေ တက်ရောက်နေတဲ့ကျောင်းသားတွေအတွက် လိုင်းအခက်အခဲတွေကြောင့် သင်ယူလေ့လာမှုတွေ မနှောင့်နှေးရအောင် အခုလာမည့်အတန်းများရဲ့ communication & teaching  channel အဖြစ် Telegram နဲ့ Zoom ကိုပြောင်းလဲအသုံးပြုသွားမှာ ဖြစ်ပါတယ်။

‌ကျောင်းသားတွေအနေနဲ့ telegram ကနေတစ်ဆင့် လိုင်းအခက်အခဲတွေကို စိတ်ပူစရာမလိုဘဲ ဆွေးနွေးမေးမြန်းနိုင်မှာပါ။

သက်ဆိုင်ရာအတန်းတွေအတွက် telegram group link တွေကိုလည်းမကြာခင်ပို့ပေးသွားမှာပဲဖြစ်ပါတယ်။

Update တွေကို ပိုပြီးမြန်မြန်ဆန်ဆန်သိရအောင် Creative Coder ရဲ့ telegram channel လေးကို join ထားဖို့မမေ့နဲ့နော် 👀

https://t.me/creativecodermm

#creative_coder_myanmar
Zoom အတန်းလေး စမယ့်ရက်ကို နောက်အပတ် Tuesday ပြောင်းထားပါတယ်။ Facebook & messenger အစား Telegram ကို သုံးပေးသွားမှာမို့ စီစဉ်ပေးနေတာဖြစ်လို့ပါဗျ။ အတန်းလေးကတော့ ကျောင်းသား ၁ ယောက်ပဲလိုပါမယ်ဗျ။ စိတ်ဝင်စားသူများ မှီတုန်းနောက်မကျစေနဲ့နော်ဗျို့။❤️

https://www.facebook.com/100064708297617/posts/pfbid02TrphmYi2WsrUChFQvUUWcP6p6pX1gqCoJJC7EqPK89soiGEm5cK644ZjSixPqs1Yl/
Creative coder platform မှာ ကိုယ် ဘယ် Level ရောက်နေကြပြီလဲဗျို့။ နောက်ပိုင်း Pro Level & Legendary level ထိရောက်လာရင် course လက်ဆောင်လေးတွေပေးသွားပါမယ်ဗျ။