https://github.com/akshay-2396/invoice-builder
Invoice Builder with Pdf Export
https://github.com/akshay-2396/invoice-builder
html2canvas jspdf react-hooks reactjs tailwindcss
Last synced: 2 months ago
JSON representation
Invoice Builder with Pdf Export
- Host: GitHub
- URL: https://github.com/akshay-2396/invoice-builder
- Owner: Akshay-2396
- Created: 2025-07-01T11:24:27.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-07-01T11:48:01.000Z (12 months ago)
- Last Synced: 2025-07-01T12:45:21.653Z (12 months ago)
- Topics: html2canvas, jspdf, react-hooks, reactjs, tailwindcss
- Language: JavaScript
- Homepage: https://invoicebuilderapp.netlify.app/
- Size: 41 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🧾 Invoice Builder
A responsive invoice generation web application built using React JS. It enables users to create and manage invoices dynamically with features like real-time calculations, client and item data handling, and PDF export.
# ✅ Features
# 🔨 Invoice Creation
* Input fields for client details: name, address, invoice number, and date.
* Auto-filled due date: 7 days after the selected invoice date.
* Add multiple items with fields:
* Description (required)
* Quantity
* Unit Rate
* Amount (auto-calculated)
# ✔ Validation:
* Cannot add items without filling all fields.
* Description field must not be empty – alerts user.
* While Preview Also All field must be filled without that can't download PDF -alerts user
# 🧮 Real-time Calculation
* Auto-calculate:
Subtotal
Tax
Grand Total
# ✏️ Editing and Deletion
* Edit or delete any item before finalizing the invoice.
* Invoice number and date can be updated anytime.
# 🧾 PDF Export
* Export or print the invoice as a downloadable PDF.
* PDF layout maintains formatting and includes all invoice details clearly.
# 🤷♂️ User Actions
Enter client and billing details.
Add/Edit/Delete line items.
View real-time totals and tax calculations.
Export or print invoice as PDF.
# 👨💻 Tech Stack
* React JS
* TailwindCSS
* React Hooks for state management
* jspdf & html2canvas for PDF export
## 🚀 Deployment
- https://invoicebuilderapp.netlify.app/