[React] Mock data 활용법

데이터로 확인을 해보고 싶은데 

어떤 방법이 좋을까 고민하다가 

원래는 JS로 만들까? 잠깐 고민했는데 이번만 쓸 것도 아니고 

다음에 이런일이 있을때에도 편하게 만들 수 있게 

json-server를 사용하기로 하였다!!

https://www.npmjs.com/package/json-server

json-server

 

 yarn global add json-server

자주 쓸 것 같아서 전역으로 설치를 해주고 

✔src 폴더 밖에 즉 위와 같이 db.json을 만들어준다 

{
  "posts": {
    "lists": [      {
      "id": 1,
      "title": "study",
      "cards": [
        {
          "boardId": 1,
          "id": "card1",
          "title": "하나둘",
          "check": true
        },
        {
          "boardId": 1,
          "id": "card2",
          "title": "셋넷",
          "check": false
        },
        {
          "boardId": 1,
          "id": "card3",
          "title": "다섯",
          "check": false
        },
        {
          "boardId": 1,
          "id": "card4",
          "title": "여섯",
          "check": true
        }
      ]
    }
   ]
  }
 }

그런 후에 먼저

json-server --watch db.json

을 실행해주면

이런식으로 터미널에 나오면서 저기 Resources를 누르면 확인이 가능하다