Full-Stack React Projects - Second Edition

Total expenses per month in a year

We will show the user a bar chart representing their total monthly expenses over a given year. This will give them an overview of how their expenses are spread out annually. The following screenshot shows how the bar chart will render with user expense data:

Here, we populate the bar chart with the total expense value corresponding to each month in a given year. We add the monthly total value as labels to each bar. On the x-axis, we show the short name of each month. In the following sections, we will implement this feature by first adding a backend API that will return the total expenses incurred per month ...