আসুন শুরু করি

এই পৃষ্ঠাটিতে React এর ডকুমেন্টেশন ও এই সম্পর্কিত বিভিন্ন রিসোর্স এর সারমর্ম দেয়া আছে।

React একটি জাভাস্ক্রিপ্ট লাইব্রেরী, যা দ্বারা ইউজার ইন্টারফেস বানানো যায়। React কি তা শিখতে আমাদের হোমপেজ অথবা আমাদের টিউটোরিয়াল পৃষ্ঠাটি দেখুন।


React চেষ্টা করে দেখুন

React ডিজাইন করা হয়েছে ধীরে ধীরে গ্রহণ যোগ্যতার সাথে মানিয়ে নেয়ার জন্য। আপনি আপনার প্রয়োজনে যতটুকু দরকার ঠিক ততটুকু React ব্যবহার করতে পারেন। আপনি যেভাবে খুশি React এর স্বাদ নিতে পারেন, চাইলে একটি HTML ডকুমেন্টে React ব্যবহার করতে পারেন আবার চাইলে জটিল ও বড় কোন প্রোজেক্টে React ব্যবহার করে দেখতে পারেন। নিচের লিঙ্কগুলো আপনাকে শুরু করতে সহায়তা করবে।

অনলাইন প্লেগ্রাউন্ড

আপনি যদি React এ হাত পাকাতে চান, তাহলে কোন অনলাইন কোড প্লেগ্রাউন্ড ব্যবহার করতে পারেন। CodePen, CodeSandbox, অথবা Glitch এ একটি হ্যালো ওয়ার্ল্ড টেমপ্লেট লিখে চেষ্টা করুন।

আপনি যদি আপনার নিজস্ব টেক্সট এডিটর ব্যবহার করতে স্বাচ্ছন্দ্যবোধ করেন তাহলে এখান থেকে এই HTML ফাইলটি ডাউনলোড করুন, এটি পরিবর্তন বা পরিবর্ধন করতে পারেন। এবার লোকাল ফাইল সিস্টেম থেকে আপনার পছন্দের ব্রাউজারে ফাইলটি খুলুন। এই প্রক্রিয়ায় রান টাইম কিছুটা ধীর গতির হয় তাই আমরা শুধুমাত্র সাধারণ ডেমোতেই এটি ব্যবহার করার পরামর্শ দিয়ে থাকি।

আপনার ওয়েবসাইটে React যুক্ত করুন

আপনি চাইলে মাত্র এক মিনিটে আপনার বর্তমান HTML ডকুমেন্টে React যুক্ত করতে পারেন। আপনি ইচ্ছে করলে ধীরে ধীরে এর ব্যবহার বৃদ্ধি করতে পারেন অথবা এটি সামান্য কিছু ডাইনামিক উইজেট এর ব্যাবহারের মধ্যেই সীমাবদ্ধ রাখতে পারেন।

একটি নতুন React App তৈরি করুন

আপনি যখন React দিয়ে কোন প্রোজেক্ট শুরু করতে চান, তখন একটি সিম্পল HTML ডকুমেন্টের সাথে script tags ব্যবহার করে মাত্র এক মিনিটেই একটি নতুন React App তৈরি করতে পারেন।

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

React শিখুন

বিভিন্ন পটভূমির মানুষ React শিখতে আসছে এবং তাদের শিখার ধরনেও ভিন্নতা রয়েছে। আপনি তাত্ত্বিক বা ব্যাবহারিক যে ভাবেই শিখতে পছন্দ করুন না কেন, আমরা আশা করছি এই অনুচ্ছেদ টি আপনার জন্য সহায়ক হবে।

  • আপনি যদি কোন কিছু তৈরি করার মাধ্যমে শিখা শুরু করতে চান, তাহলে আমাদের এই ব্যাবহারিক টিউটোরিয়াল টি দিয়ে শুরু করতে পারেন।
  • আপনি যদি ধাপে ধাপে স্বচ্ছ ধারণা সহকারে শিখতে চান, তাহলে আমাদের মেইন কনসেপ্ট গাইড টি পড়া শুরু করুন।

অন্যান্য সব নতুন বা অপরিচিত টেকনোলজির মত React এর ও একটি শেখার কার্ভ রয়েছে। একটু সময় নিয়ে ধীরস্থির ভাবে অনুশীলন করতে পারলে আপনিও এটাতে দক্ষ হয়ে উঠবেন।

প্রথম উদাহরণ

