Totals

The list grows, and now the app should add it up. These are values worked out from other values, so they're computed values.

The task. Under the list, show three things, all up to date as soon as an expense is added:

• How much you've spent, the total of all expenses, in a paragraph with the id spent: Spent: €57.
• What's left of the monthly budget of €400, in a paragraph with the id left: Left: €343. When you spend more than the budget, it's below zero, Left: €-20, and the paragraph gets the class over-budget, which makes it red.
• How much went to each category, in a list with the id categories: an item for each category, in the order of the select, such as Food: €42, Transport: €0 and Fun: €15.

A tip: a computed value can return an object, such as { food: 42, transport: 0, fun: 15 }. Start with zeros, and add each expense to its category with the bracket notation: totals[expense.category] += expense.amount;. And one computed value can use another: what's left is the budget minus what you've spent.