A full-stack clone web application of Discord, created with Express.js, Typescript and React.

Check out the live demo here! 👈

• Socket.io - Real-time messaging, user updates and messaging notifications
• Livekit WebRTC - 1:1 and 1:N voice, video and screen-share and live call updates with webhooks
• EmojiMart - Twemojis and custom emojis
• Cloudinary - Upload message attachments, profile pictures and custom emojis
• Tenor GIF API - Send GIF messages
• Slate React - Rich-text editor to automatically parse emojis from shortcodes and URL links
• RTK Query - Data fetching, state-management and client-side caching
• Axios - Data fetching with request/response interceptors
• Redis - Server-side caching
• SCSS modules - UI/UX, layout and responsiveness
• MongoDB with Mongoose - Database
• JWT and bcrypt - Authentication, including auto-refreshing access tokens
• Nodemailer - Password reset and verification emails

• Servers - Join servers with communities of like-minded individuals, or create and customize your own
• Channels - Text and voice/video channels and categories to organize server topics
• Invite Links - Invite others to join servers with unique links
• Roles - Manage and customize server member permissions
• Reactions - Express your feelings with message reactions
• DMs - Create group chats for up to 10 friends
• Profiles - Individually customizable user and server profiles
• Friending/Blocking - Friend requesting, blocking and mutual friends/servers
• Infinite scroll and offset pagination - Loading messages and public servers

git clone https://github.com/xinweny/discord-clone.git
cd discord-clone

# Move into front-end folder
cd backend

# Install dependencies
npm install

# Copy the example .env file and fill it out
cp .env.example .env

# Run Express and Livekit servers
npm run dev

NOTE: You will also need a secure tunneling service such as ngrok to allow Livekit to access the webhook endpoint - detailed instructions here.

# Move into front-end folder
cd frontend

# Install dependencies
npm install

# Copy the example .env file and fill it out
cp .env.example .env

# Run Vite front-end
npm run dev

# Open in your browser
open http://localhost:5173

This is a project inspired by Discord and created solely for personal educational purposes. This project is NOT used for the purpose of monetary gain. This project has no affiliation with Discord Inc. or any parties related or associated with Discord Inc.