আমাদের React হোমপেজ এ কিছু ছোট ছোট React এর উদাহরণ আছে এবং সাথে লাইভ এডিটর ও আছে। আপনি যদি এই মুহূর্তে React সম্পর্কে কিছু নাও জেনে থাকেন তবুও আপনি কোড গুলো পরিবর্তন করে ফলাফল দেখুন কি থেকে কি হচ্ছে।

বিগিনারদের জন্য React

আপনার যদি মনে হয় React এর ডকুমেন্টেশন একটু বেশি দ্রুত এক টপিক থেকে আরেক টপিকে চলে যাচ্ছে। তাহলে আপনি Tania Rascia এর লেখা ওভারভিউ অফ React এই আর্টিকেল টি দিয়ে শুরু করতে পারেন। এখানে React এর গুরুত্বপূর্ণ বিষয় গুলো বিস্তারিত আলোচনা করা হয়েছে। আপনি এই আর্টিকেল টি পড়া শেষ করে অফিশিয়াল ডকুমেন্টেশনে আরেকবার চেষ্টা করে দেখুন।

ডিজাইনার দের জন্য React

আপনি যদি ডিজাইন প্রফেশন থেকে React শিখতে এসে থাকেন তাহলে এই রিসোর্স গুলো আপনাকে React শিখতে ভীষণ ভাবে সাহায্য করবে।

জাভাস্ক্রিপ্ট রিসোর্স সমূহ

React এর ডকুমেন্টেশনে আমরা আশা করি যে আপনি জাভাস্ক্রিপ্ট প্রোগ্রামিং ল্যাঙ্গুয়েজ সম্পর্কে ধারণা রাখেন। আপনাকে React শিখার জন্য জাভাস্ক্রিপ্ট প্রোগ্রামিং ল্যাঙ্গুয়েজে দক্ষ না হলেও চলবে, তবে একই সাথে জাভাস্ক্রিপ্ট ও React শিখা অনেক টা কষ্টকর।

আমরা আপনাকে প্রথমে মোজিলা ডেভেলপার নেটওয়ার্ক থেকে জাভাস্ক্রিপ্ট সম্পর্কে আপনার লেভেল যাচাইয়ের পরামর্শ দিচ্ছি। এ জন্য আপনার ১ ঘণ্টা ৩০ মিনিটের মত সময় লাগতে পারে, কিন্তু এর পর আপনার জন্য React শিখা অনেক সহজ হয়ে যাবে।

পরামর্শ

আপনি যখনি জাভাস্ক্রিপ্ট সম্পর্কিত কোন সমস্যায় পড়বেন তখন মোজিলা ডেভেলপার নেটওয়ার্ক এবং javascript.info এই দুইটি ওয়েবসাইটে খুঁজে দেখুন। এই দুইটা ওয়েবসাইট জাভাস্ক্রিপ শিখার জন্য খুবই কাজের। এছাড়াও আমাদের কমিউনিটি সাপোর্ট ফোরামে আপনার কাঙ্ক্ষিত প্রশ্ন টি করে সাহায্য পেতে পারেন।

ব্যাবহারিক টিউটোরিয়াল

আপনি যদি ব্যাবহারিক কাজের মাধ্যমে শিখতে পছন্দ করেন। তাহলে আপনি আমাদের ব্যাবহারিক টিউটোরিয়াল সিরিজ টি দেখতে পারেন। এই টিউটোরিয়ালে আপনি একটি টিক-ট্যাক-টো গেম তৈরি করতে পারবেন React ব্যবহার করে। আপনি চাইলে এই অংশ টা এড়িয়ে যেতে পারেন। কারণ আপনি আসলে গেম বানানোর জন্য React শিখতে আসেননি নিশ্চয়। কিন্তু একবার চেষ্টা করে দেখলে খারাপ হয় না মনে হয়। এই টিউটোরিয়াল এ যে টেকনিক গুলো শিখবেন তা আপনার যে কোন React অ্যাপস বানাতে মৌলিক জ্ঞান হিসেবে কাজে লাগবে। আর এই বিষয়ে গভীর জ্ঞান অর্জনে ব্যাপক ভাবে সহায়ক হবে।

ধাপ-বাই-ধাপ গাইড

আপনার পড়ার ধরন যদি হয়, যেকোনো বিষয় বইয়ের মত করে ধাপে ধাপে শিখতে ভালো লাগে। তাহলে আপনি আমাদের মূল কনসেপ্ট গাইড থেকে ধাপে ধাপে প্রতিটি কনসেপ্ট শিখতে পারেন। এই গাইডের প্রতিটি অধ্যায়ে আগের অধ্যায়ে শিখা বিষয় গুলো নিয়ে আলোচনার মাধ্যমে ধীরে ধীরে আগানো হয়েছে। তাই আপনি এখান থেকে React শিখলে কোন কিছু মিস করার সম্বভাবনা নাই।

