Skip to content

umutverne/datcord

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Datcord

A full-featured Discord clone with real-time messaging, servers, channels, and direct messages.

Features

  • Real-time Messaging - Instant message delivery using Socket.io
  • Server Management - Create and manage servers with multiple channels
  • Channel System - Text channels within servers
  • Direct Messages - Private messaging between users
  • Friend System - Add friends and manage friend requests
  • User Authentication - Secure JWT-based authentication
  • Notifications - Real-time notification system
  • Emoji Support - Built-in emoji picker

Tech Stack

Frontend

  • React 18 with TypeScript
  • Tailwind CSS for styling
  • Zustand for state management
  • Socket.io Client for real-time communication
  • Vite for fast development

Backend

  • Node.js with Express
  • Socket.io for WebSocket connections
  • JWT for authentication
  • SQLite for data storage

Getting Started

Prerequisites

  • Node.js 18+
  • npm or yarn

Installation

# Clone the repository
git clone https://github.com/umutverne/datcord.git

# Navigate to project directory
cd datcord

# Install root dependencies
npm install

# Install client dependencies
cd client && npm install

# Install server dependencies
cd ../server && npm install

Environment Setup

Create .env files in both client and server directories:

client/.env

VITE_API_URL=http://localhost:3001
VITE_SOCKET_URL=http://localhost:3001

server/.env

PORT=3001
JWT_SECRET=your-secret-key

Running the App

# Start the server (from server directory)
npm run dev

# Start the client (from client directory)
npm run dev

Project Structure

datcord/
├── client/                 # React frontend
│   ├── src/
│   │   ├── components/    # UI components
│   │   ├── pages/         # Page components
│   │   ├── services/      # API and socket services
│   │   └── store/         # Zustand stores
│   └── ...
├── server/                 # Express backend
│   ├── src/
│   │   ├── routes/        # API routes
│   │   ├── middleware/    # Express middleware
│   │   └── config/        # Configuration
│   └── ...
└── render.yaml            # Render deployment config

Deployment

The app is configured for deployment on Render. See render.yaml for configuration.

License

MIT

About

Discord clone with real-time messaging - React, Node.js, Socket.io

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors