Side Effect of React

---

🔍 Side Effect মানে কী?

একটি ফাংশন যখন তার বাইরের জগতে কোনো প্রভাব ফেলে — মানে, state পরিবর্তন করে, DOM পরিবর্তন করে, API call করে, file write করে, timer set করে ইত্যাদি, তখন তাকে বলে side effect।

---

🎯 সহজ উদাহরণ:

let x = 5;

function add(a, b) {
  return a + b;
}

এই add() ফাংশনে কোনো side effect নেই, কারণ এটি শুধু ইনপুট নেয় আর রিটার্ন করে, কোনো বাইরের কিছু পরিবর্তন করে না।

---

কিন্তু নিচেরটা দেখো:

let x = 5;

function addAndChangeX(a, b) {
  x = x + a + b;
  return x;
}

এখানে x হচ্ছে ফাংশনের বাইরের একটি ভ্যারিয়েবল — ফাংশন এটাকে পরিবর্তন করছে। তাই এটা একটা side effect।

---

💡 React-এ Side Effect-এর উদাহরণ:

React-এ side effect বলতে বোঝায়:

1. Data fetch করা (API call)

2. DOM manipulation করা (যেমন title পরিবর্তন)

3. Timer set করা (setTimeout, setInterval)

4. Event listener add/remove করা

এই কাজগুলো সব করা হয় useEffect() hook এর মাধ্যমে।

---

🧠 কেন useEffect লাগে?

React-এর rendering হলো pure – মানে, rendering-এর সময় কোনো side effect হওয়া উচিত না। তাই React বলেছে:

"তুমি যদি কোনো side effect করতে চাও, সেটা useEffect() এর মধ্যে করো।"

---

🧾 সংক্ষেপে:

কাজ	Side Effect কিনা?
দুই সংখ্যার যোগফল বের করা	❌ না
API থেকে data আনা	✅ হ্যাঁ
timer চালু করা	✅ হ্যাঁ
UI-তে কিছু দেখানো	❌ না
localStorage-এ ডেটা রাখা	✅ হ্যাঁ

---