Mock Data

Michael Minchang Kim·2020년 5월 31일
0

wecode

목록 보기
20/22

What is Mock data?
Mock data is a json file that you can create to use as an api.
create a data folder within the public folder of your react project
within the data folder place the .json files that you want to use.

{
  "Item": {
    "sub_category": "Tea Food",
    "fourth_category": "초콜릿/잼",
    "title": "녹차밀크스프레드 200 g",
    "description": "오설록의 최고급 가루 녹차를 함유한 고급스러운 풍미의 녹차 스프레드입니다. 빵에발라 먹거나, 간편하게 밀크티를 만들어 드세요.",
    "price": 8500,
    "discount_percent": 0.2,
    "best": true,
    "gift": false,
    "sold_out": false,
    "on_sale": false,
    "bonus": false,
    "new": false,
    "benefits": [
      "뷰티포인트 85P 적립",
      "찻잎 85P 적립",
      "3만원 이상 무료배송",
      "포장불가"
    ],
    "rating": 4.7,
    "num_reviews": 557,
    "main_image": "https://www.osulloc.com/upload/kr/ko/adminImage/PW/US/20180406140800938CQ.png?quality=a"
  }
}

for example if you need a file in this shape you can place this within a .json file and fetch this from your react project
so how do you fetch this file?

fetch("http://localhost:3000/data/TeaItem.json", {})
      .then((response) => response.json())
      .then((response) => {
        this.setState({ data: response.data });
      });
profile
Soon to be the world's Best programmer ;)

0개의 댓글