Skip to content

weezykon/Personal-Finance-Tracker

Repository files navigation

Personal Finance Tracker

A simple and intuitive personal finance tracker application built with React, TypeScript, and Vite. This application helps users manage their income and expenses, categorize transactions, and gain insights into their financial habits.

Features

  • Dashboard Overview: Get a quick summary of your financial status.
  • Transaction Management: Easily add, view, and manage your income and expense transactions.
  • Category Management: Create and organize custom categories for your transactions.
  • Filtering and Sorting: Filter transactions by category, type, or date range.
  • Data Persistence: All your data is saved locally in your browser's local storage.
  • Responsive Design: Enjoy a seamless experience across various devices.

Technologies Used

  • React: A JavaScript library for building user interfaces.
  • TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
  • Vite: A fast build tool that provides a lightning-fast development experience.
  • Tailwind CSS: A utility-first CSS framework for rapidly building custom designs.
  • Vitest: A fast and modern testing framework powered by Vite.
  • React Testing Library: A set of utilities for testing React components.
  • Recharts: A composable charting library built with React and D3.

Getting Started

Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

Make sure you have the following installed:

  • Node.js (LTS version recommended)
  • npm (comes with Node.js)

Installation

  1. Clone the repository:
    git clone https://github.com/your-username/personal-finance-tracker.git
    cd personal-finance-tracker
  2. Install dependencies:
    npm install

Running the Application

To run the application in development mode:

npm run dev

This will start the development server, and you can view the application in your browser at http://localhost:5173 (or another port if 5173 is in use).

Building for Production

To build the application for production:

npm run build

This will compile and optimize the application for deployment, placing the output in the dist/ directory.

Running Tests

To run the unit and integration tests:

npm test

Usage

(This section will be expanded as the application features are fully implemented and demonstrated.)

Once the application is running, you can:

  1. Add Transactions: Use the transaction form to input new income or expense records.
  2. Manage Categories: Open the category manager to add, edit, or delete transaction categories.
  3. View Dashboard: See an overview of your financial data, including charts and summaries.
  4. Filter Transactions: Use the filter controls to narrow down your transaction list.

Contributing

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'feat: Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

License

Distributed under the MIT License. See LICENSE for more information.

About

A simple and intuitive personal finance tracker application built with React, TypeScript, and Vite. This application helps users manage their income and expenses, categorize transactions, and gain insights into their financial habits.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors