Simple & Sober "Wallet Tracker" in Modern JavaScript

Hi, my name is Gitanshu Choudhary and being a JavaScript enthusiast I am penning down my second Tech Story on "DEV".

In this story, we will be creating a Modern JavaScript application called "Wallet Tracker" with its interface implemented on Cmder.

Info-Pinch : Cmder pronounced "Commander" is a pre-configured software package that provides you with an awesome terminal emulator, and best shell you'll ever have on Windows.

Our Application will be based on Simple yet Key JavaScript elements such as :

• Functions / Methods
• Arrays
• Objects
• Built-In Array Functions
• Loops

"Wallet Tracker" will consist of Three Major methods for implementing its functionality :

1. First method will be used to add the flow of Income in the user's Wallet.
2. Second method will be used to add the flow of Expense out of the user's Wallet.
3. Third method will be used to calculate the Balance left in the user's Wallet, And display the Lists of all Income & Expense transactions along with their Descriptions/Sources.

"One Man Army",

In our application the whole logical code is stored in One Single Object called "myWallet".
From initializing the Basic Key-Value Pairs to creating Logical Methods, everything is embedded in a single object.

3 Key-Value Pairs,

We will be creating 3 Key-Value pairs to initialize our application.

1. First key is named as "name" which will contain the name of the Wallet holder.
2. Second Key is "incomes" which act as an Array to store Objects with properties as "amount" & "source".
3. Third Key is "expenses" which act as an Array to store Objects with properties as "amount" & "source".

3 Key-Value Pairs

3 Dynamic Methods,

We will be creating 3 Methods which will Dynamically process the 3 Key-Value pairs which we defined above.

First Method,

We will be creating is called addIncome(amount, source), where "amount" will store the cash in-flow while the "source" stores the description regarding this deposit.

addIncome() method

Second Method,

We will be creating is called addExpense(amount, source), where "amount" will store the cash out-flow while the "source" stores the description regarding this withdrawal.

addExpense() method

Third Method,

We will be creating is called walletReceipt(), it takes no arguments. In this method we will be calculating following things :

• Total Expenses : Using a forEach() loop, we will be calculating the total Expenses spent by the user & will also be printing a list of all the Withdrawals along with their descriptions.
• Total Incomes : Using a forEach() loop, we will be calculating the total Incomes earned by the user & will also be printing a list of all the Deposits along with their descriptions.
• Balance : Using the Return Value of above loops, we will be calculating the Balance value left in the Wallet. We will be printing a Final Statement showcasing the "name" of the user with the final values of his/her Expense, Income and Balance.

walletReceipt() method

Finally,

We will be calling these methods to showcase the functionality of our application by Calling Statements.

Calling Statements

Output of our application will be shown as :

Output

At the end, we have successfully created our "Wallet Tracker" application using simple yet major Elements of Pure Modern Javascript.

Attaching below the code via public GitHub gist link.

If you liked my efforts, do encourage this post via Feedbacks & Comments.
I appreciate the support.
Thank You !

---

Gitanshu ChoudharyFollow

Mulesoft API Development

---