ডিক্লারেটিভ
React ঝামেলাহীনভাবে ইন্টারেক্টিভ UI তৈরি করে। আপনি আপনার অ্যাপ্লিকেশনের প্রতিটি ষ্টেটের জন্য সহজ ভিউ ডিজাইন করুন, এবং যখনই আপনার ডেটা পরিবর্তন হবে React দক্ষতার সাথে সঠিক কম্পোনেন্টটি আপডেট এবং রেন্ডার করবে।
ডিক্লারেটিভ ভিউ আপনার কোডকে আরো সহজবোধ্য এবং সহজে ডিবাগযোগ্য করে তোলে।
কম্পোনেন্ট-ভিত্তিক
এটি এনক্যাপ্সুলেটেড কম্পোনেন্ট তৈরি করতে পারে যেগুলো নিজেরাই নিজেদের স্টেট পরিচালনা করে, অতঃপর তাদের একত্রিত করে জটিল UI গঠন করে।
যেহেতু কম্পোনেন্টের লজিক টেমপ্ল্যাটের পরিবর্তে জাভাস্ক্রিপ্টে লিখা হয়েছে, আপনি সহজেই আপনার অ্যাপের মাধ্যমে সমৃদ্ধ ডেটা পাঠাতে পারেন এবং স্টেটকে DOM থেকে পৃথক রাখতে পারেন।
একবার শিখুন, যে কোন স্থানে লিখুন
আমরা আপনার বাকি প্রযুক্তি স্ট্যাকের উপর নির্ভর করি না, এজন্য আপনি বর্তমান কোডে কোন পরিবর্তন ছাড়াই React দিয়ে নতুন ফিচার তৈরি করতে পারেন।
Node ব্যবহার করে আপনি সার্ভারেও React রেন্ডার করতে পারেন এবং এটি React Native দিয়ে মোবাইল অ্যাপ্স তৈরিতেও সাহায্য করে।
একটি সহজ কম্পোনেন্ট
React কম্পোনেন্ট একটি render() মেথড তৈরি করে যা ইনপুট ডেটা নেয় এবং কী দেখাতে হবে তা প্রদান করে। এই উদাহরণটি JSX নামে একটি XML এর মত সিনট্যাক্স ব্যবহার করেছে। কম্পোনেন্টটে যেই ইনপুট ডেটাই দেওয়া হয়, তা this.props এর মাধ্যমে render() মেথডের ভেতরে ব্যবহার করা যায়।
JSX একটি অপশনাল সিনট্যাক্স এবং এটি React এ ব্যবহার করা আবশ্যিক নয়। JSX এর কম্পাইলেশন ধাপে, যেই জাভাস্ক্রিপ্ট তৈরি হয়, Babel REPL ব্যবহার করে আপনি তা পর্যবেক্ষণ করতে পারেন।
Loading code example...
একটি স্টেটযুক্ত কম্পোনেন্ট
ইনপুট ডেটা নেওয়ার পাশাপাশি (this.props এর মাধ্যমে) কম্পোনেন্ট অভ্যন্তরীণ স্টেট ডেটাও ধরে রাখতে পারে(this.state এর মাধ্যমে)। যখন একটি কম্পোনেন্ট এর স্টেট ডেটা পরিবর্তিত হয়, রেন্ডার করা মার্কআপ পুনরায় render() মেথডে পাঠিয়ে আপডেট করা হয়।
Loading code example...
একটি অ্যাপ্লিকেশন
props এবং state একত্রে ব্যবহার করে, আমরা একটি ছোটো TODO অ্যাপ্লিকেশন বানাতে পারি। এই উদাহরণটি TODO আইটেমের বর্তমান তালিকা এবং ইউজার যা লিখেছে তা ধরে রাখার জন্য state ব্যবহার করে। যদিও ইভেন্ট হ্যান্ডলারগুলি ইনলাইনে রেন্ডার হয় বলে মনে হয়, আসলে তারা ইভেন্ট ডেলিগেশনের মাধ্যমে সংগৃহীত এবং ব্যবহৃত হয়।
Loading code example...
বাহিরের প্লাগইন ব্যবহার করা একটি কম্পোনেন্ট
React অন্যান্য লাইব্রেরী এবং ফ্রেমওয়ার্কের সাথে সহজেই যুক্ত হতে পারে। এই উদাহরণটি remarkable নামে একটি বাহিরের মার্কডাউন লাইব্রেরী ব্যবহার করেছে, যেটি <textarea> এর মান সরাসরি পরিবর্তন করতে পারে।