Full-Stack React Projects - Second Edition

The Expenses component

The list of expenses retrieved from the database will be rendered using a React component called Expenses. This component, on the initial load, will render the expenses incurred by the signed-in user in the current month. In this view, the user will also have the option to pick a date range to retrieve expenses incurred within specific dates, as shown in the following screenshot:

While defining the Expenses component, we first use a useEffect hook to make a fetch call to the list expenses API in order to retrieve the initial list of expenses. We also initialize the values that are necessary for making this request and ...