Discord Clone

This project is Discord clone with main features of Discord.

View Demo . Report Bug .

📔 Table Of Contents

• About the Project
  • Screenshots
  • Demo Accounts
  • Features
  • Built With
• Getting Started
  • Prerequisites
  • Clone The Repository
  • Environment Variables
  • Install NPM Packages
  • Setup Prisma
  • Run The App
  • Deployment

About The Project

📷 Screenshots

Demo Accounts

Username	E-mail	Password
Demo 1	egm13063@omeie.com	123
Demo 2	naf50208@zbock.com	123

Features

• Authentication
• Light / Dark mode
• Responsive UI
• Real-time messaging with deleting and editing
• Sending attachments
• Private conversations
• Servers
  • Member management (invite, kick, change role, leave)
  • Creating, editing and deleting servers
  • Creating, editing and deleting channels
  • Text, audio and video channel

Built With

• Typescript
• Next.js
• Prisma
• Tailwind CSS
• Clerk
• LiveKit
• SocketIO
• UploadThing
• MySQL database

🧰 Getting Started

Prerequisites

• Node

Clone The Repository

git clone https://github.com/Jeda777/Discord-Clone.git

Environment Variables

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=/
DATABASE_URL=
UPLOADTHING_SECRET=
UPLOADTHING_APP_ID=
LIVEKIT_API_KEY=
LIVEKIT_API_SECRET=
NEXT_PUBLIC_LIVEKIT_URL=

Install NPM packages

npm i

Setup Prisma

npm run prisma1
npm run prisma2

or

npx prisma generate
npx prisma db push

Run The App

npm run dev

Deployment

On builds you need to add one more environment variable. In 'YOUR_SITE_URL' place url of your deployed site.

NEXT_PUBLIC_SITE_URL=YOUR_SITE_URL