React এ চিন্তা করা

অনেক React ব্যবহারকারি React এ চিন্তা করা এই সেকশন টি পড়া কে গুরুত্ব দিয়েছেন এবং কারন হিসেবে দেখিয়েছেন যে এই সেকশন টি তাদের কে সহজে React শিখতে সাহায্য করেছে। এই সেকশন টি তাদেরকে ফাইনালি “clicked” মোমেন্ট এনে দিয়েছে। সম্ভবত এটি React এর পুরনো ভার্সনের জন্য ছিল কিন্তু এখনো বেশ কার্যকারী।

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

অ্যাডভান্সড কনসেপ্ট

আপনি একবার মেইন কনসেপ্ট এর সাথে স্বাচ্ছন্দ্য বোধ করতে শুরু করলে এবং React দিয়ে বেশ কিছু কোড লিখার পর আপনার আরও অ্যাডভান্সড টপিক সম্পর্কে জানতে আগ্রহ হবে। এই অনুচ্ছেদে আপনি React এর অনেক শক্তিশালী কিন্তু কম ব্যবহার হয় এমন সব ফিচার সম্পর্কে জানতে পারবেন। যেমন কনট্যাক্স এবং refs

এপিআই রেফারেন্স

এই ডকুমেন্টেশন সেকশন টি আপনার জন্য React এর এপিআই সমূহ বিস্তারিত ভাবে শিখতে সাহায্য করবে। উদাহরণ স্বরূপ React.Component এপিআই রেফারেন্স এই লিঙ্কে আপনি জানতে পারবেন কিভাবে setState() কাজ করে এবং ইহা React এর লাইফ সাইকেল মেথড গুলো সম্পর্কেও বুঝতে সাহায্য করবে।

শব্দকোষ(গ্লসারি) এবং FAQ

এই শব্দকোষ বা গ্লসারি পেজটিতে React ডকুমেন্টেশনের কমন বিষয় সমুহের একটি সুন্দর সারমর্ম আছে। এছাড়াও একটি FAQ অনুচ্ছেদ আছে, যেখানে আপনি আপনার কাঙ্ক্ষিত কমন প্রশ্ন সমুহের উত্তর পেতে পারেন। যেমন ধরুন একটি AJAX রিকুয়েস্ট কিভাবে দিতে হয়, কম্পোনেন্ট স্টেট কি বা React প্রোজেক্টে ফাইল এর গঠন কেমন হতে পারে এগুলো জানতে পারবেন।

নতুন নতুন তথ্য পেতে সঙ্গে থাকুন

React ব্লগ হচ্ছে React টিমের আপডেট পাওয়ার অফিশিয়াল সোর্স। যেকোনো গুরুত্বপূর্ণ তথ্য, React এর রিলিজ নোট বা deprecation নোটিশ সহ যাবতীয় গুরুত্বপূর্ণ তথ্য এখানেই প্রথমে পোস্ট করা হয়ে থাকে।

আপনি চাইলে React টিমের অফিশিয়াল টুইটার প্রোফাইলও ফলো করতে পারেন, তবে অফিশিয়াল ব্লগ ফলো করলে কোন প্রয়োজনীয় তথ্যই মিস হবে না।

প্রতিটি React রিলিজ নোটের জন্যই ব্লগ পোস্ট লেখার প্রয়োজন পড়ে না কিন্তু আপনি এ বিষয়ে React রিপোজিটোরির changelog পৃষ্ঠাটি থেকে প্রতিটি রিলিজ সম্পর্কে বিস্তারিত জানতে পারবেন। এছাড়াও রিলিজ পৃষ্ঠাটিতেও এ বিষয়ে বিস্তারিত দেয়া থাকে।

ভার্শন ডকুমেন্টেশন

এই ডকুমেন্টেশন টিতে সর্বদা লেটেস্ট React এর স্থিতিশীল ভার্শন কে অনুসরণ করা হয়। React ১৬ এর পর থেকে আপনি পুরনো ডকুমেন্টেশন সমুহ দেখতে পারবেন একটি আলাদা পৃষ্ঠা থেকে। মনে রাখবেন যে এই ডকুমেন্টেশন সমুহ React এর পূর্ববর্তী ভার্শন সমূহের রিলিজের সময় snapshot নেয়া হয়েছিল এবং এগুলো পরবর্তীতে আর আপডেট করা হয়নি।

কোন কিছু কি বাদ পড়েছে?

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