今日已更新 67 条资讯 | 累计 29520 条内容
关于我们

I built an invoice generator with no backend — the whole app is one HTML file

Ahmed Memon 2026年08月04日 21:00 7 次阅读 来源:Dev.to

Every invoicing tool I tried wanted an account, a subscription, and a copy of my client list on its servers — then charged me monthly to put my own logo on my own invoice. So I built the opposite. Billfold is a complete invoice generator that runs entirely in your browser. No account, no backend, no build step. The whole app is a single index.html file you could email to yourself. It's MIT-licensed and the source is right here: github.com/quantum-hacker0/billfold . Here are the three parts that were actually fun to build. 1. "No server" isn't a privacy policy — it's the architecture The usual pitch is "we take your privacy seriously." That's a promise you have to trust. I wanted it to be a fact you can verify : Open DevTools → Network, create an invoice, and count the requests. It's zero. There's nothing to upload because there's nowhere to upload it. Data lives in localStorage . The app is HTML/CSS/JS inlined into one file — no framework, no bundler, no node_modules . Download it once and it works offline forever. 2. Sharing an invoice without a database — put it in the URL hash This was the interesting constraint. How do you send someone a view-only invoice when you have no server to store it on? The trick: encode the whole document into the URL hash fragment . The fragment (everything after # ) is the one part of a URL that browsers never send to the server — it stays client-side. function shareLink ( state ) { const json = JSON . stringify ( state ); const encoded = btoa ( unescape ( encodeURIComponent ( json ))) . replace ( / \+ /g , ' - ' ). replace ( / \/ /g , ' _ ' ). replace ( /=+$/ , '' ); // base64url return location . origin + location . pathname + ' #v= ' + encoded ; } The recipient's browser reads the fragment, decodes it, and renders the invoice locally. The data rides inside the link and never touches a host — not even mine. PDF export, by the way, is just window.print() with a print stylesheet. 3. Invoices as URLs — with an npm package Because the a

本文内容来源于互联网,版权归原作者所有
查看原文