Api Routes

Simple API routes inside Next.js app like for form input

Just create a function inside the pages/api directory that has the following format:

/pages/api/hello.js

import type { NextApiRequest, NextApiResponse } from 'next'
 
type ResponseData = {
  message: string
}
 
export default function handler(
  req: NextApiRequest,
  res: NextApiResponse<ResponseData>
) {
  res.status(200).json({ message: 'Hello from Next.js!' })
}

http://localhost:3000/api/hello

They can be deployed as Serverless Functions (also known as Lambdas).

• req is an instance of http.IncomingMessage, plus some pre-built middlewares you can see here.

• res is an instance of http.ServerResponse, plus some helper functions you can see here.

Do Not Fetch an API Route from getStaticProps or getStaticPaths, instead just run the code in them since it runs serverside anyway

Dynamic Api Routes