The latest articles on DEV Community by Nilesh (@nilesh-padiyar). https://dev.to/nilesh-padiyar https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3896998%2F8dd318fe-25e5-4806-a615-8f646b77341f.png https://dev.to/nilesh-padiyar en Nilesh Sat, 25 Apr 2026 05:02:40 +0000 https://dev.to/nilesh-padiyar/billforge-a-lightweight-invoice-generator-with-pdf-export-google-sheets-sync-86m https://dev.to/nilesh-padiyar/billforge-a-lightweight-invoice-generator-with-pdf-export-google-sheets-sync-86m <h1> 🚀 I built a lightweight Invoice Generator using HTML, CSS &amp; JavaScript </h1> <p>Most invoice tools I’ve used are either:</p> <ul> <li>Too heavy</li> <li>Require login/signup</li> <li>Or feel overkill for simple use cases</li> </ul> <p>So I decided to build something minimal.</p> <p>👉 Introducing <strong>BillForge</strong> — a lightweight invoice generator that runs entirely in the browser.</p> <h2> 💡 What I wanted to solve </h2> <p>I wanted a tool that:</p> <ul> <li>Works instantly (no setup)</li> <li>Doesn’t require a backend</li> <li>Generates clean, printable invoices</li> <li>Can export to PDF easily</li> </ul> <h2> ✨ Features </h2> <ul> <li>🧾 Dynamic invoice creation</li> <li>➕ Add / remove items</li> <li>💰 Real-time total calculation</li> <li>📄 Export as PDF</li> <li>📤 Share via WhatsApp / Gmail</li> <li>☁️ Optional Google Sheets integration</li> </ul> <h2> 🛠 Tech Stack </h2> <ul> <li>HTML5</li> <li>CSS3</li> <li>Vanilla JavaScript</li> <li>html2canvas (for capturing UI)</li> <li>jsPDF (for PDF generation)</li> </ul> <h2> ⚙️ How it works </h2> <p>The app captures the invoice layout using <code>html2canvas</code>, then converts it into a PDF using <code>jsPDF</code>.</p> <p>For optional backend support, I used <strong>Google Apps Script</strong>, which stores invoice data in Google Sheets.</p> <h2> 🎥 Demo </h2> <p>👉 Live Demo: <a href="https://nilesh-padiyar.github.io/billforge/" rel="noopener noreferrer">https://nilesh-padiyar.github.io/billforge/</a><br> 👉 GitHub: <a href="https://github.com/nilesh-padiyar/billforge" rel="noopener noreferrer">https://github.com/nilesh-padiyar/billforge</a></p> <h2> 🧠 What I learned </h2> <ul> <li>Handling DOM-based PDF generation isn’t always straightforward</li> <li>Balancing PDF quality vs file size is tricky</li> <li>Keeping UI clean makes a big difference in usability</li> <li>Even simple projects can benefit from optional backend integrations</li> </ul> <h2> 🚀 What’s next? </h2> <p>I’m thinking of adding:</p> <ul> <li>Invoice history</li> <li>Custom themes</li> <li>Export to CSV/Excel</li> </ul> <h2> 🙌 Feedback welcome </h2> <p>I’d love to hear:</p> <ul> <li>What features would you expect in such a tool?</li> <li>Any improvements or ideas?</li> </ul> <p>Thanks for reading!</p> javascript showdev sideprojects webdev