I need help, What routing / state management to do for this use case?

[bymoe]

I need to create a wizard using Next.js,
Using enters /video/[key] I generate the key If valid -> go to /video/register, then /video/questions/ then /video/finish/.
So each step depends on the previous one, and there's data sent in-between.

How to achieve this? I'm migrating from Gatsby, and Gatsby has something called navigate that I can send data between routes and I cannot achieve this using Next.js

[magicspon]

Router.push('/about')from next is the equivalent of navigate('/about')

https://nextjs.org/docs/routing/imperatively

[bymoe]

with naviagte you can send data (objects) to other routes and this data presist after refresh, with Router.push You only send query params (strings).

[mulholo]

How much data do you need to send? Query params might get you quite far.

[mulholo]

You could also consider adding a global store. e.g. the Redux example here

[bymoe]

The data must be objects cannot be strings, I think Redux is my last hope for this even though I think it's still an overkill.

[mulholo]

I don't think you need to use redux, you can just look at the general principles used there. You might be able to get quite far with context providers.

[magicspon]

You could just write the state to local/session storage.
then re from that on page load to determine which page you should be on.