Problem with adding a new page in Next.js with the app router

Question

I'm setting up a new Next.js 13 project with the following folder structure:

- app
  - blog
    - page.jsx

I also have another page in the blog directory called test.jsx. However, when I try to access it using "localhost:3000/blog/test" or any other component name, I receive a 404 error.

How can I correctly reach the test.jsx page in my Next.js project?

Please provide enough code so others can better understand or reproduce the problem. — Community
– Community Bot, Commented Aug 30, 2023 at 14:40
Hi Taha1! Have you checked the below answer? Let us know please :) — Youssouf Oumar
– Youssouf Oumar, Commented Sep 2, 2023 at 15:16

Youssouf Oumar · Accepted Answer · 2023-08-30 07:28:06Z

0

With the app directory (router), to have a /blog/test route, you need to create a test folder inside blog, inside which you add a page.tsx file, which will contain the content of your current test.tsx file (leading to app/blog/test/page.tsx).

For a more detailed answer, checkout this thread.

answered Aug 30, 2023 at 7:28

Youssouf Oumar

47.5k16 gold badges109 silver badges108 bronze badges

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

Collectives™ on Stack Overflow

Problem with adding a new page in Next.js with the app router

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related