How to scroll to a component in Next.js?

Question

I am a little confused, my navbar is a component as are my other sections. How do i add a scrollToView on it. I don't understand where the function goes. Can somebody help me ? I tried using useRef and another npm package. And, it didn't work.

Here is my code...

Index.js

export default function Home () {

return 
(

<Nav/>

<Services/>
)


}

Nav component

function Nav () {
    
  
  return (

<div>
  <title>About</title>


<ul  className="nav justify-content-end m-1 p-1 col-12 pe-auto">
   
  <li className="nav-item">
  <Link  href="About">
    <a  className="nav-link m-2 p-1 border border-dark pe-auto text-dark">About me</a>
    </Link>
  </li>
  
  <li className="nav-item">
    <Link href="/"> 
    <a className="nav-link m-2 p-1 border border-dark  text-dark">Services</a>
    </Link>
  </li>

Any ideas?