여행가는개발자

Json-server 본문

React

Json-server

kimsoonil 2023. 9. 15. 13:30
728x90
반응형

프론트 엔드로 임시 서버를 열어 서버 협업을 하기 위해 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 으로 서버를 실행할 수 있습니다.

728x90
반응형

'React' 카테고리의 다른 글

Recoil을 활용하여 팝업 공통화하기  (0) 2023.10.12
Recoil  (1) 2023.10.10
Typescript vs Javascript  (0) 2023.09.15
Yup  (0) 2023.09.15
[Material UI]  (0) 2023.09.14