URL Redirector

A production-grade URL redirection system built with Next.js 15, TypeScript, and Tailwind CSS.

Features

• 🚀 Built with Next.js 15 App Router
• 💪 TypeScript for type safety
• 🎨 Tailwind CSS for styling
• ✅ Zod for data validation
• 📊 Visit tracking
• 🔍 Real-time search functionality
• 🛡️ Security headers
• 📱 Responsive dashboard UI
• 🌐 RESTful API endpoints

Getting Started

Prerequisites

• Node.js 20+
• npm or yarn

Installation

1. Clone the repository:

git clone https://github.com/0x3f-lancers/url-redirector.git
cd url-redirector

2. Install dependencies:

npm install

3. Create the initial redirects data file:

mkdir -p src/data
echo '{"redirects":[]}' > src/data/redirects.json

4. Start the development server:

npm run dev

Visit http://localhost:3000 to see the dashboard.

Project Structure

URL-Redirector
├── README.md
├── app
│   ├── [slug]
│   │   └── route.ts
│   ├── api
│   │   └── redirects
│   │       ├── [slug]
│   │       │   └── route.ts
│   │       └── route.ts
│   ├── components
│   │   ├── redirects-table.tsx
│   │   └── search-input.tsx
│   ├── data
│   │   └── redirects.json
│   ├── error.tsx
│   ├── favicon.ico
│   ├── globals.css
│   ├── layout.tsx
│   ├── lib
│   │   ├── redirect.ts
│   │   └── validations
│   │       └── redirect.ts
│   ├── middleware.ts
│   ├── not-found.tsx
│   ├── page.tsx
│   └── types
│       └── redirects.ts
├── next-env.d.ts
├── next.config.ts
├── package-lock.json
├── package.json
├── postcss.config.mjs
├── tailwind.config.ts
└── tsconfig.json

Usage

Dashboard

Visit the dashboard at http://localhost:3000 to:

• View all redirects
• Search redirects
• See visit statistics

API Endpoints

Create a new redirect

curl -X POST http://localhost:3000/api/redirects \
  -H "Content-Type: application/json" \
  -d '{
    "slug": "example",
    "url": "https://example.com",
    "title": "Example Website"
  }'

Get all redirects

curl http://localhost:3000/api/redirects

Update a redirect

curl -X PATCH http://localhost:3000/api/redirects/example \
  -H "Content-Type: application/json" \
  -d '{
    "url": "https://new-example.com",
    "title": "Updated Example"
  }'

Delete a redirect

curl -X DELETE http://localhost:3000/api/redirects/example

Using Redirects

Once created, redirects are accessible at:

http://localhost:3000/{slug}

For example:

• http://localhost:3000/github redirects to GitHub
• http://localhost:3000/google redirects to Google

Security

The application includes several security features:

• HTTP security headers
• Input validation
• XSS protection
• CSRF protection
• Content Security Policy

Development

Environment Variables

No environment variables are required for local development.

Type Checking

npm run type-check

Linting

npm run lint

Production Deployment

1. Build the application:

npm run build

2. Start the production server:

npm start

Contributing

1. Fork the repository
2. Create your feature branch: git checkout -b feature/amazing-feature
3. Commit your changes: git commit -m 'Add amazing feature'
4. Push to the branch: git push origin feature/amazing-feature
5. Open a Pull Request

License

This project is licensed under the MIT License - see the LICENSE file for details.

Created by Ad-h0c & Lancers Technology