NextJS-এ উন্নত মেনু

পূর্ববর্তী পাঠে আমরা আলোচনা করেছিলাম সাধারণ লিঙ্ক থেকে মেনুর সমস্যা নিয়ে। NextJS এই সমস্যার সমাধান করতে পারে এবং নিশ্চিত করতে পারে যে লিঙ্কে ক্লিক করলে পুরো পৃষ্ঠা রিলোড না হয়। পারফরম্যান্স অপ্টিমাইজেশনের জন্য শুধুমাত্র পরিবর্তিত অংশ Ajax এর মাধ্যমে লোড হবে।

এজন্য লিঙ্কের পরিবর্তে আমরা ব্যবহার করব বিশেষ কম্পোনেন্ট Link। এটি ইম্পোর্ট করি:

/src/comps/menu/menu.jsximport Link from 'next/link';

আসুন আমাদের মেনুটি এই কম্পোনেন্টের মাধ্যমে রিডিজাইন করি:

/src/comps/menu/menu.jsxexport default function Menu() {
  return <>
    <Link href="/">home</Link>
    <Link href="/about">about</Link>
    <Link href="/price">price</Link>
    <Link href="/contacts">contacts</Link>
  </>;
}