Step 2

Run the Zirectory App alongside the backend server.

Open the App.js file. Notice we initialized the state with sample meetings. Let's delete these!

class App extends Component {
  state = {
    meetings: [],
  };

  // other methods not shown
}

We must now read the meetings data from the backend. The API endpoint to GET the meetings is

http://localhost:4567/api/meetings

We can easily get the data using axios; let's stop the app and install it:

npm install axios

To make a GET request to our backend, we can use axios.get:

axios.get("http://localhost:4567/api/meetings")
  .then(response => this.setState({ meetings: response.data.data }))
  .catch(err => console.log(err));

The question is: where should we put the above statement? In the constructor of App? In App.render()?