Integrate Tanstack Query & Axios #668
Draft
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Traditionally, libraries such as Redux and Axios would be used for both state management and HTTP requests. This usually works, but only focuses on managing client-side state. Tanstack Query, on the otherhand, is an server-state management library, which also helps to reduce the code necessary to perform the same tasks with Redux. This seperates the concerns of our data into two parts: server-side and client-side. Tanstack Query handles the server-side operations and caching, such as calls to the API, and many others. While if we want to manage client-side states, then Redux will be used alongside Tanstack Query to efficiently manage that.
There were many considerations to make in terms of what HTTP client library to use. Fetch API, Ky, Axios, and others. Ultimately, Axios was chosen, mainly because it is based around the
Promise
API (in other words, it's basically just like aiohttp in the python world, and it is based on asyncio). This allows us to integrate it nicely with Tanstack Query, and in addition prevents us from blocking the main event loop with long, blocking HTTP calls.This PR only sets the foundations, and integrates one or two API calls to use as reference in the future.
Types of changes
What types of changes does your code introduce to the UC Merced's ACM Chapter Website?
Put an
x
in the boxes that applyChecklist
Put an
x
in the boxes that apply