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

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

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

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

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

useContext Hook ဆိုတာကတော့ component တွေကြားထဲမှာ data တွေ sharing လုပ်တဲ့အခါ component tree ရဲ့ဘယ်နေရာမှာပဲရှိနေနေ property တွေို သုံးစရာမလိုဘဲ data တွေကို sharing လုပ်ပေးနိုင်တဲ့ hook တစ်ခုပဲဖြစ်ပါတယ်။
useContext Hook ကိုအသုံးပြုဖို့အတွက်ဆိုရင် create context function ကိုသုံးပြီး context object တစ်ခုဖန်တီးပေးဖို့လိုအပ်ပါတယ်။ဒီ context object ကိုသုံးပြီး context တွေကို component tree ထဲကို wrap လုပ်ပေးမဲ့ Provider Component တစ်ခုကိုဖန်တီးလို့ရနိုင်မှာပဲဖြစ်ပါတယ်။

React Component ထဲမှာ useContext Hook ကိုထည့်သုံးထားတဲ့ example လေးကိုကြည့်လိုက်ရအောင် 👀

import React, { useContext } from 'react';
import { MyContext } from './MyContext';

function MyComponent() {
const { data } = useContext(MyContext);

return (
<div>
<h1>{data.title}</h1>
<p>{data.description}</p>
</div>
);
}

ဒီ example လေးမှာဆိုရင် MyComponent လို့နာမည်ပေးထားတဲ့ functional component တစ်ခုက useContext Hook ကိုသုံးပြီး data ‌တွေကို MyContext လို့နာမည်ပေးထားတဲ့ Provider Component ကနေတစ်ဆင့် consume လုပ်သွားတာကိုတွေ့ရမှာဖြစ်ပါတယ်။ useContext Hook ကိုအသုံးပြုမယ်ဆိုရင် ပိုပြီး flexible ဖြစ် reusable လည်းဖြစ်တဲ့ component တွေကို ဖန်တီးနိုင်မှာဖြစ်ပါတယ်။ ဒါ့အပြင် data တွေကို access ရယူတဲ့နေရာမှာလည်း prop တွေအပေါ် မှီခိုစရာမလိုတော့ဘဲ ရယူနိုင်မှာဖြစ်ပါတယ်။

global state တွေဖြစ်တဲ့ user authentication state တွေ manage လုပ်တဲ့နေရာမှာရော Theme State တွေမှာရော useContext Hook ကိုအသုံးပြုနိုင်ပါတယ်။

useContext Hook ကိုမသုံးဖူးဆိုရင် component တွေကနေတစ်ဆင့် data တွေကိုရယူတဲ့နေရာမှာ prop တွေကို သုံးရမှာပါ။ ကြာလာတဲ့အခါမှာ application ကပိုပြီး complex ဖြစ်လာရင်ထိန်းချုပ်ရတာခက်ခဲလာနိုင်ပါတယ်။
useContext ကိုအသုံးပြုခြင်းဖြင့်ဒီလို ပြဿနာတွေကိုရှောင်ရှားနိုင်ပြီး code ကိုလည်း maintain လုပ်ရတာပိုပြီးလွယ်ကူစေပါတယ်။

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

ဒီလို React ရဲ့ Hook တွေအကြောင်းစုံစုံလင်လင်ရှင်းပြပေးမဲ့ 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

𝐮𝐬𝐞𝐑𝐞𝐝𝐮𝐜𝐞𝐫 𝐇𝐨𝐨𝐤 (𝐑𝐞𝐚𝐜𝐭 𝐇𝐨𝐨𝐤 𝐒𝐞𝐫𝐢𝐞𝐬)
======================================

React Hook Series ထဲမှာပါ၀င်တဲ့ useReducer Hook အကြောင်းကိုကြည့်လိုက်ရအောင် 👀

Redux Library နဲ့ဆင်တူတဲ့ popular state management library တစ်ခုဖြစ်ပါတယ်။useState Hook မှာတုန်းက state တစ်ခုချင်းစီကို manage လုပ်ဖို့သုံးပေမဲ့ useReducer Hook ကတော့ complex state တွေကို manage လုပ်ဖို့အသုံးပြုရတဲ့ powerful hook တစ်ခုပဲဖြစ်ပါတယ်။
 useReducer Hook မှာ argument နှစ်ခုပါ၀င်ပြီး ပထမတစ်ခုက reducer function နဲ့နောက်တစ်ခုက initial state value တို့ဖြစ်ပါတယ်။ reducer function က action တွေပေါ်မူတည်ပြီး state တွေကို update လုပ်ပေးမှာဖြစ်ပြီး initial value တွေကတော့ initial state value တွေကိုဖော်ပြပေးမှာပဲဖြစ်ပါတယ်။

useReducer Hook ကိုအသုံးပြုပြီးရေးထားတဲ့ code Example လေးတွေကိုကြည့်လိုက်ရအောင်

import React, { useReducer } from 'react';

function Counter() {
  const initialState = { count: 0 };
  
  function reducer(state, action) {
    switch (action.type) {
      case 'increment':
        return { count: state.count + 1 };
      case 'decrement':
        return { count: state.count - 1 };
      default:
        throw new Error();
    }
  }

  const [state, dispatch] = useReducer(reducer, initialState);
  const { count } = state;

  return (
    <div>
      <h1>Count: {count}</h1>
      <button onClick={() => dispatch({ type: 'increment' })}>Increment</button>
      <button onClick={() => dispatch({ type: 'decrement' })}>Decrement</button>
    </div>
  );
}

ဒီ example လေးမှာဆိုရင် initial state က "count" ကို 0 လို့ထားထားပါတယ်။နောက်ပြီးတော့ current state နဲ့ action ကို define လုပ်ပေးတဲ့ reducer function တစ်ခုရယ် အဲ့ကနေ action ပေါ်မူတည်ပြီး new state တစ်ခုကို return ပြန်လာပေးမှာဖြစ်ပါတယ်။ reducer function မှာပါ၀င်တဲ့ action နှစ်ခုဖြစ်တဲ့ increment နဲ့ decrement တွေက count ရဲ့ value ကိုလျော့စေတိုးစေပါတယ်။ 

useReducer Hook နဲ့တွဲပြီးတော့ dispatch function ကိုလည်း user click တွေကို handle လုပ်ဖို့အသုံးပြုပါတယ်။ 
simple state တွေကို manage လုပ်ဖို့ useState hook ကိုလည်းအသုံးပြုလို့ရပေမဲ့ application ကပိုပြီး complex ဖြစ်လာတဲ့အချိန်ကျရင် useReducer Hook ကပိုပြီးအဆင်ပြေစေပါတယ်။ ကိုယ့်ရဲ့ state တွေက complex ဖြစ်လာတဲ့အခါ values တွေအများကြီးကိုတစ်ခါတည်ူ update လုပ်ဖို့လည်းလိုအပ်လာပါတယ်။ ဒီအခါမှာ state update တွေကို manage လုပ်ဖို့သေချာတဲ့နည်းလမ်းကတော့ useReducer Hook ကိုအသုံးပြုတာပါပဲ။ 

React အတန်းကလည်း လူနည်းနည်းပဲလက်ခံတော့တဲ့အတွက် နောက် batch ကိုမစောင့်ချင်ရင် အခုပဲလာအပ်လိုက်တော့နော် 👀

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

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

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

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

React ရဲ့ built-in hook တစ်ခုဖြစ်တဲ့ useRef Hook ကို component နဲ့သက်ဆိုင်တဲ့ values တွေကိုသိမ်းဆည်းဖို့ အသုံးပြုကြပါတယ်။ ဒါ့အပြင် DOM nodes တွေနဲ့ re-render လုပ်တဲ့နေရာမှာ လိုအပ်တဲ့ value တွေကိုသိမ်းဆည်းဖို့အတွက်ပါ အသုံးပြုလို့ရတဲ့အတွက် react မှာတော်တော်လေးအသုံး၀င်တဲ့ hook တစ်ခုလည်းဖြစ်ပါတယ်။

useRef Hook ကနေတစ်ဆင့် . current property ပါ၀င်တဲ့ mutable object တစ်ခုကို return ပြန်ပေးပါတယ်။ ဒီ property ထဲမှာ ဘယ် value မဆို သိမ်းဆည်းလို့ရပြီး re-render ပြန်မဖြစ်ဘဲနဲ့လည်း value ကိုပြောင်းလဲပေးနိုင်ပါတယ်။

📝useRef ကိုသုံးထားတဲ့ ပထမဆုံး case အနေနဲ့ DOM element တွေကို access လုပ်ပြီးရယူတာဖြစ်ပါတယ်။ ဒါက input field ကိုပဲ focus လုပ်ချင်တဲ့အခါ DOM တွေနဲ့တိုက်ရိုက် interact လုပ်ရတဲ့နေရာမှာ အသုံး၀င်လာမှာဖြစ်ပါတယ်။ 

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

import { useRef } from 'react';

function MyComponent() {
  const inputRef = useRef(null);

  const handleClick = () => {
    inputRef.current.focus();
  };

  return (
    <div>
      <input ref={inputRef} type="text" />
      <button onClick={handleClick}>Focus Input</button>
    </div>
  );
}

📝Previous state value တွေကို သိမ်းချင်တဲ့အခါမျိုးတွေမှာလည်း useRef Hook ကိုအသုံးပြုလို့ရပါတယ်။

Code example 👇

import { useRef, useEffect } from 'react';

function MyComponent() {
  const countRef = useRef(0);
  const previousCountRef = useRef(0);

  useEffect(() => {
    previousCountRef.current = countRef.current;
  }, [countRef.current]);

  const handleIncrement = () => {
    countRef.current++;
  };

  return (
    <div>
      <p>Current Count: {countRef.current}</p>
      <p>Previous Count: {previousCountRef.current}</p>
      <button onClick={handleIncrement}>Increment Count</button>
    </div>
  );
}

📝နောက်ဆုံးတစ်ခုအနေနဲ့ကတော့ useRef ကို computation တွေကို cache လုပ်တဲ့နေရာမှာ အသုံးပြုလို့ရနိုင်ပါတယ်။ ဒီလို အသုံးပြုခြင်းက တစ်ခါပဲ တွက်ချက်ပေးမှာဖြစ်တဲ့အတွက် expensive computation တွေကိုလည်းမဖြစ်စေပါဘူး။

import { useRef, useEffect } from 'react';

function MyComponent() {
  const resultRef = useRef(null);

  useEffect(() => {
    if (!resultRef.current) {
      // Perform an expensive computation and store the result
      const result = doExpensiveComputation();
      resultRef.current = result;
    }
  }, []);

  return (
    <div>
      <p>The result of the expensive computation is: {resultRef.current}</p>
    </div>
  );
}

useRef Hook ရဲ့ အသုံး၀င်တဲ့နေရာတွေက အများကြီးပဲဆိုတော့ developer ကြီးတို့လည်းစမ်းသုံးကြည့်ဖို့ မမေ့ကြနဲ့နော် 👀

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

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

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

React Hook Series ရဲ့ built in hook တစ်ခုဖြစ်တဲ့ useMemo Hook ကို value တွေကို memorize ဖြစ်ဖို့ရယ် ကိုယ့်ရဲ့ application ရဲ့ performance ကိုတိုးလာစေချင်တဲ့အတွက်အသုံးပြုကြပါတယ်။
Function call တွေခေါ်တဲ့အခါ caching process တွေကိုမှတ်ထားပေးတာကြောင့် နောက်တစ်ခေါက်ခေါ်တဲ့နေရာမှာလည်း same argument တွေကိုပဲအသုံးပြုပြီး ပြန်တွက်စရာမလိုဘဲ cache value ကိုသာ return ပြန်ပေးမှာဖြစ်ပါတယ်။

Code Example ကတော့

const memoizedValue = useMemo(() => {
// function to be memoized
return memoizedValue;
}, [dependencyList]);

ပထမဆုံး argument တစ်ခုဖြစ်တဲ့ useMemo က return ပြန်တဲ့အခါ value တွေကိုမှတ်မိစေဖို့အသုံးပြုပါတယ်။ second argument ကတော့ memorized value တွေပေါ်မူတည်ပြီးဖြစ်လာမဲ့ dependency array တစ်ခုပဲဖြစ်ပါတယ်။ dependency array ထဲမှာတစ်ခုခုပြောင်းလဲသွားတာနဲ့ memorize value ကိုပြန်ပြီး calculate လုပ်မှာလည်းဖြစ်ပါတယ်။

ဥပမာ item list လေးတစ်ခုကို render လုပ်ပေးမဲ့ component တစ်ခုရှိတယ်ဆိုပါစို့။ search query‌ ပေါ်မူတည်ပြီး list ကို filter လုပ်ချင်တယ်ဆိုရင် useMemo Hook ကို filter လုပ်ပြီးသား list ကိုမှတ်မိဖို့အတွက် အသုံးပြုလို့ရပါတယ်။

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

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

function ItemList({ items, searchQuery }) {
const [filteredItems, setFilteredItems] = useState(items);

useMemo(() => {
const newFilteredItems = items.filter(item => item.includes(searchQuery));
setFilteredItems(newFilteredItems);
}, [items, searchQuery]);

return (
<ul>
{filteredItems.map(item => <li key={item}>{item}</li>)}
</ul>
);
}

ဒီ example မှာဆိုရင် newfilteredItems array ကို memorize လုပ်ဖို့ useMemo Hook ကိုအသုံးပြုထားပါတယ်။ useMemo function ထဲမှာ အသုံးပြုထားတဲ့ setFilteredItems ကိုတော့ function call ခေါ်ပြီးတာနဲ့တစ်ပြိုင်နက် new filtered items တွေရဲ့ state ကို update လုပ်ဖို့အသုံးပြုပါတယ်။ items ဒါမှမဟုတ် searchQuery မှာ ပြောင်းလဲမှုဖြစ်သွားတာနဲ့ component ရဲ့ performance ကိုတိုးစေမဲ့ useMemo Hook ကိုခေါ်ပေးမှာပဲဖြစ်ပါတယ်။

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

