Skip to content

Latest commit

 

History

History
77 lines (50 loc) · 2.53 KB

README.md

File metadata and controls

77 lines (50 loc) · 2.53 KB

Expense Manager

Expense Manager is a React application that allows you to organize and manage your expenses according to your budget.

Live Demo

You can check out the live version of the Expense Manager app deployed on Vercel by clicking the link below:

Expense Manager - Live Demo

Features

  • Set a budget: You can enter a budget and track your expenses accordingly.
  • Visualize budget and expenses: View your budget, expenses, and remaining budget in a panel, where the expenses are represented with a pie chart.
  • Add expenses: Use a modal to input your expenses, which will then be rendered in a list in the layout.
  • Categorize expenses: Filter your expenses by category.

Technologies Used

The project was developed using:

  • React: A JavaScript library for building user interfaces.
  • Vite: A fast build tool for modern web applications.
  • TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
  • Context API: A React feature for managing global state.
  • useReducer: A React hook for managing complex state logic.
  • Custom Hooks: For managing global context.
  • Tailwind CSS: A utility-first CSS framework for styling.
  • react-swipeable-list: An npm package for creating swipeable lists.
  • react-circular-progressbar: A library for creating circular progress bars.
  • @headlessui/react: For rendering animated modals.
  • vercel: A platform for deploying and hosting web applications quickly and efficiently. It offers automatic deployment, preview of changes, and a global CDN to enhance performance.

How to Run the Project

  1. Clone the repository:

    git clone https://github.com/habidbesp/Expense-Manager.git

  2. Navigate to the project directory:

    cd Expense-Manager

  3. Install dependencies:

    npm install

  4. Run the project in development mode:

    npm run dev

  5. Open in your browser: http://localhost:5173

Course Information

This application was developed as part of the Udemy course:

"React: Hooks y State hasta TypeScript, Zod, Zustand, React Query, Next.js, React Router, MERN y PERN"

Taught by: Juan Pablo De la Torre Valdez
More about the course

Contributions

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

License

This project is licensed under the MIT License.