SnapLink

Inspiration

I wanted to build something more practical than a basic URL shortener. The idea behind SnapLink was to create a simple platform where users could not only shorten URLs but also manage their links, track clicks, view analytics, and generate QR codes from one dashboard.

What it does

SnapLink is a full-stack URL management platform. Users can register and log in, create short URLs, edit and delete their links, search their URLs, generate QR codes, and monitor click statistics through a dashboard.

How we built it

I built the frontend using React, Vite, Tailwind CSS, React Router, Axios, and Framer Motion. The backend uses Node.js, Express.js, PostgreSQL, and Drizzle ORM. JWT is used for authentication and protected routes, while Zod is used for request validation. The frontend and backend communicate through REST APIs. The frontend is deployed on Vercel and the backend on Render.

Challenges we ran into

One of the biggest challenges was connecting all parts of the application reliably. I worked through authentication, CORS configuration, database queries, URL ownership, click tracking, environment variables, and production deployment. We also had to debug dependency and configuration issues while deploying the pnpm-based backend.

Accomplishments that we're proud of

I proud of turning a simple URL shortener into a complete URL management platform. It includes authentication, URL CRUD operations, search, click tracking, analytics, QR code generation, and a responsive dashboard. We also successfully deployed the frontend, backend, and database for real-world use.

What we learned

I project gave us practical experience in building and deploying a full-stack application. I learned how React communicates with an Express REST API, how JWT authentication and protected routes work, how PostgreSQL and Drizzle ORM handle application data, and how environment variables, CORS, and deployment affect a production application.

What's next for SnapLink

I plan to add more advanced analytics, link expiration, password-protected links, custom domains, Google authentication, team workspaces, and more detailed click insights. The goal is to gradually turn SnapLink into a more complete link-management platform.

Built With

• axios
• css
• drizzle
• express.js
• jwt
• node.js
• orm
• postgresql
• react
• render
• tailwind
• vercel
• vite