React ইউজার ইন্টারফেস বানানোর একটি JavaScript লাইব্রেরি। PHP বা Python-এর থেকে আলাদা, এটি একটি জেনারেল-পারপাস ভাষা নয় — এটি এমন একটি টুল যা আপনার ইতিমধ্যে জানা JavaScript-এর উপর চলে, বিশেষভাবে একটি ওয়েবপেজের ইন্টারঅ্যাক্টিভ অংশগুলো বানানোর জন্য।
JavaScript DOM পাঠে, আপনি সরাসরি এলিমেন্ট খুঁজে বদলে একটি পাতা আপডেট করতে শিখেছেন — document.querySelector(...).textContent = ...। এটি একটি ছোট পরিবর্তনের জন্য ঠিকঠাক কাজ করে, কিন্তু একটি ইন্টারফেস বড় হলে — একটি শপিং কার্ট, একটি লাইভ কমেন্ট ফিড, একটি ড্যাশবোর্ড — কোন এলিমেন্ট কখন আপডেট করতে হবে তা হাতে হাতে ট্র্যাক করা সঠিকভাবে বজায় রাখা সত্যিকারভাবে কঠিন হয়ে ওঠে।
React একটি ভিন্ন পদ্ধতি নেয়: আপনি বর্ণনা করেন একটি নির্দিষ্ট ডেটার জন্য ইন্টারফেসটি কেমন দেখতে হওয়া উচিত, আর সেই ডেটা যখনই বদলায় তখন React বের করে নেয় আসল পাতাটি কীভাবে সেটার সাথে মিলিয়ে আপডেট করতে হবে। আপনি ধাপে ধাপে DOM নির্দেশনা লেখা বন্ধ করে চূড়ান্ত ফলাফলের একটি বর্ণনা লেখা শুরু করেন — এই পরিবর্তনকে সাধারণত imperative থেকে declarative UI কোডে যাওয়া বলা হয়।
একটি React ইন্টারফেস কম্পোনেন্ট দিয়ে তৈরি — ছোট, স্বয়ংসম্পূর্ণ, পুনঃব্যবহারযোগ্য অংশ, প্রতিটি পাতার একটি অংশের জন্য দায়ী। একটি প্রোডাক্ট কার্ড, একটি নেভিগেশন বার, একটি কমেন্ট, একটি বাটন — প্রতিটি নিজের একটি কম্পোনেন্ট হয়ে ওঠে, একবার বানানো আর যেখানে প্রয়োজন সেখানে পুনঃব্যবহৃত, প্রতিটিতে নিজের ডেটা বসানো।
React তৈরি হয়েছিল Facebook-এ আর 2013 সালে ওপেন-সোর্স করা হয়, আর তখন থেকে এটি ওয়েব ইন্টারফেস বানানোর সবচেয়ে ব্যাপকভাবে ব্যবহৃত টুলগুলোর একটি হয়ে উঠেছে — যা ব্যবহারিকভাবে গুরুত্বপূর্ণ ঠিক PHP-এর জনপ্রিয়তার মতোই: React দক্ষতা সরাসরি প্রচুর বাস্তব চাকরি আর বিদ্যমান কোডবেসে কাজে লাগে, আর একই মূল ধারণাগুলো মোবাইল অ্যাপ বানানোর জন্য React Native-এও ব্যবহৃত হয়।
JavaScript থেকে আসছেন
এই অংশটি ধরে নেয় JavaScript নিয়ে সত্যিকারের স্বাচ্ছন্দ্য আছে — ফাংশন, অ্যারে, অবজেক্ট, আর বিশেষভাবে ES6+ ফিচার যেমন অ্যারো ফাংশন আর ডিস্ট্রাকচারিং, সাথে পরের দিকের ডেটা-fetching পাঠের জন্য প্রমিস আর async/await। এর কোনোটা নিয়ে অনিশ্চিত থাকলে, আগে JavaScript অংশ দিয়ে একবার ঘুরে আসা ভালো — React এর সবকিছুর উপর ক্রমাগত নির্ভর করে।
পরের পাঠে আপনার মেশিনে একটি প্রকৃত React প্রজেক্ট আসলেই চালু করা হবে, যাতে এখান থেকে প্রতিটি উদাহরণ আপনি নিজে চেষ্টা করে দেখতে পারেন।