Full-Stack React Projects - Second Edition

Rendering the preview of current expenses

We can give the user a glimpse of their current expenses in any React component, which is accessible to a signed-in user and added to the frontend of the application. To retrieve the expense totals and render these in the view, we can call the current month preview API either in a useEffect hook or when a button is clicked on.

In the MERN Expense Tracker application, we render these details in a React component that is added to the home page. We use a useEffect hook, as shown in the following code, to retrieve the current expense preview data.

mern-expense-tracker/client/expense/ExpenseOverview.js:

  useEffect(() =  {      const abortController = new AbortController() const signal = abortController.signal ...