Issue with API

[austere pumice]

Hello, I've ran into an issue with API requests. I'm trying to fetch data from my API, but it won't work. Response status is 404.

Project dir is src/app. API dir src/app/api.

API:

// src/app/api/posts/getAllPosts.ts

import { NextApiRequest, NextApiResponse } from "next";

type ResponseData = {
    message: string
}

const handler = async (req: NextApiRequest, res: NextApiResponse<ResponseData>) => {
    res.status(200).json({ message: 'Hello from Next.js!' })
};

export default handler;

[chrome storm]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[austere pumice]

Fetching source:

// src/app/[lang]/page.tsx
const getData = async () => {
  const postData = {
    method: 'GET',
    headers: {
      "Content-Type": "application/json"
    }
  }
  const data = await fetch(`http://localhost:3000/api/posts/getAllPosts`, postData);
  console.log(data); // Warning: Detected multiple renderers concurrently rendering the same context provider. This is currently unsupported.
}

export default async function HomePage({ params: { lang } }: { params: { lang: Locale } }) {
  const dictionary = await getDictionary(lang);
  const data = await getData();

  return (
    <div className={styles.container}>
      <HeaderContent dictionary={dictionary} />
    </div>
  );
}

Also when going directly to the http://localhost:3000/api/posts/getAllPosts, I'm getting an error page's not found

[final sequoia]

you've mixed up the pages router API format with app router (which looks like you're using based on your directory structure)

look at the docs on route handlers in the app router docs to see how to make an API endpoint

[austere pumice]

I've done that, couldn't find a solution, that's why I wrote a post here