8. Next.js Dynamic Routes
📘 কনসেপ্ট (থিওরি)
আপনি যখন আগে থেকে নির্দিষ্ট সেগমেন্টের নাম জানেন না এবং ডাইনামিক ডেটা থেকে রাউট তৈরি করতে চান, তখন আপনি ডাইনামিক সেগমেন্ট (Dynamic Segments) ব্যবহার করতে পারেন।
বর্গাকার বন্ধনীর (square brackets) ভেতরে ফোল্ডারের নাম মুড়িয়ে একটি ডাইনামিক সেগমেন্ট তৈরি করা যেতে পারে:
[folderName]। উদাহরণস্বরূপ, [id] বা [slug]।
ডাইনামিক সেগমেন্টগুলো layout, page, route, এবং generateMetadata ফাংশনে params প্রপ হিসেবে পাঠানো হয়।💡 উদাহরণ
ফাইল স্ট্রাকচার:
app/blog/[slug]/page.tsx
কম্পোনেন্ট:
export default function Page({ params }: { params: { slug: string } }) {
return
My Post: {params.slug}
}যদি ইউআরএলটি
/blog/hello-world হয়, তবে params.slug হবে "hello-world"।🎯 আপনার কাজ (প্র্যাকটিস)
app/users/[id]/page.tsx এর জন্য একটি কম্পোনেন্ট লিখুন। এর { params } গ্রহণ করা উচিত এবং "User ID: " এর পরে params.id থাকা একটি main.nextjs
Loading...
OUTPUT
Run your code to see the output here...