Overview
Dardasha is a real-time chat project built to prove interactive full-stack development beyond static CRUD screens.
My Role
I implemented the frontend experience and connected it to real-time and backend-driven communication features.
Problem
Communication apps need instant feedback, reliable state updates, and a UI that remains usable while multiple users interact at the same time.
Solution
Focused the UI around conversation state and clear controls.
Target Users
- Chat users
- Teams or groups
- Portfolio reviewers
Workflow
Product flow from interface to deployment
01
UI
02
API
03
Auth
04
Data
05
Deploy
Key Features
- Authentication-aware chat experience
- Real-time messaging
- Group conversations
- Audio/video call and screen-share workflows
- AI API integration
Frontend Implementation
- Built chat-oriented UI states for messages, conversations, loading, and interaction controls.
- Designed responsive layouts for real-time communication screens.
- Integrated real-time events into the user interface.
Backend / API Implementation
- Socket.io is used for real-time messaging behavior.
- Node/Express and MongoDB manage persistent user, message, and conversation data.
Database Design
- MongoDB supports user/message/conversation-style data.
Authentication and Security
- Authentication is included in the app flow.
API Overview
- Application flows cover authentication, users, conversations, messages, and real-time socket events.
Architecture Decisions
- Socket.io fits the real-time messaging requirement better than polling.
- Separating real-time events from persistent API data keeps the mental model clearer.
Challenges
- Handling live updates without confusing UI state.
- Keeping communication controls usable on small screens.
Solutions
- Focused the UI around conversation state and clear controls.
- Used real-time events to deliver instant feedback.
Deployment Notes
- Frontend demo is public.
Database Schema Notes
User
profileauthpresence
Conversation
memberstypemetadata
Message
sendercontenttimestamps
- The schema view maps the core user, conversation, and message entities.
User -> ConversationConversation -> MessageUser -> Message
Screenshots
Project Screenshot
What This Project Proves
Real-time app thinking
Socket.io integration
Interactive frontend states
Full-stack communication workflow