Linkwith: Professional URL Management Platform

Overview

Linkwith is an advanced URL shortening and analytics platform that transforms long URLs into concise, trackable links. Built with modern web technologies, it provides comprehensive analytics, QR code generation, and detailed insights into link performance, making it an ideal solution for marketing professionals, content creators, and businesses.

Deployment

The application is deployed and accessible at Live

Key Features

Authentication & Security

• Secure email-based authentication system
• JWT-powered session management
• Password recovery with email verification
• Protected routes and authenticated dashboards

Link Management

• Custom URL shortening with unlimited usage
• Instant QR code generation
• Bulk URL management capabilities
• Custom link expiration settings

Analytics Dashboard

• Real-time click tracking and analytics
• Comprehensive metrics including:
  • Total vs. unique clicks
  • Geographic distribution
  • Device and browser analytics
  • Peak usage hours
  • 30-day trend analysis
• Exportable reports and data visualization

Technology Stack

Backend Infrastructure

• Server: Express.js
• Database: MongoDB with Mongoose
• Authentication: JWT, Bcrypt.js
• Email Service: Nodemailer
• Security: CORS, Cookie-parser

Frontend Architecture

• Framework: React 18
• Routing: React Router DOM v7
• State Management: React Context API
• Data Visualization: Recharts
• 3D Effects: Three.js
• UI Components: Lucide React
• Network: Axios
• Testing: Jest & React Testing Library

Installation Guide

Prerequisites

• Node.js (v16 or higher)
• MongoDB (v4.4 or higher)
• Git

Setup Instructions

Follow these steps to set up and run the Linkwith application locally.

1. Clone the Repository

Clone the repository from GitHub and navigate to the project directory:

git clone https://github.com/IamDevTrivedi/linkwith.git
cd linkwith

2. Install Dependencies

Install all required dependencies for both the client and server:

npm run init

Note: Ensure you have Node.js and npm installed on your system.

3. Configure Environment Variables

Create .env files for both the client and server by copying the provided example files: Copy the example environment files to create your own configuration:

cp server/.env.example server/.env
cp client/.env.example client/.env

Refer to the .env.example files in each platform directory for the required variable names and formats. Update the .env files with the required variables specific to your platform (e.g., API keys, database URLs, or other credentials). Refer to the documentation or platform for the correct values.

4. Start the Development Server

Launch both the client and server in development mode from the root directory:

npm run go

Note: This command starts both the frontend and backend servers concurrently.

5. Access the Application

Once the servers are running, you can access the application at the following URLs:

• Frontend: http://localhost:3000
• Backend: http://localhost:5000

Deployment Prerequisites

• Vercel account for frontend deployment
• Render account for backend deployment
• MongoDB Atlas account for database
• SMTP service provider credentials

Author

Dev Trivedi

• GitHub: @IamDevTrivedi
• LinkedIn: Dev Trivedi

---

Made with ❤️ by Dev Trivedi