NEXT.JS - API Routes란?

 

API Routes ?

NEXT.JS 에서 API를 구축할 수 있도록 도와주는 기능임

 

간단한 API를 구축해서 클라이언트, 즉 브라우저로 부터 요청을 받아 데이터베이스에서 데이터를 꺼내온다던가

아니면 또 다른 서드파티에서 데이터를 불러와서 전달을 해주는 일련의 동작들을 할 수 있음. 

 

---

 

Next앱에서는 pages -> api 라는 폴더 내에 hello.ts를 보면 자동으로 api 파일이 생성되어있는 것을 확인할 수 있는데, 

// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
import type { NextApiRequest, NextApiResponse } from "next";

type Data = {
  name: string;
};

export default function handler(
  req: NextApiRequest,
  res: NextApiResponse<Data>,
) {
  res.status(200).json({ name: "John Doe" });
}

 

이 경로에 맞게 브라우저에서 /api/hello 로 요청하게  되면 디폴트로  handler 함수가 실행하게돼서 api가 작동함 

 

---

 

예제로 현재 시간을 반환하는 api를 만들어본다 

 

import type { NextApiRequest, NextApiResponse } from "next";

export default function handler(
  req: NextApiRequest,
  res: NextApiResponse
): void {
  const date = new Date();

  res.json({ time: date.toLocaleString() });
}