Transaction Manager Application

This project is a Transaction Manager application, created as part of a Codolio.com assignment. The application enables users to manage their financial transactions efficiently with functionalities for adding, editing, and deleting transactions.

Pie and Doughnut Charts:

Input Fields :

Table Data :

Features

Transaction Management

• Add Transaction: Users can add new transactions with details such as date, amount, category, title, and note. The application supports both Income and Expense types.

• Edit Transaction: Existing transactions can be updated, allowing users to modify any details as needed.

• Delete Transaction: Users can remove transactions from the list, ensuring they can keep their records up to date.

Data Visualization

•Income and Expense Charts:

• Pie Chart: Displays income distribution by category.

• Doughnut Chart: Shows expense distribution by category.

• These charts provide visual insights into spending and earning patterns, helping users understand their financial behavior better.

Filtering and Search

• Search Transactions: Users can search transactions by title.

• Filters: Transactions can be filtered based on type (Income or Expense), category, and currency. This helps users quickly find specific transactions or view transactions that meet certain criteria.

Responsive Design

• The application is designed to be responsive, ensuring that it provides a seamless experience on desktop, tablet, and mobile devices.

User Interface

• Transaction Table: Displays transactions grouped by date with the ability to view total income and expenses for each day. The interface is clean and user-friendly, with options for editing and deleting transactions directly from the table.

Technologies Used

• React: For building the user interface.

• Redux: For state management.

• Chart.js: For data visualization with Pie and Doughnut charts.

• Tailwind CSS: For styling and responsive design.

Installation

1. To clone this repo

git clone https://github.com/yourusername/transaction-manager.git

2. Navigate into the project directory:

cd transaction-manager

3. Install the dependencies:

npm install

4. Start the development server:

npm run dev

Usage

• Open the application in a web browser to view and manage transactions.

• Use the provided forms and filters to interact with the transaction data.

• Visualize financial data through the integrated charts for better insights.

Contributing

Contributions are welcome. Please open an issue or submit a pull request for any enhancements or bug fixes.