Redux-এ দুটি মৌলিক ধারণা

Redux লাইব্রেরি অধ্যয়ন শুরু করার আগে, আসুন এর দুটি মৌলিক ধারণার সাথে পরিচিত হই। প্রথম ধারণা, যা স্টেট ম্যানেজমেন্ট সম্পর্কিত, আমরা React-এ সাধারণ একটি কাউন্টারের উদাহরণে দেখব:

function Counter() {
	// State
	const [count, setCount] = useState(0)

	// Action:
	function clickHandler() {
		setCount(count + 1)
	}

	// View:
	return (
		<div>
			<span>{count}</span>
			<button onClick={clickHandler}>+</button>
		</div>
	)
}

এই কোডে আমরা count ভেরিয়েবলের জন্য স্টেট দেখতে পাই - এটি কাউন্টারের জন্য সত্যের উৎস। তারপর আমরা দেখি একশন (action) - একটি ইভেন্ট, যা ব্যবহার자의 ক্লিকে স্টেট আপডেট করে। এবং শেষ পর্যন্ত, ভিউ (view), যার সাহায্যে আমরা ইউজার ইন্টারফেস প্রদর্শন করি।

সুতরাং স্কিমটি বেশ সহজ: বাটন ক্লিক করা হয় - count স্টেট (State) ক্লিকে (Action) পরিবর্তিত হয়, ফলে ভিউ (View) পরিবর্তিত হয় - আমাদের ক্ষেত্রে এটি স্ক্রিন上的 সংখ্যা।

যাইহোক, সবকিছু আরও জটিল হবে যদি আমাদের অনেকগুলি কম্পোনেন্ট থাকে যাদের একই স্টেট ব্যবহার করা প্রয়োজন। অবশ্যই, উদাহরণস্বরূপ, স্টেটকে প্যারেন্ট কম্পোনেন্টে তুলে নেওয়া যেতে পারে, কিন্তু এমন সমাধান সবসময় সমস্যা থেকে মুক্তি দিতে পারে না। এই ক্ষেত্রে Redux আমাদের জন্য *অ্যাপ্লিকেশনের একটি জায়গা তৈরি করার প্রস্তাব দেয়, যেখানে গ্লোবাল স্টেট থাকবে* এবং এই স্টেট আপডেট করার সময় আচরণের নির্দিষ্ট প্যাটার্ন থাকবে। এটাই প্রথম মৌলিক ধারণা (!).

দ্বিতীয় ধারণাটি ইমিউটেবিলিটি এর সাথে সম্পর্কিত, অর্থাৎ ডেটার অপরিবর্তনশীলতা। আপনি অবশ্যই JavaScript থেকে মনে রাখবেন যে অ্যারে এবং অবজেক্ট পরিবর্তন করা যায়। সরাসরি ডেটা পরিবর্তন করা Redux-এ, অন্যান্য ফ্রেমওয়ার্কের মতোই, খারাপ অভ্যাস বলে বিবেচিত হয় এবং অনPredictable ফলাফলের দিকে নিয়ে যেতে পারে। তাই Redux-এ আমাদের প্রাথমিক অবজেক্ট এবং অ্যারে অপরিবর্তিত থাকা উচিত, এবং আমরা শুধুমাত্র তাদের কপি পরিবর্তন করতে পারি।

বর্ণনা করুন, Redux-এর প্রথম মৌলিক ধারণা কী।

বর্ণনা করুন, Redux-এর দ্বিতীয় মৌলিক ধারণা কী।