Document Creator
A drag-and-drop PDF report-template builder with a template → snapshot → PDF pipeline and approval workflow.

01 / Overview
Role: Sole architect and developer - built from scratch
Built a PDF report-template builder from scratch for a B2B SaaS analytics platform: a drag-and-drop canvas (reusing the platform's dashboard widget system) for building reusable report templates, which then generate tenant-specific "snapshot" PDF documents on demand. Owns the full template → snapshot → PDF pipeline, including an approval workflow for finished documents. The underlying layout engine (GridStack, a DOM-driven grid library) doesn't naturally play with Vue's reactivity model, which produced a persistent class of ordering, reflow, and pagination bugs - rebuilt the state layer around a dedicated store with proper dirty-tracking, and root-caused and fixed a series of deep layout and pagination bugs through direct reproduction and instrumentation.
Template → snapshot → PDF pipeline with an approval workflow
Drag-and-drop widget canvas reusing the Custom Dashboards widget library
Paginated live preview with page-break warnings, alongside true PDF export
Rebuilt state management (Pinia store, proper dirty-tracking) to fix a class of layout bugs rooted in a DOM-driven grid library fighting Vue's reactivity model
02 / Problem
Analysts needed reusable report templates that could produce tenant-specific PDF documents on demand, with an approval step before anything went out.
03 / Decisions
04 / Outcome
The tool runs the full template → snapshot → PDF pipeline with an approval workflow. Users build templates on a drag-and-drop canvas that reuses the Custom Dashboards widget library, and a paginated live preview warns about page breaks before export.
05 / Stack
- NuxtFrontend
- GridStackFrontend
- VueFrontend
- PiniaFrontend