Mock Data 활용

import "./App.css";

class App extends React.Component {
constructor() {
super();

   this.state = {};

}

componentDidMount() {
fetch("/data/data.json")

//or fetch("http://localhost:3000/data/data.json")

    .then(res => res.json())
    .then(res => console.log(res));
    .then(res => this.setState({data:res.data}));

}

render() {
console.log("state: ", this.state.data);
}

render() {
return

;
}
}

export default App;

// 처음에는 빈 배열이 들어오고 그 다음에 배열이 들어옴
// (처음에는 빈 배열이 정의되어 있기 때문에)

---

//Data 파일은 아래와 같음

{
"data": [
{
"name": "jason",
"age": 17
},
{
"name": "Micheal",
"age": 18
},
{
"name": "Sam",
"age": 20
},
{
"name": "john",
"age": 27
}
]
}