A simple URL shortener that converts long URLs into short, shareable links. Live at shortly.nayan04.me.

• URL Shortening - Convert long URLs to short links (no account required)
• Custom Aliases - Create personalized short URLs (3–20 chars, logged-in users)
• Click Tracking - Monitor URL usage statistics
• URL Management - View, search, sort, copy, and delete your links
• Bulk Delete - Select and delete multiple URLs at once
• Analytics - Dashboard with stats, recent activity, and top-performing URLs

FRONTEND/
├── src/
│   ├── components/
│   │   ├── Navbar.jsx
│   │   ├── LandingPage.jsx
│   │   ├── Dashboard.jsx
│   │   ├── UrlForm.jsx
│   │   ├── LoginForm.jsx
│   │   ├── RegisterForm.jsx
│   │   ├── AccountSettings.jsx
│   │   ├── UserProfileModal.jsx
│   │   ├── Accessibility.jsx
│   │   ├── UxEnhancements.jsx
│   │   └── ErrorBoundary.jsx
│   ├── api/
│   │   ├── shortUrl.api.js
│   │   └── user.api.js
│   └── utils/
└── public/

BACKEND/
├── src/
│   ├── controllers/
│   ├── schema/
│   ├── dao/
│   ├── services/
│   ├── routes/
│   ├── middleware/
│   ├── validation/
│   ├── utils/
│   └── config/
└── index.js

• Node.js v16+
• MongoDB (local or MongoDB Atlas)
• npm or yarn

git clone https://github.com/0x4Nayan04/Shortly.git
cd Shortly

cd BACKEND
npm install

Create a .env file in BACKEND/:

MONGODB_URI=mongodb://localhost:27017/url_shortener
JWT_SECRET=your_super_secret_jwt_key_at_least_32_chars
FRONT_END_URL=http://localhost:5173
PORT=3001
NODE_ENV=development

Optional (production):

ALLOWED_ORIGINS=https://your-custom-domain.com

cd FRONTEND
npm install

Create a .env file in FRONTEND/:

VITE_APP_URL=http://localhost:3001

Backend:

cd BACKEND
npm run dev

Frontend (new terminal):

cd FRONTEND
npm run dev

Open http://localhost:5173 to use Shortly.

MONGODB_URI=mongodb://localhost:27017/url_shortener
JWT_SECRET=your_super_secret_jwt_key_at_least_32_chars
FRONT_END_URL=http://localhost:5173
PORT=3001
NODE_ENV=development
ALLOWED_ORIGINS=

VITE_APP_URL=http://localhost:3001

1. Set environment variables (no backend URL in docs).
2. Build: npm install
3. Start: npm start

1. Set VITE_APP_URL to your backend API URL.
2. Build: npm run build
3. Output: dist/

• Auth (401): Set NODE_ENV=production, use sameSite: 'none' and secure: true for cross-origin cookies.
• CORS: Ensure FRONT_END_URL matches your frontend domain; use ALLOWED_ORIGINS for multiple origins.
• MongoDB: Include database name in the connection string; add deployment IPs to Atlas whitelist if needed.

• Development: http://localhost:3001

POST /api/create
Content-Type: application/json

{
  "full_url": "https://www.example.com/very/long/url/path"
}

POST /api/create/custom
Content-Type: application/json
Cookie: token=<jwt>

{
  "full_url": "https://www.example.com/page",
  "custom_url": "my-link"
}

GET /api/create/my-urls?limit=20&skip=0&search=example&sortBy=createdAt&sortOrder=desc
Cookie: token=<jwt>

• React 19, Vite 6, TailwindCSS 4
• React Router, Axios, React Query
• react-hot-toast

• Node.js, Express 5, MongoDB, Mongoose 8
• JWT, bcrypt, nanoid, Joi, CORS
• Helmet, compression, cookie-parser

• ESLint, Nodemon, dotenv

1. Visit the homepage
2. Enter a long URL to shorten
3. Copy and share the short URL

1. Sign up with name, email, and password
2. Use the dashboard to manage URLs
3. Create custom short URLs (3–20 chars, alphanumeric, hyphens, underscores)
4. View stats, search, sort, and bulk delete

• Password hashing with bcrypt
• JWT in HTTP-only cookies
• Server-side validation (Joi)
• CORS and Helmet
• Secure cookie options for production