HELP! index.js giving 404 error
Answered
West African Crocodile posted this in #help-forum
West African CrocodileOP
hello all,
I have been facing this issue for a couple hours now and cant seem to fix it or what the issue even is.
I was doing a coding challenge and required me to create a next.js project. I first started by npx create-next-app app_name then started making a couple js codes under src and then i wanted to test it. I go ahead and make a new folder and named it "pages" then inside, i have a file named index.js and the content inside is very simple and brief as it is just a test.
index.js:
export default function HomePage() {
return (
<div>
<h1>Welcome</h1>
<p>If you see this, then basic setup is working!</p>
</div>
);
}
I do a "npm run dev" then go to localhost and i get a 404 error and i dont understand what i am doing wrong, it should be the root route but its just not accepting it. help me
I have been facing this issue for a couple hours now and cant seem to fix it or what the issue even is.
I was doing a coding challenge and required me to create a next.js project. I first started by npx create-next-app app_name then started making a couple js codes under src and then i wanted to test it. I go ahead and make a new folder and named it "pages" then inside, i have a file named index.js and the content inside is very simple and brief as it is just a test.
index.js:
export default function HomePage() {
return (
<div>
<h1>Welcome</h1>
<p>If you see this, then basic setup is working!</p>
</div>
);
}
I do a "npm run dev" then go to localhost and i get a 404 error and i dont understand what i am doing wrong, it should be the root route but its just not accepting it. help me
Answered by Plague
no, you need to delete the page.tsx/page.jsx file in the app folder for your index.js page to work
22 Replies
West African CrocodileOP
@Plague help :x
@West African Crocodile <@683517071749021779> help :x
You ran
npx create-next-app and did you select to use app router or pages router?@Plague You ran `npx create-next-app` and did you select to use app router or pages router?
West African CrocodileOP
i cant remember, when does it ask me that?
it asks you that during the initializtion of the project using
npx create-next-app in your terminal, where you have to decide if you're using the src directory, typescript etc.West African CrocodileOP
ah shoot i think i selected yes when it asked me to use app router
is there a way to change it?
Do you specifically not want to use app router? It is the recommended default now, but, if you'd like to use pages router for something specific you can use both pages router and app router at the same time, you just need to make sure they don't have conflicting route segments.
Meaning, right now in your app folder you have a
Meaning, right now in your app folder you have a
page.tsx file, this is your index point, so you can't create another index point in the pages router at the root route level.IMO you should use app router unless you have a very specific reason to use pages router.
West African CrocodileOP
so if i want my index.js to be my root file, do i just go and change page.tsx to index.js
no, you need to delete the page.tsx/page.jsx file in the app folder for your index.js page to work
Answer
West African CrocodileOP
at the moment, i have pages/index/index.js and i can run by going localhost:3000/index
the
page.js file convention is something specific to the app router, just like the index.js file convention is specific to the pages router@Plague no, you need to delete the page.tsx/page.jsx file in the app folder for your index.js page to work
West African CrocodileOP
so delete page.tsx
then keep folder pages/index.js
Yes
West African CrocodileOP
okay ill delete the extra index file i made to bypass my inital issue and try
worked
Nice
West African CrocodileOP
finally
tysm
np