How rizwansheik666/live_chat_app works
Talky is a MERN chat application: users register or log in, choose a profile avatar, select another registered user, and exchange messages in a chat. The HTTP path handles authentication, contact lookup, avatar updates, and message history/persistence; a separate Socket.io path dispatches live messages to connected recipients. The tree and README establish the broader UI and real-time capabilities, but excerpts do not show every page or the message model implementation, so uncertain internal wiring is omitted.
Main entry points: APIRoutes.js API endpoints · App.js Route shell · index.js Express server · ChatContainer.jsx Conversation UI
Components 19
React client
- Route shell
public/src/App.js - Registration
public/src/pages/Register.jsx - Login
public/src/pages/Login.jsx - Avatar selection
public/src/components/SetAvatar.jsx - Chat page
public/src/pages/Chat.jsx - Contacts list
public/src/components/Contacts.jsx - Conversation UI
public/src/components/ChatContainer.jsx - Message input
public/src/components/ChatInput.jsx - API endpoints
public/src/utils/APIRoutes.js
HTTP API
- Express server
server/index.js - Auth routes
server/routes/auth.js - Message routes
server/routes/messages.js - User operations
server/controllers/userController.js - Message operations
server/controllers/messageController.js
Live messaging
- Socket dispatch
server/index.js
Persistent data
- User model
server/models/userModel.js - Message model
server/models/messageModel.js - MongoDB
Other components
- Chat user
Connections 25
- Chat user → Route shell: uses
- Route shell → Registration: routes to
- Route shell → Login: routes to
- Route shell → Avatar selection: routes to
- Route shell → Chat page: routes to
- Registration → API endpoints: posts registration
- Login → API endpoints: requests login
- Avatar selection → API endpoints: sets avatar
- Chat page → Contacts list: shows contacts
- Chat page → Conversation UI: opens conversation
- Message input → Conversation UI: submits text
- Contacts list → API endpoints: loads users
- Conversation UI → API endpoints: loads and saves
- API endpoints → Express server: HTTP requests
- Express server → Auth routes: mounts routes
- Express server → Message routes: mounts routes
- Auth routes → User operations: dispatches
- Message routes → Message operations: dispatches
- User operations → User model: queries and updates
- Message operations → Message model: reads and writes
- Express server → MongoDB: connects
- Socket dispatch → Chat user: emits live message
- Conversation UI → Socket dispatch: sends and receives
- User model → MongoDB: persists users
- Message model → MongoDB: persists messages