Nexolive is a live streaming platform built with Next.js, React, Tailwind CSS, and PostgreSQL. It allows creators to broadcast live, interact with their audience in real-time, and manage their streams efficiently.
This project focuses on performance, user experience, and feature-rich streaming functionalities.
- Protocols: Supports RTMP & WHIP for reliable streaming.
- OBS Integration: Connect your Next.js app to OBS for broadcasting.
- Managed via Clerk for secure sign-in, sign-up, and user sessions.
- Users can upload stream thumbnails via Uploadthing.
- See the number of viewers currently watching a live stream in real-time.
- Stream status indicators: live, offline, or scheduled.
- Live chat during streams using WebSockets.
- Each viewer gets a unique chat color for better readability.
- Users can follow their favorite creators to get notified when they go live.
- Block users from interacting in chat or seeing your profile.
- Creators can kick viewers from the stream in real-time.
- Comprehensive dashboard for managing streams, viewers, and chat settings.
- Enable slow chat to limit message frequency for large streams.
- Restrict chat participation to followers only.
- Creators can enable or disable chat at any time.
- Hide sidebars, chat, or enable theatre mode for an immersive experience.
- Discover new streams and follow recommended creators easily.
- Shows live streams first and personalized recommendations.
- Displays streams and users in a clean layout.
- Sync user info and live status to the database automatically.
- Engage with community content and events directly within the app.
- Beautiful UI with fast performance, SSR, and grouped layouts.
- Offline support and home screen installable app.
- Cached assets and routes for smoother offline experience.
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/
CLERK_WEBHOOK_SECRET=
DATABASE_URL=
LIVEKIT_API_URL=
LIVEKIT_API_KEY=
LIVEKIT_API_SECRET=
NEXT_PUBLIC_LIVEKIT_WS_URL=
UPLOADTHING_SECRET=
UPLOADTHING_APP_ID=- Clone the repository:
git clone https://github.com/m-mohammad-d/nexolive.git
cd nexolive- Install dependencies:
npm install-
Set environment variables in a
.envfile. -
Run Prisma migrations:
npx prisma db push- Start the development server:
npm run dev- Open http://localhost:3000 in your browser.
npm run build
npm start- Next.js – SSR and routing
- React – Frontend components
- Tailwind CSS – Styling
- Prisma – ORM for MySQL
- LiveKit – Real-time streaming & voice
- Uploadthing – File uploads
- Clerk – Authentication
- TypeScript – Type safety
- This project is optimized for fast performance and high interactivity.
- Key focus is on streaming experience and community interaction.
- Offline support (PWA) ensures users can browse cached content when not connected.