This React application provides a GitHub contribution heatmap-like calendar, displaying all transactions made within the last year interactively. Users can click on any date to track the expenses incurred on that particular day.
Documentation for this project are available at Docs
- Interactive Calendar: Users can view all transactions made in the last year by navigating through an interactive calendar.
- Transaction Analytics: Detailed analytics are provided for each selected date, including:
- Number of transactions on a day
- Total spending for the day
- Breakdown of debit and credit transactions
- Graphical Representation: A graph displays the amount of transactions over time, providing a visual representation of spending patterns.
- Frontend:
- React: Utilized for building the user interface and managing the application's state.
- Tailwind CSS: Employed for styling and designing the user interface, ensuring a sleek and responsive design.
- Figma: Used for designing and prototyping the application's UI/UX.
- Lottie Files: Implemented for animations within the application.
- data-aos: Integrated for smooth and visually appealing animations.
- Documentation:
- Docusaurus: Utilized for documenting the project, providing comprehensive and easy-to-navigate documentation for users and contributors.
To get started with the GitHub Contribution Heatmap Tracker, follow these steps:
- Clone this repository to your local machine.
- Install dependencies using
npm install
. - Start the development server using
npm start
. - Access the application in your browser at
http://localhost:3000
.
We welcome contributions from the community! If you'd like to contribute to this project, please follow these guidelines:
- Fork the repository and create your branch from
main
. - Make your changes and ensure they adhere to the project's coding conventions.
- Test your changes thoroughly.
- Create a pull request detailing your changes and their purpose.
For any inquiries or support, feel free to reach out to me at Portfolio,would love to hear from you!