[Next.js] backend (json-server)

Nextjs은 백엔드까지 동시에 제공하는 full stack framework다. Route Handlers를 사용하면 별도의 백엔드를 구축하지 않고 Nextjs API 서버까지 구축할 수 있다. 자세한 내용은 Route Handlers .

여기서는 Json-server를 이용해서 간단하게 백엔드를 구축하고, 뒤에서 백엔드를 사용하는 방법을 사용한다.

json-server 실행

1. json-server 실행

   npx json-server --port 9999 --watch db.json

2. db.json 파일 수정

{
  "topics": [
    {
      "id": 1,
      "title": "html",
      "body": "html is .."
    },
    {
      "id": 2,
      "title": "css",
      "body": "css is .."
    }]
}

3. http:localhost:9999/topics로 접속
   

4. 개발자 도구 Network 창에서 ESC키를 눌러서 콘솔창 열기

5. 글목록 읽기

const resp = await fetch('http://localhost:9999/topics/')
const result = await resp.json();
console.log(result);

제대로 호출된다.