JSON Server

개요

프론트엔드 개발자는 서버로 요청을 보내서 응답받은 데이터를 바탕으로 화면을 구성합니다.

 

이 때, 백 엔드에서 API를 다 만들때 까지 기다릴 수는 없으니 응답 데이터의 형태에 대한 기본적인 정보만 받아서 그걸 토대로 Mock server를 만들어서 가상으로 응답과 요청을 받으면서 개발을 진행해야하는 케이스가 적지 않습니다.

 

mock은 모조품이라는 뜻으로 테스트 할 때도 mock 개념이 많이 쓰이고 있습니다.

 

mock server를 만들 수 있는 방법은 여러가지가 있는데 Postman도 편하지만 더 편한 JSON server라는 패키지를 설치해서 사용해보도록 합시다.

 

사용

"ZERO CODING" 30초만에 만드는 풀 REST API !

GitHub - typicode/json-server: Get a full fake REST API with zero coding in less than 30 seconds (seriously)

 

전역설치

npm install -g json-server

 

json 파일 생성

{
  "posts": [
    {
      "id": 1,
      "title": "첫 번째 post",
      "content": "post 내용"
    },
    {
      "id": 2,
      "title": "두 번째 post",
      "content": "post 내용"
    },
    {
      "id": 3,
      "title": "세 번째 post",
      "content": "post 내용"
    }
  ],
  "users": [
    {
      "name": "Cottonwood",
      "gender": "male",
      "id": 1
    },
    {
      "name": "moa",
      "gender": "male",
      "id": 2
    },
    {
      "name": "earlyBird",
      "gender": "male",
      "id": 3
    }
  ]
}

 

서버실행 (json파일 있는 루트)

json-server --watch mock.json --port 4000

 

기본 포트번호가 3000 이지만 프론트 개발서버 포트번호도 3000이기 때문에 --port 4000을 붙여서 실행해주었습니다.

 

 

아래와 같이 생성한 json 경로를 호출하면 해당 json 데이터를 읽어올 수 있습니다.

 

기능

get post는 물론이고 아래와 같이 많은 기능들을 지원하고 있습니다.