Step 5

When we add a meeting, we must send a POST request to the backend to keep it in sync with the state of the app.

addMeeting = (meeting) => {
  axios
    .post("http://localhost:4567/api/meetings", meeting)
    .then((response) =>
      this.setState({
        meetings: this.state.meetings.concat(response.data.data),
      })
    )
    .catch((err) => console.log(err));
};

Notice that I first create the meeting on the backend and then add the created meeting to the state. I do this to get the "ID" of the created meeting. Without the ID, we will not be able to delete the meeting.

Save the file and revisit the app in your browser. Add a meeting and then refresh the app. The added meeting must be there after the refresh!

Aside: There is a handy Axios cheat-sheet here.