URL shortener

About the Project

URL shortener is a full-stack web application built with Next.js and Express. It implements secure JWT authentication using HttpOnly cookies and follows a Backend-for-Frontend (BFF) pattern to solve cross-origin cookie issues in production. The application allows users to generate short links, track click analytics, and manage URLs through a personalized dashboard. Deployed on Vercel (frontend) and Render (backend), the project demonstrates real-world authentication, deployment, and security best practices.

Key Features

Secure JWT authentication with HttpOnly cookie storage (XSS-resistant)
Backend-for-Frontend (BFF) pattern using Next.js API routes
User dashboard displaying created links, click counts, and creation dates
Unique short-code generation and instant URL redirection
Click analytics tracking and optimized database lookup
Protected routes and backend token verification middleware
Copy-to-clipboard functionality for shortened links
Responsive UI optimized for all device sizes

URL shortener

full-stack

Tech Stack

TypeScript
Next.js
React
TailwindCSS
Node.js
Express
MySQL
JWT