[리액트 심화] json-server 사용 방법 (+ 특정 포트 지정)

1. json-server란?

- 아주 간단한 DB와 API 서버를 생성해주는 패키지

- 임시적으로 사용할 mock data 생성 위함 (테스트용)

 

2.  json-server 사용하기

(1) vs 코드 터미널 : json-server 추가

yarn add json-server

(2) src - db.json 파일 생성 

[db.json]

{

    "posts": [{ "id": 1, "title": "json-server", "author": "typicode" }],

    "comments": [{ "id": 1, "body": "some comment", "postId": 1 }],

    "profile": { "name": "typicode" }

}

▶ key 부분이 쌍따옴표여서 json임

 

(3) JSON server 시작하기 + 특정 포트 지정하기 

yarn json-server --watch db.json --port 4000

▶지금 리액트 앱은 localhost:3000으로 실행되니 다른 서버를 지정 추천

▶ 정상 작동

▶ "http://localhost:4000/posts" 검색해서 확인 가능

▶ "http://localhost:4000/posts/1"  추가해서 원하는 데이터 확인 가

 

[참고]

json-server

 

끝.