This is a repository for Fullstack Discord Clone implemented with Next.js 13, React, Socket.io, Prisma, Tailwind, MySQL.
The live url: https://discord-clone-production-0cac.up.railway.app
Table of Contents
- Next.js 13
- React
- Socket.io
- Prisma
- Tailwind
- MySQL
- Shadcn
This is an example of how you may give instructions on setting up your project locally. To get a local copy up and running follow these simple example steps.
Node version 18.x.x
- Clone the repo
git clone https://github.com/github_username/repo_name.git
- Install NPM packages
npm install
- Setup .env file
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY= CLERK_SECRET_KEY= NEXT_PUBLIC_CLERK_SIGN_IN_URL= NEXT_PUBLIC_CLERK_SIGN_UP_URL= 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=
- Setup Prisma
// initiate and update database npx prisma migrate reset npx prisma generate npx prisma db push // check database npx prisma studio
npm run dev
- Real-time messaging using Socket.io
- Send attachments as messages using UploadThing
- Delete & Edit messages in real time for all users
- Create Text, Audio and Video call Channels
- 1:1 conversation between members
- 1:1 video calls between members
- Member management (Kick, Role change Guest / Moderator)
- Unique invite link generation & full working invite system
- Infinite loading for messages in batches of 10 (tanstack/query)
- Server creation and customization
- Beautiful UI using TailwindCSS and ShadcnUI
- Full responsivity and mobile UI
- Light / Dark mode
- Websocket fallback: Polling with alerts
- ORM using Prisma
- MySQL database using Planetscale
- Authentication with Clerk