Move the rest folder from the components folder to a separate /api folder because rest is not a reusable UI component, and placing it in an /api folder makes the structure more semantically correct.
Use the axios library instead of fetch due the following benefits:
Axios automatically parses the JSON response, saving you the extra step of calling response.json() as required with fetch. This reduces boilerplate code and makes code cleaner.
Axios allows you to define interceptors for requests and responses. This is useful for tasks like adding authentication tokens to every request, logging request data, or modifying the response data before it reaches the component.
Axios allows you to create an instance with custom configuration, such as base URLs, headers, and timeouts, which can be reused across your app. This reduces the need to repeat configurations and makes the code more modular and maintainable.
Axios has built-in support for canceling requests. This is particularly useful in React apps where you might want to cancel an HTTP request if the user navigates away from the current page or component.
Move the rest folder from the components folder to a separate /api folder because rest is not a reusable UI component, and placing it in an /api folder makes the structure more semantically correct.
Use the axios library instead of fetch due the following benefits: