Budget Planner App

This repository contains files for a simple budget planner web application. Users can set their budget, track their expenses, and visualize their spending through a pie chart.

Files Included:

1. index.html:

   • Contains the structure and layout of the web application.
   • Includes input fields for setting the budget and entering expenses.
   • Displays the total budget, expenses, balance, and a list of expenses.
   • Utilizes Chart.js for displaying a pie chart.

2. style.css:

   • Defines the styles for the elements in the web application, including layout, colors, and responsiveness.

3. script.js:

   • Implements the functionality of the budget planner.
   • Handles setting the budget, adding expenses, updating the list of expenses, and updating the pie chart.
   • Utilizes DOM manipulation and event handling to interact with user inputs and update the UI accordingly.

Instructions:

To use the budget planner app:

1. Open index.html in a web browser.
2. Set your total budget by entering the amount in the designated input field and clicking the "Set Budget" button.
3. Enter expenses by providing the title of the expense and its cost, then click the "Check Amount" button.
4. The app will display the total budget, expenses, balance, and a list of expenses.
5. Additionally, a pie chart will visualize your spending, showing both expenses and the remaining balance.

Developer:

This budget planner app is developed by Milind Bhushan.

For any inquiries or issues, feel free to contact the developer.

UI: