don't use react router dom as the routing is already handled by next.js

the best way to navigate without reloading the entire page is to have common layout and common routes

if you soft navigate between route that has the same common route, it will not reload the entire page

Nextjs already has built-in client side routing that you can use

sure

if you have example it would be better

you can try

id see the example first before the code
if i can't explain it i go to the code

anddd... what is the link

where is the link

the <Link>

thats not reloading the entire page isn't it?

ah

some of your header is flickering

is that what you meant?

it is

is that what you meant by reloading entire page?

wot xd

if it helps, maybe put your header in root layout.tsx

that way / and /contact will use the same layout.tsx
and it wont get refreshed
it will keep the same state, same component, and no change