https://github.com/krishnagithub03/url-shortner

A URL Shortening Web Service
https://github.com/krishnagithub03/url-shortner

authentication ejs expressjs javascript jwt nodejs system-design url-shortener

Last synced: 25 days ago
JSON representation

A URL Shortening Web Service

• Host: GitHub
• URL: https://github.com/krishnagithub03/url-shortner
• Owner: krishnagithub03
• Created: 2024-08-05T14:16:38.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-08-06T07:46:06.000Z (3 months ago)
• Last Synced: 2024-10-12T00:05:27.607Z (25 days ago)
• Topics: authentication, ejs, expressjs, javascript, jwt, nodejs, system-design, url-shortener
• Language: EJS
• Homepage: https://krishcodes.tech/
• Size: 20.9 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# URL Shortener

This repository contains a URL shortener application built with Node.js and Express. It allows users to shorten URLs and track their click statistics. Below you'll find details on the system design, tech stack, and how to set up and run the project locally.

## Table of Contents

- [System Design](#system-design)

- [Tech Stack](#tech-stack)

- [Features](#features)

## System Design

The URL Shortener application is designed to be simple and efficient, focusing on the core functionalities of shortening URLs and tracking usage statistics.

### Architecture

- **Frontend**: The user interface is built with HTML, CSS, and JavaScript, utilizing server-side templating with EJS (Embedded JavaScript) to render dynamic content.

  

- **Backend**: The backend is developed using Node.js and Express. It handles URL shortening, user authentication, and data persistence.

- **Database**: MongoDB is used for data storage, managing collections for URLs, users, and visit history.

- **Authentication**: JWT (JSON Web Token) is used for user authentication, enabling secure user sessions without storing sensitive information on the client side.

### Data Flow

Below is a diagram illustrating the data flow in the application:

![Data Flow Diagram](https://miro.medium.com/v2/resize:fit:1400/format:webp/1*mParFcnj7wO_-Srp3IalKg.png)

1. **User Authentication**: 

   - Users can sign up and log in. JWT is used to authenticate users and maintain session state.

2. **URL Shortening**:

   - Users submit a long URL through the form.

   - The server generates a unique short ID and stores the mapping in the database.

3. **URL Redirection**:

   - When a short URL is accessed, the server retrieves the original URL from the database and redirects the user.

4. **Statistics Tracking**:

   - Each time a shortened URL is visited, a record of the visit is stored, allowing users to view the total number of clicks.

## Tech Stack

- **Frontend**:

  - HTML5

  - CSS3

  - JavaScript

  - EJS (Embedded JavaScript)

- **Backend**:

  - Node.js

  - Express.js

- **Database**:

  - MongoDB

- **Authentication**:

  - JWT (JSON Web Token)

- **Deployment**:

  - Render (or any other cloud service you might be using)

## Features

- URL Shortening: Generate short links for any URL.

- User Authentication: Sign up and login functionality with secure session management using JWT.

- Click Tracking: View click statistics for each shortened URL.

- URL Management: Users can view and delete their shortened URLs.