← flaviocopes.com

How to programmatically change a route in Next.js

Published May 10 2021

Psssst! The 2023 WEB DEVELOPMENT BOOTCAMP is starting on FEBRUARY 01, 2023! SIGNUPS ARE NOW OPEN to this 10-weeks cohort course. Learn the fundamentals, HTML, CSS, JS, Tailwind, React, Next.js and much more! ✨

In a component, you can use the useRouter hook:

import { useRouter } from 'next/router'

//...

const router = useRouter()

router.push('/test')

Sometimes you can’t, for example when you’re not in a React component, maybe in a utility function.

In that case, you can do this:

import Router from 'next/router'

Router.push('/test')

I write books for developers 👇🏼