Billr: Architecting a Secure, High-Velocity Invoicing Platform
The B2B invoicing market is dominated by massive, monolithic software suites that are overly complex for solopreneurs, freelancers, and agile agencies. These users don't require enterprise resource planning (ERP) integration; they need a lightning-fast interface to generate compliant PDFs, send automated reminders, and collect payments via Stripe with zero friction.
Billr was engineered to disrupt this space by focusing entirely on UX speed and localized tax compliance. This masterclass outlines the architectural decisions behind building a financial application that generates secure, pixel-perfect PDFs on the client side while securely managing Stripe Connect webhooks on the edge.
The Business Problem: Invoice Friction and Data Privacy
Freelancers face severe cash flow bottlenecks due to clunky invoicing processes. Standard web applications attempt to solve this by generating invoices on a backend server and emailing them. This creates several problems:
Build Your Custom Platform
Don't leave your engineering outcomes to chance. Book a technical strategy call with our lead architects today.
Book a Technical Strategy Call →- Server-Side PDF Generation Overhead: Generating a complex PDF utilizing Puppeteer or wkhtmltopdf on an AWS server is notoriously slow and CPU-intensive, creating massive latency when a user clicks "Preview Invoice."
- Data Privacy Concerns: Users are increasingly uncomfortable storing highly sensitive client financial data, tax IDs, and addresses on third-party servers.
- Payment Reconciliation: Matching a paid Stripe invoice back to the internal database reliably across global webhooks requires bulletproof idempotency.
Architectural Deep Dive & Outcome-Based Solutions
1. Client-Side PDF Generation (WebAssembly)
To completely eliminate the latency of server-side PDF generation, we pushed the computation directly to the user's browser.
- PDF-Lib & React-PDF: We integrated
pdf-libvia WebAssembly (WASM). When a user builds an invoice in the React dashboard, the PDF is compiled instantly within the DOM memory. - Instant Previews: Because the PDF is generated client-side, the "Live Preview" panel updates instantaneously as the user types. There is no network request required to view the final document.
- Outcome: Infrastructure costs for PDF generation were reduced to zero. The user experience is vastly superior to competitors, as the application feels as responsive as a native desktop program.
2. Stripe Connect & Idempotent Webhooks
Managing payments for third-party freelancers requires acting as a platform mediator without holding the funds directly, which triggers severe compliance (KYC/AML) regulations.
- Stripe Connect Integration: We implemented Stripe Connect. Users link their own Stripe accounts to Billr via OAuth. When an invoice is paid, the funds route directly from the client to the freelancer; Billr only processes a small application fee algorithmically.
- Webhook Idempotency: Financial webhooks can misfire or be delivered twice due to network latency. We architected a robust webhook listener using Next.js Route Handlers. Every incoming Stripe event is checked against an
event_idindex in the Supabase PostgreSQL database. If the event was already processed, the backend safely discards the duplicate. - Outcome: Absolute financial accuracy. The idempotency guarantees that an invoice is never marked "Paid" twice, and freelancers receive funds instantly without Billr assuming any regulatory liability for holding capital.
3. Edge-Based Authentication and RLS
Because Billr handles sensitive client data (addresses, tax identification numbers), security could not be compromised.
- Supabase Auth & Row Level Security (RLS): Authentication is handled via Supabase Auth. More importantly, we enforced strict Row Level Security policies at the database schema level.
- Zero-Trust Queries: Even if a malicious actor successfully bypassed the frontend and queried the API directly, the PostgreSQL engine mathematically guarantees they can only retrieve rows where
user_id == auth.uid(). - Outcome: Enterprise-grade security out-of-the-box. The attack surface is incredibly small because the database inherently distrusts the application layer, relying on cryptographically signed JWTs to resolve queries.
4. Localized Tax Compliance Engine
Global invoicing requires managing VAT, GST, and varying State Sales Taxes, which constantly fluctuate.
- Dynamic Tax Architecture: Instead of hardcoding tax rates, we built a dynamic taxation engine. The frontend uses
react-hook-formandzodto validate the geographical nexus of both the sender and the receiver. - Outcome: The platform automatically calculates Reverse Charge VAT for EU B2B transactions and standardizes localized formatting (e.g., currency symbols, date formats), entirely removing the cognitive load from the freelancer.
Summary of Execution
Billr is a masterclass in utilizing Client-Side computation and Edge infrastructure to build a superior financial utility.
By shifting the heavy CPU load of PDF generation to the browser and leveraging Stripe Connect for frictionless compliance, we built a highly lucrative SaaS product. The platform operates with minimal overhead, infinite scalability, and absolute financial security, empowering independent workers to manage their cash flow with enterprise-grade tooling.