Json-server

프론트 엔드로 임시 서버를 열어 서버 협업을 하기 위해 json-server를 추가하여 작업 하는 일이 있습니다.

명령어는 json-server --watch db.json --port 3001 으로 하여 localhost:3001로 실행할 수 있습니다.

프로젝트 안에 db.json를 만든 후

{
  "books": [
    {
      "id": "1",
      "sort": 1,
      "title": "제목1",
      "img": "title1.svg"
    },
    {
      "id": "2",
      "sort": 2,
      "title": "제목2",
      "img": "title2.svg"
    },
    {
      "id": "3",
      "sort": 3,
      "title": "제목3",
      "img": "title3.svg"
    },
    {
      "id": "4",
      "sort": 4,
      "title": "제목4",
      "img": "title4.svg"
    },
    {
      "id": "5",
      "sort": 5,
      "title": "제목5",
      "img": "title5.svg"
    }
  ]
}

안에 임의의 서버 내용을 입력 후

package.json 안에 scripts 안에

"scripts": {
    "start": "env-cmd -f .env craco start",
    "build": "CI= env-cmd -f .env.production react-scripts build",
    "test": "craco test",
    "eject": "craco eject",
    "server": "json-server --watch db.json --port 3001",
  },

이런식으로 json-server를 추가 하면 npm run server 으로 서버를 실행할 수 있습니다.