Inflector Information
The Inflector ("inflation projector") helps people account for inflation when planning their budgets. It uses monthly spending data inputted by the user, coupled with real-time inflation rates, to estimate their monthly spending for the next year.
Three peers and I made the Inflector during a time of high inflation rates, and effectively addressed a real-world problem: financial planning amidst economic turbulence. The website has helped over 400 people plan their budgets (and counting). As a result, my team won First Place Overall (Division Sigma) for the project at Ignition Hacks 2022, a 500-person hackathon.
My teammates and I used Bootstrap, HTML/CSS, JavaScript, and Figma to create the Inflector. Bootstrap was used to make a user-friendly interface, while HTML/CSS helped me customize elements of the website. JavaScript was used to access an Inflation API, fetching real-time inflation data and performing calculations with it. Finally, Figma was used to create a design for the webpages.
My role in the project primarily involved implementing the Figma design using Bootstrap and HTML/CSS. I also added some of the JavaScript code that accesses the API and deployed the website.
My team faced many obstacles during development, the biggest of which was that the calculation results refused to display on the webpage.
By testing the JavaScript code in an IDE, I confirmed that the calculations were working - the issue was in the website integration. After scouring JavaScript documentation and Stack Overflow, I found that the problem lay in the order of events, with the calculations finishing after the website loaded.
To address this, I added the line "async: false" to ensure the calculations happened before the final projections page loaded, efficiently resolving the issue.