6

I'm encountering a 404 error when attempting to access a page in my Next.js project. I've followed the guidance provided in the documentation and various online resources, but the issue persists. Here's my setup:

My Next.js project structure looks like this:

When I try to access the profile page using the URL http://localhost:3000/profile, I get a 404 error. It seems like Next.js isn't recognizing the configuration

I'm seeking guidance on how to resolve this issue. If anyone has experience with Next.js routing and can help me identify what might be causing this 404 error, I'd greatly appreciate it. Is there something I might be overlooking or a common mistake that could be causing this problem? Thanks in advance for your help!

Improve this question

1 Answer 1

Reset to default
3

In order to create a route like that in Next JS using app router, you have to create a folder for every route with the main js file of that page/route inside. Here is the explanation in next js documentation.

route folder structure

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

I created folder for it, profile/profile.js, and when i accessed it using url still same error 404.
If you selected in your setup that you want to use App Router(recommended) than it should work, but you have to make folder and have main export for that page/route called page.js, here you an check the naming convention for routes in nextjs.
I'm really grateful for your help; it now works as intended. I've also gained a better understanding of how to name files correctly.
I am glad that I managed to help you.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.