Step 6
The App component now contains the logic for retrieving the data from the backend. This violates the Single Responsibility Principle. Let's refactor the code to separate the responsibilities.
Create a file ZirectoryApi.js
with the following content:
import axios from "axios";
const BASE_URL = "http://localhost:4567";
async function getAll() {
try {
const response = await axios.get(`${BASE_URL}/api/meetings`);
return response.data.data;
} catch (err) {
console.log(err);
return [];
}
}
async function remove(id) {
try {
const response = await axios.delete(`${BASE_URL}/api/meetings/${id}`);
return response.data.data;
} catch (err) {
console.log(err);
return null;
}
}
async function add(meeting) {
try {
const response = await axios.post(`${BASE_URL}/api/meetings`, meeting);
return response.data.data;
} catch (err) {
console.log(err);
return null;
}
}
export { getAll, remove, add };