Browser-Based Invoice Payment Slip Generator
Mario Žitković
Browser-Based Invoice Payment Slip Generator
Privacy-focused React application that turns PDF and UBL invoices into Croatian HUB-3 payment slips and PDF417 barcodes.
Main page
Overview
I built Uplatko, a browser-based tool for turning invoices into Croatian payment slips.
Users can upload a PDF or UBL 2.1 invoice, review the extracted payment information and generate a HUB-3 payment slip with a scannable PDF417 barcode.
The core workflow runs entirely in the browser, so standard invoice documents do not need to be uploaded to a backend server.
Stack: React · TypeScript · PDF.js · pdf-lib · PDF417
The problem
Croatian invoices often contain all the information needed for a bank transfer, but the user still has to manually copy:
IBAN
amount
recipient
payment model
reference number
payment description That is repetitive and easy to mistype.
The goal was to let the user upload an invoice and turn that data into a payment-ready format with as little manual work as possible.
Privacy as an architectural decision
The simplest architecture would have been to upload every invoice to a backend and process it there.
I deliberately avoided that for the standard workflow.
Invoices may contain personal or commercially sensitive information, so PDF and UBL processing happens directly in the browser.
That means:
less sensitive data leaves the user's device
there is no backend storage requirement for normal processing
the architecture stays lightweight
Optional AI-assisted parsing can be used separately for documents with non-standard layouts.
What I built
The application handles:
PDF invoice parsing
UBL 2.1 structured invoice data
payment-detail extraction
HUB-3 payment-slip generation
PDF417 barcode generation
PDF manipulation in the browser
user confirmation before final output
The application is written in React and TypeScript. PDF.js is used for document reading, while pdf-lib is used where PDF generation or modification is required.
Generating a usable payment result
The goal was not simply to extract text from a document.
The extracted values have to be mapped correctly into the Croatian payment format and then encoded into a barcode that banking applications can read.
The user can review the data before generating the final output, which keeps the workflow fast without hiding the extracted values.
Finished result
Why I like this project
Uplatko is deliberately small in infrastructure but not trivial in implementation.
It combines:
document parsing
structured invoice formats
browser-side processing
barcode generation
privacy-oriented architecture
a workflow where incorrect values matter
It is a good example of choosing a simpler architecture because it better fits the actual problem.
Like this project
Posted Sep 22, 2026
Built Uplatko, a tool that converts invoices to Croatian payment slips with privacy in mind.
Likes
0
Views
2
