Skip to content

Pushkar021/Expense-Splitter

Repository files navigation

Expense Splitter App

Overview

The Expense Splitter App is a simple and efficient tool built using React and Vite for managing shared expenses among friends and groups. It offers an intuitive interface for recording expenses and keeping track of who owes what. The app works seamlessly on both mobile and desktop platforms, with an optimized user experience for mobile devices.

Features

  • React & Vite-Based: Developed using React with Vite as the build tool, providing a fast and modern development experience.
  • LocalStorage Integration: Data is stored locally, so your expense records persist even after closing the app.
  • Mobile-Optimized: Designed with a focus on mobile usability, making it easy to use on the go.
  • User-Friendly Interface: Simple and clean design for effortless navigation and interaction.
  • Add, Track, and Manage Expenses: Easily add friends, enter expenses, and view balances in real-time.

Live Demo

Check out the live version of the app: Expense Splitter App

Screenshots

App

Getting Started

Prerequisites

To run this project locally, you need to have:

  • Node.js installed on your machine.
  • npm (Node Package Manager) or yarn.

Installation

  1. Clone the repository:

    git clone https://github.com/Pushkar021/Expense-Splitter.git
  2. Navigate to the project directory:

    cd Expense-Splitter
  3. Install the dependencies:

    npm install

    or

    yarn install

Running the App

To start the development server:

npm run dev

or

yarn dev

This will start the app locally. Open your browser and go to http://localhost:5173 (default Vite port) to see it in action.

Usage

  1. Add Friends: Enter a friend's name and details to add them to the list.
  2. Record Expenses: Input the total amount and your share to calculate how much each person owes.
  3. Track Balances: View the list of friends and see who owes money to whom.

Technologies Used

  • React: Frontend framework for building the user interface.
  • Vite: Build tool for a fast and optimized development environment.
  • LocalStorage: For persistent storage of user data on the client-side.
  • CSS: Styling the components for a mobile-friendly design.

Contributing

Contributions are welcome! If you have suggestions or improvements, feel free to open an issue or submit a pull request.

Links

Feel free to explore, use, and modify the app as needed. Your feedback is always appreciated!