Search code examples
reactjsnext.jsslugsanity

Sanity/next slug- 404 not found


When I try to access my slug page, the name of the slug shows in the browser search bar (so I know its accessing the backend data), but nothing shows up on the page. In the console, error 404 keeps coming every 3 seconds.

Due to lack of timing, experience, knowledge, etc., I've had to switch from react to next very last minute (learning both for the first time at the moment). In react, I remember you could establish a path/page that went '/pageName/:slug', but I haven't seen that for next. I think this might be what is causing the issue, that I don't have an equivalent of that, but I'm not sure how to go about doing that. How do I fix this issue?

I'm happy to post any code if needed.


Solution

  • Got it. I hadn't given much context in the post, but I had two .js page files, gallery.js (where I can select a set), and sets.js where I wanted the slug to route into. So my link in gallery.js looked like this: <a href="./sets/[slug]">.

    The fix: I renamed sets.js to [slug].js, and removed /sets/ so that it was just <a href="./[slug]">.