Next.js Discord

Discord Forum

Simple API Call not working

Unanswered
Japanese Bobtail posted this in #help-forum
Open in Discord
Avatar
Japanese BobtailOP
Hello. I am trying to make the simplest API Call, but I am getting a 404 error and I have no idea why. I lifted this code directly off he next.js website. This is the hello.js file and my file strucuture:

// hello.js

export default function handler(req, res) {
  res.status(200).json({ text: 'Hello' });
}
Image
Image

49 Replies

Avatar
Japanese BobtailOP
And this is my file structure:
Image
Avatar
it needs to be /pages/api/hello/route.js
Image
also...
in your app folder should only be the routes
so u dont need the pages directory
only have app/api/hello/route.js
Avatar
Japanese BobtailOP
it still did not work :/
ahh okay
this is just how the installiation set it up
i have my page files inside the app folder now. where would i put them ?
Avatar
nowhere
your layout.tsx and page.tsx belongs in the app folder
Avatar
Japanese BobtailOP
okay yes i have that
Image
so that looks good now?
checkin and points are pages with a page.js file inside it
Avatar
prisma and checking is a route?
Avatar
Japanese BobtailOP
prisma is for the database so i think you can ignore that
check in is a route
Avatar
move prisma out
also move fonts out
also globals.csss
everything besides the actual routes
Avatar
Japanese BobtailOP
hmm now its giving me this
Image
Image
Avatar
put globals into /styles
ur function should be named as a http method
check the docs
export async function GET(request: Request) {}
Avatar
Japanese BobtailOP
i am doing this in javascript so its giving me a syntax error
Avatar
well obviously
remove the type
Avatar
Japanese BobtailOP
im just confused why it isnt working because i directly copied this from here 😭

https://nextjs.org/learn-pages-router/basics/api-routes/creating-api-routes
Avatar
cause this is old as fuck
check this if u really dont now anything about full stack frameworks
also keep in mind that this is using next canary
otherwise, its really not that hard to read the docs
Avatar
Japanese BobtailOP
Image
Avatar
👍
btw u can return json like this ->
Response.json({ data })
check the docs
everything is there
Avatar
Japanese BobtailOP
finally got it, thank you so much 😭
i will do the course
Avatar
no problem have fun
make sure to mark my answer as solution