Harmony
A real-time chat platform built with Next.js that emulates Discord's core functionality. Features a modern, responsive UI with server-based chat rooms, real-time messaging, and user authentication.
Core Features
Real-time Communication
- • Real-time messaging with WebSocket subscriptions
- • Server-based chat room organization
- • Dynamic server and room creation
- • Message pagination and infinite scroll
- • User permissions and access control
User Experience
- • User authentication and profile management
- • Profile picture customization with Cloudinary integration
- • Responsive navigation with server/room switching
- • Modern Discord-inspired UI/UX
- • File upload capabilities
Technical Stack
Frontend
- • Next.js 14 with React 18
- • Tailwind CSS for responsive design
- • React Icons for UI elements
- • React Avatar for user profiles
- • React Toastify for notifications
Backend & Database
- • Next.js API routes for backend logic
- • GraphQL with Apollo Client
- • Hasura with Neon PostgreSQL
- • Auth0 for authentication
- • Cloudinary for file storage
Architecture
- • Component-based architecture with reusable UI components
- • GraphQL for efficient data fetching and real-time updates
- • Server-side rendering with Next.js
- • Responsive design with Tailwind CSS
- • Modular navigation system with dynamic routing
- • State management with React hooks and Apollo Client