A full-featured Invoice Management Web Application built with React, TypeScript, Vite and Tailwind CSS. This project allows users to create, edit, delete and manage invoices with a clean, responsive and beautiful interface. Fully deployed and live!
👉 https://invoiceappexpenses.netlify.app/
- Responsive Design (Mobile, Tablet, Desktop)
- Create, Edit and Delete Invoices
- Filter Invoices by Status (Draft, Pending, Paid)
- Dark Mode / Light Mode toggle
- Smooth animated sliding edit panel
- State management with Zustand
- Form management with React Hook Form
- Local data persistence (for demo)
- Fully deployed using Netlify
| Technology | Purpose |
|---|---|
| React | UI Library |
| TypeScript | Type Safety |
| Vite | Build Tool |
| Tailwind CSS | Styling |
| React Hook Form | Form Handling |
| Zustand | Global State Management |
| Framer Motion | Animations |
| React Router | Routing |
| Netlify | Deployment |
1️⃣ Clone the repository:
git clone https://github.com/YOUR_USERNAME/Invoice-App.git cd Invoice-App
2️⃣ Install dependencies:
npm install
3️⃣ Start the development server:
npm run dev
App runs at http://localhost:5173/
• 🔐 Add User Authentication (e.g. Firebase, Supabase)
• ✅ Full testing suite with Jest + React Testing Library
Ruben Hernandez • GitHub: @Rubenhdz20
This project was created to simulate a real-world frontend application with: • Pixel perfect UI • Fully responsive design • Component-based architecture • Reusable patterns • State management • Animations • Future extensibility for full-stack capabilities