A real-time app for finding and connecting with communities sharing similar interests as you, making friends in the process - inspired by Discord.
Built with ReactJS, Node.js, Express, PostgreSQL, Material-UI 5.3, Socket.IO, AWS (S3), and hosted with Netlify & Heroku
Disnode is a full-stack application that allows members to create or join existing servers, connecting with others that share similar interests.
The idea of Disnode came from my love for online communities and game servers. I spend a lot of my time gaming with my friends, and we use Discord to do that. With my newly obtained knowledge from studying hard during my Bootcamp, I decided it would be super cool to make my own version of Discord. This is where the idea of Disnode came from, Discord but on Node (HAH! get it? sorry I had to).
Each member focused mainly on different parts for this project, while also familiarizing each other with the rest of the application for context (we made sure everyone implemented at least a couple functionalities from backend to frontend).
- Adam Hirzalla (@adamhirzalla) - Back-end (server and API routes), DB Architecture (ERD/Schema/Queries + shaping data), Sockets (server + client), AWS-S3 (server + client) & Front-end (React Contexts/Reducers + refactors)
- Hyunsu Kim (@EavanK) - Middleman for backend/frontend (wire-ups), Front-end (React States/components), User Authorization - JWT (server + client) & API
- Jonathan Su (@hjonsu) - Front-end (styling/design), MUI components & Wireframes
This app was created as part of our final project for Lighthouse Labs - Web Development Bootcamp. The goal was to create a full-stack application from start to finish in just two weeks.
- Frontend: ReactJS, Material-UI 5.3, Socket.IO, AWS (S3)
- Backend: Node.js, Express, PostgreSQL, Socket.IO, AWS (S3)
- Deployment: Heroku (database API), Netlify (production client)
- Real-time events for almost all features (sockets)
- Members can customize their profiles, and add connections to their socials or other platforms, which other members can view
- Members can create or join multiple servers
- Members can search for existing servers through title/invite codes/tags, or browse through a list of all servers
- Each server can have as many channels, each having its own messages instance (used for categorization within a server)
- Members can add other members to their friends list
- Member role system (Owner, Admins, Users) with different permissions for each
- Live seen-by feature for all messages
- Live online status indicator for server members
- Live tagging/mentioning other members in chat messages
- Live notifications for new messages and member tags/mentions
- Upload images, GIFs as profile pictures and server logos
- View other members' profiles and view their linked connections
- Members can accept/reject incoming friend requests, or cancel outgoing requests
- Server Admins can kick members from server, create/edit/delete server channels, and delete chat messages for moderation purposes
- A server Owner can promote members to Admins, pass down ownership to an Admin, and edit server settings
- Each role has different role colors which are used for chat messages to quickly identify the role of the sender by color
- Members can copy server invite codes to clipboard and share it with other members to find and join the server
The project is live here
