Functional Component লেখার নিয়ম এবং এর ব্যবহার

  React এ ফাংশনাল কম্পোনেন্ট হলো ক্লাস সিনট্যাক্সের পরিবর্তে জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করে কম্পোনেন্ট লেখার সবচেয়ে সহজ উপায়। নিম্নে কিভাবে...

 

React এ ফাংশনাল কম্পোনেন্ট হলো ক্লাস সিনট্যাক্সের পরিবর্তে জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করে কম্পোনেন্ট লেখার সবচেয়ে সহজ উপায়। নিম্নে কিভাবে React এ সহজে Functional Component তৈরি করতে হয় তার একটি উদাহরণসহ বর্ণনা দেওয়া হলো –

import React from "react";

function MyFunctionalComponent(props) {
  return (
    <div>
      <h1>Hello, {props.name}! I'm a functional component with props.</h1>
    </div>
  );
}

export default MyFunctionalComponent;

উপরের উদাহরণ বিশ্লেষণঃ

প্রথমে, React লাইব্রেরী থেকে React কে import করেছি, যা JSX নিয়ে কাজ করতে সুযোগ প্রদান করে। (JSX নিয়ে বিস্তারিত এখানে)। তারপর একটি জাভাস্ক্রিপ্টের Arrow Function ব্যবহার করে “MyFunctionalComponent” নামে একটি ফাংশনাল কম্পোনেন্ট ডেক্লেয়ার করা হয়েছে এবং ফাংশনটি Argument হিসাবে একটি প্রপস নেয়, যার মাধ্যমে কম্পোনেন্টে ডাটা আদান প্রদান করা যায়। তারপর ফাংশনের ভিতরে কম্পোনেন্টের গঠণ বর্ণনা করে JSX কে return করি। পরিশেষে, তৈরিকৃত কম্পোনেন্টটি export করা হয়েছে যাতে করে এ্যাপ্লিকশনের অন্য কোনো জায়গায় বা কম্পোনেন্টে ব্যবহার করা যায়।

 

এছাড়াও, তৈরিকৃত ফাংশনাল কম্পোনেন্টটি অন্য কম্পোনেন্টে ব্যবহার করার নমুনা –

import React from 'react';
import MyFunctionalComponent from './MyFunctionalComponent';

function App() {
  return (
    <div>
      <h1>Welcome to notesaid24!</h1>
      <MyFunctionalComponent name="Developer" />
    </div>
  );
}
export default App;

যদিও ফাংশনাল কম্পোনেন্ট এ state management এবং lifecycle method নিয়ে কাজ করা যায় না, যা একটি অসুবিধারও বটে। তবে, react এর ১৬.৮ ভার্সনে Hook এর আগমন ঘটে, যার ফলে React এ্যাপ্লিকেশনে State management এবং lifecycle method এর কার্যক্রমগুলো useState() এবং useEffect() হুক এর মাধ্যমে অতি সহজে পরিচালনা করা যায়।

 

আশা করি আপনি আজকের এই ব্লগটি মনোযোগ সহকারে পড়েছেন। আজকের ব্লগটি আপনার কাছে কেমন লেগেছে অবশ্যই  কমেন্ট করে জানাবেন, আর যদি কোন ভূল হয়ে থাকে তাহলে ক্ষমা সুন্দর দৃষ্টিতে দেখবেন এবং কোথায় ভূল হয়েছে কমেন্ট করে জানাবেন। পোষ্টে উল্লিখিত কোনো অংশ যদি বুঝতে সমস্যা হয়, তাহলে কমেন্ট বক্সে জানিয়ে দিন। ইনশাআল্লাহ্‌, সমস্যা সমাধানের চেষ্টা করবো। আর ওয়েবসাইটটি বন্ধুদের মাঝে শেয়ার করবেন। আজকের মতই এখানেই বিদায় নিলাম, ইনশাআল্লাহ দেখা হবে অন্য কোন ব্লগে। ভালো থাকবেন সুস্থ থাকবেন। আল্লাহ হাফেয।