Skip to content

Repository files navigation

V2Ray Portal 🛡️

A modern, beautiful V2Ray configuration selling portal built with Next.js 14.

V2Ray Portal TypeScript Tailwind CSS

✨ Features

  • 🔐 Google OAuth Authentication - Secure login with NextAuth.js
  • 🎨 Modern 3D Glassmorphism Design - Stunning visual effects
  • 📱 Fully Responsive - Works on all devices
  • Lightning Fast - Built with Next.js App Router
  • 🎯 Clean Dashboard - Collapsible sidebar navigation

🙌 What Users Get

  • 📲 OTP-based login with Sri Lanka +94 numbers
  • 🛡️ Premium V2Ray configs for multiple ISPs
  • 🛰️ Server status + backup configs for outages
  • 🛒 Packages, promos, and checkout flow
  • 🧾 Purchase/download history tracking
  • 📰 Blog/tutorials and offer announcements
  • 🔔 WhatsApp channel alerts for offers and outages
  • 🎛️ Dashboard with sidebar navigation on mobile/desktop

🖥️ Dashboard Pages

Page Description
Home Overview stats, quick actions, recent activity
Packages Pricing plans with animated cards
Blog Tutorials and guides
History Purchase & download history
Servers Global server network status

🚀 Getting Started

Prerequisites

  • Node.js 18+
  • npm or yarn
  • Google Cloud Console account (for OAuth)

Installation

  1. Clone the repository

  2. Install dependencies:

    npm install
  3. Set up Google OAuth:

    • Go to Google Cloud Console
    • Create OAuth 2.0 credentials
    • Add redirect URI: http://localhost:3000/api/auth/callback/google
  4. Configure environment variables in .env.local:

    NEXTAUTH_URL=http://localhost:3000
    NEXTAUTH_SECRET=your-super-secret-key
    GOOGLE_CLIENT_ID=your-google-client-id
    GOOGLE_CLIENT_SECRET=your-google-client-secret
  5. Run the development server:

    npm run dev
  6. Open http://localhost:3000

🎨 Design System

  • Primary: Indigo (#6366f1)
  • Secondary: Purple (#8b5cf6)
  • Accent: Cyan (#06b6d4)
  • Font: Poppins

📁 Project Structure

src/
├── app/
│   ├── api/auth/[...nextauth]/  # NextAuth API
│   ├── dashboard/               # Dashboard page
│   ├── login/                   # Login page
│   └── page.tsx                 # Root redirect
├── components/
│   ├── dashboard/               # Dashboard components
│   └── providers/               # Context providers
└── types/                       # TypeScript types

🛠️ Tech Stack

📝 License

MIT License

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages