This application is written in Typescript using React Native. It was only tested and designed for Android devices (currently fully supports Pixel 8 Pro).
The app offers dark/light mode.
The app is using React Native Async Storage for local storage on your device. Refer to the link to read more about. The income and budget pages offer to store calculations optionally. The data for saving and investment pages goes straight to your local storage. By removing it from the list on the pages, the data is going to be cleared from your local storage.
When the application is loaded, the landing page is the Income page. You can select a currency, amount and frequency of your income.
In the burger menu you can select saver (e.g. superannuation) with a custom percent; student loan with a custom rate and threhold; second income with a custom yearly payment.
Once you click on the Calculate button, the table will populate and a pie chart if your expenses will show up.
The second page is the Budget page. Initially there is only an add button.
In the add modal, you can add a new expense by providing a name, amount and the frequency the expense occurs: weekly, fortnightly, monthly, early or one-off.
Once expense(s) are added, you can see a list of them, with the pie chart that shows the amount of expenses for the selected frequency: weekly, fortnightly, monthly or early. One-off payments are added as they are and the same for all the frequencies.
The colour for the expenses are selected randomly.
Every expense can be deleted and edited.
If you entered/calculated income on the previous page, then your amount inside the pie chart might be positive. In this case, the Add to savings
button is enabled. By clicking on the button, it adds a new row of expenses Savings
.
The third page is the Saving Goals page. Initially there is only an add button.
In the add modal, you can add a new goal by providing a name, goal amount, saved amount and the due date of the goal. The due date has to be in future.
Once goal(s) are added, you can see a list of them. By default they are all collapsed and can be expanded one by one.
Based on the due date value, the countdown is going to show the time to go in days, hours, minutes and seconds. The time is counting down in live time.
Every row has delete and edit button. Delete button does not have confirm modal, so once it is clicked it is DELETED. The edit button takes back to the modal for the goal
Once the goal is expanded, all the goal's fields that you filled in is visible. Apart of them, you can add transactions by clicking on the +
button. A transaction modal includes amount and the date when the amount was contributed.
Once a transaction is contributed, you can see the chart of all them. The starting point depdends on what you entered into the goal's saved amount. When you reach the goal's amount, you will see another line across the chart indicating what needs to be reached.
All transactions can be modified and deleted as the goals.
The last page is the Investments page. Initially there is only an add button.
In the add modal, you can add a new investment by providing a name, amount (that was invested), tax rate (based on your income), term amount, term amount time as a month or year, term rate and the start date of the investment.
Once investments(s) are added, you can see a list of them. By default they are all collapsed and can be expanded one by one.
Based on the term amount and time you have provided, the countdown is going to show the time to go in days, hours, minutes and seconds. The time is counting down in live time.
Every row has delete and edit button. Delete button does not have confirm modal, so once it is clicked it is DELETED. The edit button takes back to the modal for the inestment.
Once the invesment is expanded, all the investments's fields that you filled in are visible. Apart of them, you can see the chart with bars that is scrollable (based on the amount you have provided). The term rate is yearly so if the amount is in month time then you will only see 2 bars: current and at the end of the investment. The bar chart includes the initial investment and the return amount. Underneath, there is a table that summarises the bar chart.