"𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐌𝐲𝐚𝐧𝐦𝐚𝐫 𝐓𝐞𝐥𝐞𝐠𝐫𝐚𝐦 channel လေး Join ပေးတာကျေးဇူးပါခင်ဗျာ 📢"
========================================

ကဲ မိတ်ဆွေတို့ရေ ကျွန်တော်တို့ရဲ့ Creative Coder Myanmar က Telegram မှာလည်းရှိနေပြီဖြစ်တဲ့အတွင် သင်တန်းအကြောင်းအရာတွေ Knowledge Sharing Contents တွေကို Telegram ကနေလည်းဖတ်ရှုနိုင်တော့မှာဖြစ်ပါတယ်။
မိတ်ဆွေတို့အားလုံးကို အောက်ပါ Telegram Channel လေးကို join ပေးဖို့ တခြား မိတ်ဆွေတွေ လဲ ပြောပေးမို့ဖိတ်ခေါ်ပါတယ်။

👉 https://t.me/creativecodermm

မိတ်ဆွေတို့အတွက် အကောင်းဆုံးတွေကိုသာပေးဖို့ရည်ရွယ်ထားတာဖြစ်တဲ့အတွက် နောင်များမှာလည်း ဘယ်လိုအကြောင်းအရာတွေလာဦးမလဲဆိုတာ ဆက်လက်စောင့်ကြည့်ပေးကြပါဦးနော် 👀

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐎𝐟𝐟𝐜𝐢𝐚𝐥 𝐖𝐞𝐛𝐬𝐢𝐭𝐞 ⬇
https://creativecodermm.com/

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐘𝐨𝐮𝐭𝐮𝐛𝐞 𝐂𝐡𝐚𝐧𝐧𝐞𝐥 ⬇
https://www.youtube.com/c/CreativeCoderMyanmar

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐋𝐢𝐧𝐤𝐞𝐝𝐢𝐧 ⬇
https://www.linkedin.com/company/creative-coder-myanmar/

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐌𝐲𝐚𝐧𝐦𝐚𝐫 𝐆𝐢𝐭𝐇𝐮𝐛 ⬇
https://github.com/Creative-Coder-Myanmar

#Creative_Coder_Myanmar
#developer
#website
#telegram

𝐂𝐮𝐬𝐭𝐨𝐦 𝐇𝐨𝐨𝐤 (𝐑𝐞𝐚𝐜𝐭 𝐇𝐨𝐨𝐤 𝐒𝐞𝐫𝐢𝐞𝐬)

====================================

React မှာသုံးတဲ့ Custom hook function ကတော့ use keyword နဲ့စပြီး အခြား built-in function တွေကို ပြန်ခေါ်ချင်တဲ့အခါမှာသုံးလို့ရပါတယ်။ အခြား state တွေနဲ့ ဆက်စပ်နေတဲ့ logic တွေကို Component တွေကြားမှာ share ပြီးသုံးလို့ရအောင်ပြုလုပ်ပေးထားပါတယ်။

Custom Hook ရဲ့ code example လေးကိုကြည့်လိုက်ကြရအောင် 👀

import React, { useState, useEffect } from 'react';

function useWindowWidth() {
  const [width, setWidth] = useState(window.innerWidth);

  useEffect(() => {
    const handleResize = () => setWidth(window.innerWidth);
    window.addEventListener('resize', handleResize);
    return () => {
      window.removeEventListener('resize', handleResize);
    };
  }, []);

  return width;
}

function Example() {
  const width = useWindowWidth();

  return (
    <div>
      <p>Window width: {width}</p>
    </div>
  );
}

ဒီ code example ထဲမှာဆိုရင် useWindowwidth ဆိုတဲ့ hook က useState နဲ့ useEffect hook ကို window ရဲ့ width ကို track လုပ်ဖို့နဲ့ update လုပ်ဖို့ အသုံးပြုထားတာဖြစ်ပါတယ်။ 'Example' Component ကတော့ 'useWindowWidth'ကိုအသုံးချပြီး လက်ရှိ window ရဲ့ width ကိုယူထားတာဖြစ်ပါတယ်။

Maintainable ဖြစ်တဲ့ code တွေအတွက် custom hook ကို complex state တွေကို encapsulation လုပ်တဲ့နေရာမှာရော logic တွေကိုပြန်ပြီးအသုံးချတဲ့နေရာမှာပါ အသုံးပြုနိုင်ပါတယ်။

React အတန်းလေးကလည်းလူပြည့်ဖို့ သုံးယောက်ပဲလိုတာဖြစ်တဲ့အတွက် အမြန်လေးလာအပ်ထားမှစိတ်ချရမယ်နော်

Creative Coder Myanmar Telegram Channel ⬇️
https://t.me/creativecodermm

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐎𝐟𝐟𝐜𝐢𝐚𝐥 𝐖𝐞𝐛𝐬𝐢𝐭𝐞 ⬇
https://creativecodermm.com/

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐘𝐨𝐮𝐭𝐮𝐛𝐞 𝐂𝐡𝐚𝐧𝐧𝐞𝐥 ⬇
https://www.youtube.com/c/CreativeCoderMyanmar

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐋𝐢𝐧𝐤𝐞𝐝𝐢𝐧 ⬇
https://www.linkedin.com/company/creative-coder-myanmar/

𝐂𝐫𝐞𝐚𝐭𝐢𝐯𝐞 𝐂𝐨𝐝𝐞𝐫 𝐌𝐲𝐚𝐧𝐦𝐚𝐫 𝐆𝐢𝐭𝐇𝐮𝐛 ⬇
https://github.com/Creative-Coder-Myanmar

#Creative_Coder_Myanmar
#developer
#website
#react
#hook