React Discord Clone

screenshot of React Discord Clone
express
react

Discord Clone using React, Node, Express, Socket-IO and Mysql

Overview

The React Discord Clone is a functional Discord Clone written in Typescript using React, Socket IO, NodeJS, Express, and MySQL. Originally created in 2018 as a learning experience, this project is no longer maintained, and its backend is not hosted anymore.

Features

  • Real-time messaging using Socket IO
  • Local Authentication
  • Loads User Data upon login (Servers, Channels, Private Messages)
  • Creation and Joining Servers
  • Creation of Channels in a Server
  • Server Settings (Change name and delete)
  • Channel Settings (Change name and delete)
  • Persistent channel history
  • Pretty Print Code Blocks enclosed in three backticks
  • Private messaging
  • Timestamps for messages
  • Show current active users in a given server
  • Convert to Typescript
  • Voice Chat (Buggy, but main features work)
express
Express

Express.js is a simple Node.js framework for single, multi-page, and hybrid web applications.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

github-pages
GitHub Pages

Gridsome is a Vue.js-based static site generator that makes it easy to build fast and flexible websites and applications by leveraging modern web technologies like GraphQL, Webpack, and hot reloading

Redux

Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.