🚀App Routing using useRouter in Next Js || How to Use useRouter in Next js || Next js Router

useRouter
The useRouter hook allows you to programmatically change routes inside Client Components.

Good to know:

The Link component automatically prefetch routes as they become visible in the viewport.
refresh() could re-produce the same result if fetch requests are cached. Other dynamic functions like cookies and headers could also change the response.

Migrating from next/router
The useRouter hook should be imported from next/navigation and not next/router when using the App Router
The pathname string has been removed and is replaced by usePathname()
The query object has been removed and is replaced by useSearchParams()