💬 အတန်းအပ်ဖို့နဲ့ အတန်းအကြောင်းကိုစုံစမ်းဖို့ Creative Coder Myanmar ရဲ့ page messenger ကိုအခုပဲလာရောက်စုံစမ်းနိုင်ပါပြီ။

#creative_coder
#react
#firebase
#discount

❝𝐌𝐄𝐑𝐍 𝐬𝐭𝐚𝐜𝐤 𝐂𝐨𝐮𝐫𝐬𝐞 ကိုအပ်နှံလိုက်တာနဲ့ 𝟏𝟐𝟎𝟎𝟎𝟎 တန် 𝐑𝐞𝐚𝐜𝐭+𝐅𝐢𝐫𝐞𝐛𝐚𝐬𝐞 နဲ့ 𝟒𝟎𝟎𝟎𝟎 တန် 𝐉𝐒 𝐁𝐚𝐬𝐢𝐜 𝐂𝐨𝐮𝐫𝐬𝐞 ကိုလက်ဆောင်ယူလိုက်ပါ 🎉✨❞
=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=°=

January လကုန် Promotion တစ်ခုအနေနဲ့ MERN stack Course ကိုအပ်နှံလိုက်တာနဲ့ 160000 ရှိတဲ့ အတန်းနှစ်ခုကိုအခမဲ့တက်ရောက်ခွင့်ရမှာဖြစ်ပါတယ်။

MERN stack Course လေးဟာကျောင်းသားတောင်းဆိုမှုတွေကြောင့် Course Outline တွေ‌သေချာပြင်ဆင်ပြီး ဖွင့်လှစ်ခဲ့တဲ့အတန်းလေးဖြစ်ပါတယ်။

ဒီအတန်းလေးဟာ တစ်ခါအပ်နှံပြီးတာနဲ့ တစ်သက်လုံးတက်လို့ရမှာလည်းဖြစ်ပြီး ကျွန်တော်တို့ဘက်ကနေ lifetime customer service ကိုပါ support ပေးထားပါတယ်။

ဒီ promotion package လေးမှာဆိုရင် Javascript Basic နဲ့ React Basic to Advanced ပါလက်ဆောင်ထည့်ပေးထားတဲ့အတွက် HTML, CSS သိထားတဲ့ကျောင်းသားတွေအနေနဲ့စလေ့လာရင်လည်းအဆင်ပြေစေမှာဖြစ်ပါတယ်။

ဒီ promotion လေးက MERN stack အတန်းကိုအပ်နှံပြီးသွားတဲ့ကျောင်းသားတွေအတွက်လည်း အကျုံး၀င်မှာဖြစ်ပါတယ်

ဒီ့ထက်တန်တာတောင်ဒီလောက်မတန်တော့တဲ့ Promotion လေးဖြစ်တဲ့အတွက် အခုပဲ page messenger မှာအမြန်ဆုံးလာရောက်စာရင်းပေးဖို့မမေ့ပါနဲ့နော် 🏃🌬️

သင်တန်းအကြောင်းအသေးစိတ်ကြည့်ရှုရန် >>>> https://m.facebook.com/story.php?story_fbid=pfbid02Ti14zSpMovSeuS7rqCFp9VtBHDXc3BkUkHAEX5wNyoH4FBALjLxwanbtoEHuT7Eel&id=100064708297617&mibextid=Nif5oz


#creative_coder_myanmar
#mern_stack
#react
#javascript 

Web Development ကိုအခမဲ့လေ့လာခွင့်ရမယ့် အခွင့်အရေးအတွက် (‌၈) ရက်သာကျန်ရှိပါတော့တယ် 🗓

Creative Coder ရဲ့ Zoom Class တွေဖြစ်တဲ့ Laravel နဲ့ React အတန်းများအတွက် scholarship လျှောက်ထားနိုင်ဖို့က (၈) ရက်သာကျန်ရှိတော့တာဖြစ်ပါတယ်။

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

ဒီအတန်းတွေထဲကို တက်ရောက်ဖို့အခက်အခဲရှိသူတွေအတွက် ကျွန်တော်တို့ Creative Coder ကနေ scholarship လေးစီစဉ်ပေးထားပါတယ်။

ဒီ scholarship လေးမှာပါ၀င်ဖို့ အတွက်ကို အောက်ပါ post လေးမှာ အသေးစိတ်ရေးသားထားပါတယ်
👇🏻



***တကယ် သင်တန်းတက်ရောက်ဖို့အခက်အခဲရှိသူများသာ scholarship လျှောက်ထားပေးဖို့ မေတ္တာရပ်ခံလိုပါတယ်***

#scholarship
#react
#laravel