Versai — faster, more consistent delivery
Replaced per-feature UI rebuilds with one shared component library and pre-commit quality gates — so a small remote team shipped faster, with fewer regressions and a consistent UX across the product.
- 4
- Core surfaces shipped
- 3 yrs
- On the core product
- Fewer
- Regressions, via lint + gates
React · Next.js · TypeScript · React Query · Redux · Tailwind CSS · Storybook
Versai was where I learned that the highest-leverage frontend work on a product team is often the foundation underneath the features — the library, the gates, and the instrumentation that make everyone faster.
Context
Versai is a web platform. Over nearly three years I worked across its most complex surfaces — the admin dashboard, the website builder, templates, and video conferencing — handling large, complex data.
Problem
Feature work was outpacing the team's shared foundations: UI was rebuilt per feature, code quality varied between contributors, and there was little visibility into how users actually moved through the product.
Constraints
- A small remote team shipping continuously — improvements had to land without stopping feature delivery.
- The surfaces (builder, dashboard) were genuinely complex and data-heavy, so abstractions had to earn their place.
Decisions
-
Build a reusable React component library documented in Storybook.
Why Standardising the common UI removed per-feature rebuilds and gave the team a shared vocabulary.
-
Add ESLint + Husky pre-commit gates.
Why Catching issues at commit time is cheaper than in review or production, and it makes "consistent" the default rather than a request.
-
Instrument the product with Mixpanel.
Why Decisions about the UI should be informed by how people actually use it, not by assumption.
Trade-offs
-
Investing in a shared library and tooling over Shipping each feature in isolation
On a long-lived product, the compounding cost of duplication and drift outweighs the upfront cost of a foundation.
Results
- Delivered admin dashboard, website builder, templates, and video-conferencing surfaces.
- A reusable component library with Storybook that standardised UI and accelerated delivery.
- Measurable performance gains by removing dead code, applying memoization, and tuning rendering.
- ESLint + Husky gates that raised baseline code quality and cut avoidable bugs.
Lessons
- Developer experience compounds — every gate and shared component pays off on every later change.
- Instrumentation changes arguments from opinion to evidence.