Adding navbar to NextJs project

Add a new file NavBar.tsx next to layout.tsx that is in the root of the project and the add the below code.

import Link from 'next/link'
import React from 'react'

const NavBar = () => {
  return (
    <div className='flex bg-slate-200 p-5'>
        <Link href="/" className='mr-5'>Next.js</Link>
        <Link href="users" className='mr-5'>Users</Link>
    </div>
  )
}

export default NavBar

Then layout.tsx to be modified like below



Comments

Leave a Reply

Your email address will not be published. Required fields are marked *