AeThex Live

A complete creator streaming platform - Multi-channel streaming, community features, creator monetization, gaming tournaments, music/DJ tools, and enterprise streaming all in one.

🎯 Platform Vision

AeThex LIVE combines the best of Twitch, YouTube Live, Discord, and creator platforms:

• 🎬 Multi-channel Streaming - Creators manage multiple streaming channels
• 💬 Real-time Community - Live chat, reactions, gifting, polls, and moderation
• 💰 Creator Monetization - Subscriptions, donations, tips, and direct payouts
• 🎮 Gaming/Esports - Tournaments, leaderboards, competitive rankings
• 🎵 Music/DJ Studio - Special audio features and visualization
• 📚 Education/Enterprise - Webinars, conferences, courses
• 🎯 Engagement Tools - Clips, highlights, trending content, recommendations
• 📊 Creator Dashboard - Analytics, viewer insights, revenue tracking

✨ Features (Roadmap)

Phase 1: Foundation ✅ (Current)

• ✅ HLS video player with auto-recovery
• ✅ Stream hosting infrastructure
• 🔄 User authentication (Clerk)
• 🔄 Basic creator profiles
• 🔄 Real-time chat with Socket.io

Phase 2: Social & Discovery

• Multi-channel management
• Stream discovery & search
• Follow/subscribe system
• Creator recommendations

Phase 3: Creator Tools & VOD

• VOD archives
• Clip creation & editing
• Advanced analytics
• Stream health monitoring

Phase 4: Monetization

• Subscriptions (tiered)
• Donations/tips
• Gifting system
• Creator payouts

Phase 5: Community & Engagement

• Live polls
• Reactions & emotes
• Channel points
• Moderation tools

Phase 6: Gaming/Esports

• Tournaments
• Leaderboards
• Match tracking
• Competitive rankings

Phase 7: Music/DJ Features

• DJ studio mode
• Audio visualization
• Music library
• Spotify integration

Phase 8: Enterprise/Education

• Webinar features

• Screen sharing

• Course creation

• Certificate generation

• 🎥 HLS Video Player - High-quality streaming with hls.js support

• 🎨 Sci-Fi Dark Theme - Immersive dark theme with cyan/blue accents

• 👥 Live Viewer Count - Real-time viewer tracking

• 💬 Chat Sidebar - Interactive community chat

• 📱 Responsive Design - Desktop and mobile optimized

Tech Stack

• Framework: Next.js 16.1.6 with TypeScript
• Styling: Tailwind CSS 4
• Video Player: hls.js for HLS streaming
• UI: React 19.2.3 with modern hooks

Getting Started

Prerequisites

• Node.js 20.x or higher
• npm, yarn, pnpm, or bun

Installation

1. Clone the repository:

git clone https://github.com/AeThex-LABS/aethex.live.git
cd aethex.live

2. Install dependencies:

npm install

3. Run the development server:

npm run dev

4. Open http://localhost:3000 in your browser.

Configuration

To use your own HLS stream:

1. Copy the environment template:

cp .env.example .env.local

2. Add your stream URL:

NEXT_PUBLIC_STREAM_URL=your-hls-stream-url.m3u8

3. (Optional) Customize settings in config/streaming.ts

📖 See QUICKSTART.md for a complete setup guide!

Build

Create an optimized production build:

npm run build
npm start

🚀 Making It Your Platform

This is ready to become your live streaming hub! Check out these guides:

• QUICKSTART.md - Get streaming in 5 minutes
• STREAMING_SETUP.md - Full platform setup guide
• config/streaming.ts - Configuration reference

Ready-to-Use Features

✅ HLS video player with auto-recovery
✅ Responsive design (mobile & desktop)
✅ Chat sidebar UI (connect your backend)
✅ Viewer count display
✅ Now playing metadata
✅ API routes for stream status & chat

Next Steps

1. Get a streaming provider (Cloudflare/Mux/AWS)
2. Set up OBS Studio
3. Add your stream URL to .env.local
4. Choose your platform and deploy
5. Point your domain to your hosting provider

🚀 Deployment Options

Vercel (Recommended for Beginners)

Automatic deployments, zero config:

npm i -g vercel
vercel

Railway (Full Control & Backend)

Great for custom backends and databases:

npm i -g @railway/cli
railway login
railway up

See RAILWAY_DEPLOYMENT.md for detailed setup.

Other Platforms

Next.js can deploy to AWS, Netlify, Cloudflare Pages, and more. Check Next.js deployment docs.

Scripts

• npm run dev - Start development server
• npm run build - Create production build
• npm start - Start production server
• npm run lint - Run ESLint

Project Structure

aethex.live/
├── app/
│   ├── page.tsx          # Main page component
│   ├── layout.tsx        # Root layout
│   └── globals.css       # Global styles
├── components/
│   ├── HLSPlayer.tsx     # Video player component
│   ├── ViewerCount.tsx   # Viewer counter
│   ├── NowPlaying.tsx    # Metadata display
│   └── ChatSidebar.tsx   # Chat interface
└── public/               # Static assets

License

© 2026 AeThex LABS - All rights reserved

Deploy on Vercel

The easiest way to deploy is using the Vercel Platform.

Check out the Next.js deployment documentation for more details.