DEV Community

Cover image for Budgetfy
Enmanuel Magallanes Pinargote
Enmanuel Magallanes Pinargote

Posted on • Originally published at enmanuelmag.cardor.dev

1

Budgetfy

In this web app you can create budget to define your expenses and incomes as unique events or recurrent events as you usually create events for a calendar, in order to plan your budget through slice of time that you can define.

The Budget view has show you one card per moth with three sections. The first section is Category summary, it show the total amount of money for each category that you have defined.

The second section is Timeline, that show the following information:

  • Timeline: show all the events for that month (expenses and incomes) and the estimated balance for that month. Also if you clic on the event you can mark it as paid (for expenses) or received (for incomes). This will update the balance.
  • Balance: section you will see all the money available without expenses for that month and the monthly balance, it mean the difference between the incomes and the expenses for that specific month.

Finally the third section is the Timeline plot, that show the evolution of the incomes, expenses and balance for the the defined range of time on the budget creation.

Web app view

You can create a account for free using a email and password or Google account, then you can create your budget and start to add your incomes and expenses. Visit the website to see more details.

Tech used

  • Firebase (Auth, Firestore)
  • ReactJs, React Router, React Context
  • React-Query
  • Highcharts
  • Zod (Validation)

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more