Shrink, Track, Conquer: The Ultimate DIY URL Shortener Adventure!

Published on Wed Aug 28 2024
Home page of the URL Shortener

I developed an open-source URL Shortener to condense long URLs into short, aesthetically pleasing links and track their hits. It's customisable and perfect for developers to integrate into their applications. Whether for personal or commercial use, it's a versatile tool for link management. The motivation behind creating this open-source URL Shortener is improved link aesthetics, easier reading, simplified sharing, and reduced character count—especially important on platforms with text limitations. It aims to provide a customisable solution for developers to integrate into their applications, whether for personal or commercial use.

Problem Statement

Short URLs are useful when running large-scale campaigns with thousands of messages, particularly on platforms with strict text limitations. In these cases, using a URL shortener is essential for cost-efficiency. This project enables users to shorten URLs and monitor the number of clicks on each URL. It also records detailed information in the database each time a URL is clicked, providing valuable analytics for decision-making and strategy adjustments.

Many URL shorteners available in the market today come with a cost, which can be a barrier for individuals or small businesses. By open-sourcing this project, I aim to provide a free alternative that anyone can host and customize as per their requirements. This will empower both individuals and companies to manage their links without incurring the recurring costs associated with commercial URL shorteners.

Moreover, I have exposed REST APIs to allow developers to integrate this shortener into their projects seamlessly. Whether you want to host this URL shortener as a standalone service or integrate its functionality into an existing application, the APIs provide the flexibility needed to adapt the tool to various use cases. This makes the project more versatile and encourages a broader range of applications, from small personal websites to large-scale enterprise systems.


Project Overview

Technology Stack

To build this URL Shortener, I chose a combination of technologies to ensure scalability, efficiency, and ease of use:

  • Next.js: I used Next.js as the full-stack framework, enabling seamless integration of both frontend and backend functionalities. Its server-side rendering capabilities and built-in API routes made it an ideal choice for this project.
  • Prisma: For database operations, I used Prisma as the Object-Relational Mapping (ORM) tool. Prisma simplifies database access, providing a type-safe query experience, which speeds up development and reduces the likelihood of runtime errors.
  • PostgreSQL: I chose PostgreSQL as the database because of its reliability and advanced features. It effectively manages the relational data needed to track URLs and their usage.
  • Docker: To streamline the setup and management of the database, I used Docker to spin up a PostgreSQL instance. This ensured consistency across different environments and made it easy for others to replicate the setup.
  • Shadcn: For the user interface, I use Shadcn, a collection of reusable components that simplify creating a responsive and visually attractive UI.
  • Tailwind CSS: For styling, I chose Tailwind CSS for rapid development with utility-first CSS, and it worked well with Shadcn to create a cohesive and clean design.

Core Features

The URL Shortener project comes with several core features aimed at providing a comprehensive and user-friendly experience:

  • User Interface: A UI where users can easily generate short URLs and track their usage over time. The interface is simple, making it accessible even to those without technical expertise.
  • REST APIs: I have developed a set of REST APIs that enable developers to interact with the URL shortener programmatically. These APIs can create short URLs, fetch their details, and monitor their usage. This makes it simple to integrate the URL shortener into other projects or applications.

Challenges

One of the challenges faced during development was optimizing the performance of tracking URL hits. Calculating the total count of hits by counting rows in the database table could have led to performance bottlenecks, especially as the volume of data grew. To mitigate this, I decided to store the total hit count directly within the table containing the URL details. This approach reduced the need for frequent row counts and improved the overall efficiency of the application, ensuring that it could scale effectively even with large amounts of traffic.


Future Plans

Several enhancements are planned to improve the functionality and security of the URL shortener, making it more valuable for users and developers alike.

User Management and Dashboard

One of the main improvements is the introduction of user management features. Presently, the system does not link short URLs with specific users, which limits its functionality for individuals who need to manage multiple links. To resolve this, I intend to create a dashboard where users can:

  • Log In and Manage URLs: Users will be able to create accounts, log in, and access a personal dashboard. They can use the dashboard to view and manage their saved URLs. This feature will help users keep track of their URLs more effectively, making it easier to organize and edit their links.
  • View Analytics: The dashboard will offer insights on URL performance, enabling users to view metrics such as click counts and geographical data. This will assist users in making data-driven decisions and optimizing their link-sharing strategies.

API Key Authentication

To improve the security and control over API usage, I will introduce API key authentication. This improvement will involve:

  • Securing APIs: Currently, the REST APIs are open, which poses a risk of misuse or abuse. By implementing API key authentication, I will ensure that only authorized users and applications can access these endpoints.
  • Generating and Managing API Keys: The dashboard will also include functionality for users to generate and manage their API keys. This will provide a secure way for users to integrate the URL Shortener into their applications while maintaining control over access and usage.

The planned improvements aim to enhance the overall user experience, as well as to provide increased security and flexibility for both individual users and developers who are integrating the URL Shortener into their projects. By addressing these key areas, the project will become a more robust tool for securely managing and analyzing URL performance in a user-friendly manner.


Conclusion

Working on this URL Shortener project has been a fulfilling and enjoyable side project, providing valuable insights and opportunities for growth. The development process was both challenging and rewarding, allowing me to explore various technologies and implement practical solutions for a common problem. I am excited about the potential for future improvements and enhancements, including the addition of user management features, API key authentication, and a more robust dashboard.

I encourage you to try out the project and explore its features. Your feedback is highly valued and will help drive future improvements. As an open-source project, it is designed for collaboration and innovation. Feel free to contribute to the project, suggest new features, or adapt it to fit your own needs. Together, we can make this tool even better and more versatile for the community.

Additional Resources

GitHub Repository: https://github.com/defsanmith/url-shortner