01
Office formats in the browser
PDF is easy; DOCX and PPTX aren't. Wiring mammoth, docx-preview, and a PPTX renderer behind one preview hook — with graceful fallbacks per format — took more iteration than any backend feature.
Case study · 2024 — 2026 · Live · 150+ students
QuickLabs Pro
The study-resource platform my university actually needed — verified lab solutions, in-browser previews, and 150+ student users.
Role
Solo designer, developer & operator
Type
Product · Learning platform
Year
2024 — 2026
Links
React 19TypeScriptViteTailwind 4 · shadcn/uiTanStack QueryNode.js · ExpressPostgreSQL
01 / 04
QuickLabs Pro home — verified labs for university students
Overview
Every semester, the same ritual: lab manuals due, solutions scattered across WhatsApp groups in blurry photos, seniors' PDFs lost forever. QuickLabs started as 'Study Buddy' — my cheeky fix for that — and grew into a real platform where students share verified lab solutions and study material, scoped to their university, branch, batch, and semester.
Version one served 150+ authenticated students at my university. The Pro rebuild re-architected everything: TypeScript end to end, PostgreSQL with raw SQL, in-browser document preview, and a proper social layer.
150+
Student users on v1
21K
Lines of TypeScript
15
PostgreSQL tables
10×75MB
Files per upload
The problem
University study material has a discovery problem and a trust problem. The files exist — in someone's drive, some group chat, some senior's laptop — but finding the right solution for your batch's version of the lab, and knowing it's correct, is pure luck.
I wanted uploads organised by the academic hierarchy students actually live in (university → branch → batch → semester), previewable without downloading mystery files, and rated by the peers who used them. And yes — it began as a joke about 'leaking' assignment solutions for my own convenience. The university's students profited; so did my transcript.
What I built
A full platform around documents, subjects, and the students themselves:
Materials
2 kindsInformational docs and lab solutions — multi-file uploads, per-attachment management, zip downloads
In-browser preview
4 formatsPDF, DOCX, PPTX, and images render in the browser — no download roulette
Academic scoping
4 levelsUniversity → branch → batch year → semester filtering on every list
Social layer
★Peer ratings, student bookmarks, enquiry threads with voting, leaderboard
Fair-use quotas
DailyPer-student upload/download limits with race-proof accounting
Engineering highlights
Race-proof daily quotas
Quota accounting uses Postgres advisory transaction locks plus SELECT … FOR UPDATE, so parallel downloads can't slip past the daily limit — the kind of correctness usually skipped in student projects.
One handler, two audiences
Router factories instantiate the same endpoints under /admin and /students with different role guards — no duplicated controllers, no drift between the two scopes.
Streaming zip downloads
Multi-file documents stream as a zip built on the fly with archiver — slugified, de-duplicated names, no temp files, correct Content-Disposition even for Unicode filenames.
Database as last line of defence
Postgres triggers enforce the 10-files-per-document cap, partial unique indexes guarantee one main file per document, and CHECK constraints stop self-ratings — invariants hold even if app code slips.
Technical challenges
02
Raw SQL by choice
No ORM: a WithDatabase higher-order function injects a pooled client into every controller and guarantees release. Writing the SQL by hand made the data model tighter and the slow queries obvious.
03
Operating a real user base
150+ students meant real support: quota disputes, upload failures on hostel Wi-Fi, takedown requests. Running the platform taught as much as building it.
Outcome
QuickLabs became the unofficial material hub for my batch — 150+ students authenticated through Google and used verified lab solutions instead of chasing files through chat history.
The Pro rebuild is my reference codebase for doing full-stack TypeScript properly: typed end to end, invariants in the database, and a UI (Tailwind 4 + shadcn) that finally looks like the product it always wanted to be.
What's next
SuperDesk AI doubt-solverMore universitiesMobile PWA polish