Next.js app redirects to localhost:10000 during navigation

This is not my first time deploying to render, but I’ve only deployed nodejs projects with vanilla javascript and plain html for the frontend. This is my first time of deploying a Next.js app to render.

The issue I’m having is that, when I specifically enter the url for my web service, it work normally (great even), but any time i try to navigate to another page instead of navigating to my-url/the-page, it goes to localhost:10000/the-page which always lead to a connection error since I’m not in development.

localhost:10000 doesn’t exist in any part of my code, during development I used the default localhost:3000. And I did not add any localhost port in my environment variables. Infact, I deployed same code to vercel and this issue never happen.

Just that, I prefer to have my app on render than any other platform, which is why this issue is bugging me so much.

Has anyone encountered such problem? Can anyone tell me what the solution is?

Thanks in anticipation.