03 / 2026
Clickfold
Full-stack link management platform built solo — campaign analytics, crawler-aware OG redirects, and a self-built REST API with a real test suite and Swagger docs.
RoleFull-Stack Developer
TimelineFebruary 2026 – present
Overview
Clickfold is a link management platform — shorten URLs with custom slugs, group them into campaigns, and track every click with geo, device, and referrer analytics. Unlike my agency work, I own both halves here: a Next.js 16 + TypeScript frontend and a separately deployed Express 5 + MongoDB REST API (clickfold-api), both designed, built, tested, and shipped solo. It's the project that shows what my backend looks like when nobody else is writing it: validated inputs, rate limits, soft deletes, structured logging, a Vitest + Supertest suite, and Swagger docs.
The challenge
A link shortener sounds trivial until you hit the details. A shortened link shared on WhatsApp or Discord must show its Open Graph preview — but a normal redirect means crawlers follow it and render the destination's tags, not yours. Every click must be logged with geo and device data without slowing the redirect. And the API had to hold up as a standalone product: documented, rate-limited, and testable without touching a real database on a serverless platform.
What I did
- Designed and built the REST API from scratch — Express 5 and MongoDB with Mongoose, controllers/models/routes/validators separation, and Swagger UI documentation at /api-docs
- Solved the redirect-vs-preview conflict on /l/[slug] — known crawler user agents render a page whose generateMetadata() serves the link's custom OG tags, while real visitors get an immediate server-side redirect with the click logged
- Built the click analytics pipeline — every hit captures geographic location, device, OS, browser, and referrer, aggregated per link and per campaign into Recharts dashboards
- Shipped authentication end-to-end — email/password and Google OAuth, JWT in HTTP-only cookies with token refresh, and password recovery over Resend transactional email
- Hardened the API like a product — Zod validation on every input, rate limiting, soft deletes for recovery, link expiration, and structured logging with Winston
- Built preview control per link — custom or auto-fetched OG title, description, and image, plus a UTM parameter builder, downloadable QR codes, and free-form tagging
- Handled media the boring-but-right way — avatar uploads through Cloudinary with automatic optimization
Deep dive
Redirects that keep their previews
The core trick of the product: a shortened link has to redirect humans instantly but still show a rich preview when pasted into Messages, WhatsApp, or Discord. Crawlers follow redirects, so a naive 302 makes every preview show the destination's metadata instead of the link's custom OG tags. The /l/[slug] route detects known crawler user agents and renders them a server component whose generateMetadata() serves the custom preview, while real visitors are redirected server-side with the click logged on the way through — no client-side flash, no lost analytics.
The analytics pipeline
Every click becomes an event with geographic location, device, OS, browser, and referrer attached, stored so it can be sliced per link or aggregated across a campaign. The dashboard reads those aggregates into Recharts visualizations — where clicks came from, which channel drove them, what devices they used. Campaigns turn individual links into a comparable set, which is the difference between a toy shortener and a marketing tool.
The API as a standalone product
The backend isn't a private appendage of the frontend — it's documented with Swagger UI, validates every input with Zod schemas, rate-limits abusive clients, soft-deletes for recovery instead of destroying data, supports link expiration, and logs with Winston. Designing the contract first and treating the API as its own deliverable is the discipline this project exists to demonstrate.
The result
A deployed, working full-stack product with both repositories public — frontend and API designed as a pair, built solo. It completes the set: EgyStay and Lesoll show production frontend work at scale; Clickfold shows I can design, secure, test, and document the backend too.