Link

Create a Next.js project: If you haven’t already set up a Next.js project, you can do so by running the following command in your terminal:

npx create-next-app my-next-app

1. Replace my-next-app with the name you want to give your project.
2. Navigate to your project directory:

cd my-next-app

Create pages: Next.js automatically sets up routing based on the files in the pages directory. Each file in this directory becomes a route in your application. Create some pages inside the pages directory. For example:

pages/
├── index.js
├── about.js
└── contact.js

1. Each of these files represents a page in your application.
2. Linking between pages: To create links between pages, you’ll use Next.js’s Link component. Import it at the top of your file:

import Link from 'next/link';

Use the Link component to create links: Inside your components, you can use the Link component to create links between pages. For example, in your index.js file, you might have:

import Link from 'next/link';

function HomePage() {
    return (
        <div>
            <h1>Home Page</h1>
            <Link href="/about">
                <a>About</a>
            </Link>
            <Link href="/contact">
                <a>Contact</a>
            </Link>
        </div>
    );
}

export default HomePage;

Run your Next.js application: Start your Next.js application by running:

npm run dev