Project Overview

The main focus of this project, was to utilize ReactJS, Node, and MaterialUI in order to create a fully functional app with a user friendly interface.
The project uses useState in order to factor and display the appropriate values so that; as the user would slide the bars and input their home value, interest rate, and down payment, the pie chart would display the principle and overall bill, while also having a display of the overall monthly payments one would need to make in order to pay it all down.

The requirements were the following :

• * If the Loan bar changes in value in one direction, i.e. it goes up; then the Down Payment bar goes in the opposite direction and vice versa.
• * The Home Value bar, should influence the max amount of the Loan Amount and Down Payment values.
• * The monthly payment should change, as each bar is set, and display the mathmatically relevant price for a monthly payment.
• * And as eacdh value is input, the pi chart will display the principle and overall interest amount in the time frame of the payments.
• * Lastly the UI should change depending on the device screen width.

The challenge this had brought, was that in previous experience a react project only required one js file such as what would be used in codepen.io. However, this required multiple useStates for various files and a deeper understanding of how everything interconnects. As well as learning how to access and utilize MaterialUI's preset displays for a very professional and pleasant appearance for the user. It was a fantastic learning experience, with a few bumps along the way, and with an overall satisfying result.