Next.js কি?

Next.js হলো একটি React ফ্রেমওয়ার্ক, মানে এটি React-এর উপর ভিত্তি করে তৈরি, এবং এই ফ্রেমওয়ার্ক দিয়ে ফুল-স্ট্যাক ওয়েব অ্যাপ্লিকেশন (frontend + backend) তৈরি করা যায়। এই ফ্রেমওয়ার্ক আমাদেরকে অতিরিক্ত কিছু ফিচার আর অপটিমাইজেশন দিয়ে থাকে ।

কিভাবে কাজ করে:

১. React Components দিয়ে UI বানানো:
Next.js-এর মাধ্যমে আমরা React Components ব্যবহার করে ইউজার ইন্টারফেস (UI) বানাই। মানে, যে জিনিসগুলো ইউজার দেখতে পাবে, সেগুলো তৈরি করা হয় React দিয়ে।

২. বিল্ট-ইন টুলিং:
Next.js-এর ভেতরে এমন কিছু বিল্ট-ইন টুলস আছে, যেমন bundler (যেটা ফাইলগুলো একসাথে করে), compiler (যেটা কোডকে যেভাবে দরকার সেভাবে কনভার্ট করে)। এই কারণে আমাদের আলাদা করে এগুলো সেটআপ করতে হয় না।

৩. SEO এবং পারফরম্যান্স:
Next.js সার্ভার সাইড রেন্ডারিং (SSR) এবং স্ট্যাটিক সাইট জেনারেশন (SSG) সাপোর্ট করে। এর ফলে ওয়েবসাইটট সার্চ ইঞ্জিনে (Google, Bing) ভালো পারফর্ম করে এবং খুব দ্রুত লোড হয়।

৪. API Routes:
Next.js-এ API Routes ফিচার আছে, যেটার মাধ্যমে আপনি সরাসরি ব্যাকএন্ডের কাজ করতে পারেন। আলাদা সার্ভার সেটআপ করতে হয় না।

ক্লায়েন্ট সাইড রেন্ডারিং (CSR) কি ?

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

সার্ভার সাইড রেন্ডারিং (SSR) কি ?

সার্ভার সাইড রেন্ডারিং এর ক্ষেত্রে এপ্লিকেশনের কোডগুলো ব্রাউজারে আসার আগে সার্ভারে আগে একবার রান হয়। সার্ভার তার ভিতরে একটা ব্রাউজারকে সিমুলেট করে,সেখানে সমস্ত কোডগুলোকে একবার করে রান করে একটা html,css,javascript আকারে ব্রাউজারে পাঠিয়ে দেয়। এতে করে ব্রাউজারে যখন আসে তখন একেবারে সমস্ত html এবং css লোড হয়ে যায়, এবং একবার সমস্ত html এবং css লোড হয়ে যাওয়ার পর Hydration এর মাধ্যমে সাইটে জাভাস্ক্রিপ্ট এড হয়ে পেজ ইন্টারেক্টিভ হয়। এতে যখনি গুগুল বট সাইটে আসে,তখন সে সাইটে কন্টেন্ট পেয়ে যাবে। এতে করে SEO টা ইম্প্রুভ হবে।

সার্ভার কম্পোনেন্ট (React Server Component) কি?

রিয়াক্টের সার্ভার কম্পোনেন্ট যেটা করে, সে পুরো এপ্লিকেশনের সমস্ত কম্পোনেন্টগুলোকে প্রয়োজন অনুযায়ি ক্লাইন্ট সাইড এবং সার্ভার সাইড রেন্ডারিং করতে পারে। এক্ষেত্রে যেসব কম্পোনেন্টে কোন ধরনের ইন্টারেকশন,বা ব্রাউজার রিলেটেড কোন কিছু নেই সেগুলোকে সে সার্ভারে রান করে স্টাটিক কন্টেন্ট হিসেবে জেনারেট করে রাখে, এবং যেসব কম্পোনেন্টে ইন্টারেকশন প্রয়োজন সেগুলোকে সে ক্লাইন্ট সাইডে রেন্ডার করে।