How to implement different not-found pages for diffrent routes in next js app dir
Hi trying to implement a different 404 page for different parts of an app separated by route groups https://nextjs.org/docs/app/building-your-application/routing/route-groups
Is there currently any way to do this apart from checking the pathname in the root app/not-found file. ( Tried putting a not-found file in the separate route groups also but doesn't seem to be working ). ty : D
2 Replies
From the little research I've done it's not really possible. Next allows you to add a custom
404
page in your root
app
directory but that is really it. This would be a great addition imo. One resolution to this problem is like you said, creating a custom page
that the user will be redirected to if he tries to access something in a route group that does not exist.
If you find some more satisfactory solution I'd love to hear how you've done it.ty will let you know if I find anything >_<, like you said currently just using a catchall page [...not-found]/page.tsx, but it's not optimal.