📌JSON Server

• Node.js 기반의 도구
• JSON 파일을 데이터베이스로 사용하여 자동으로 RESTful API 서버를 생성

=> 이를 통해 개발자는 백엔드 서버를 구축하지 않고도 프론트엔드 개발을 빠르게 진행할 수 있음

기능

• 간단한 설정으로 RESTful API 생성
• 기본적인 CRUD(Create, Read, Update, Delete) 작업 지원
• 다양한 HTTP 메서드(GET, POST, PUT, DELETE 등) 지원
• 쿼리 파라미터를 이용한 데이터 필터링 및 정렬

JSON Server 사용법

1. 설치

yarn add json-server

npm install -g json-server

⚠️개발환경에서 설치를 한다면 아래 명령어

yarn add json-server -D

vercel등에서 배포 간 json-server를 별도로 올라가지 않게 설정
(json-server는 별도 배포)

2. 데이터 준비

JSON형식의 데이터 파일이 필요
src가 있는 rootfile에 db.json 파일 생성

{
  "todos": [
    {
      "id": 1,
      "title": "리액트 공부하기",
      "isDone": false
    }
  ]
}

3. JSON 서버 실행

// 기본적인 port : 3000
yarn json-server db.json

// 별도의 port 지정
yarn json-server db.json --port 4000

Endpoints에 들어가보면 내가 db.json에서 만들었던 데이터가 평소 API를 통해 받아오던 데이터 형태로 들어가 있다.

4. API 사용

• 모든 포스트 조회: GET /posts
• 특정 포스트 조회: GET /posts/1
• 포스트 생성: POST /posts
• 포스트 수정: PUT /posts/1
• 포스트 삭제: DELETE /posts/1

5. 쿼리 파라미터 사용

JSON Server는 쿼리 파라미터를 이용한 데이터 필터링 및 정렬도 지원

• 특정 아이디 todos 조회: GET /todos?id=1
• todos 제목으로 검색: GET /todos?q=리액트
• todos 정렬: GET /todos?_sort=title&_order=asc

---

요약

JSON Server는 간단한 JSON 파일을 이용해 빠르게 RESTful API를 생성할 수 있는 도구로, 주로 개발 및 테스트 용도로 사용

Node.js 환경에서 쉽게 설치하고 실행할 수 있으며, 기본적인 CRUD 작업과 쿼리 파라미터를 통한 데이터 필터링 및 정렬을 지원

이를 통해 프론트엔드 개발자는 백엔드가 완성되기 전에 Mock API를 사용하여 개발을 진행할 수 있음