Web Messaging App Development

via Freelancer ·

Budget / Salary₹600–1,500
TypeFreelance project
LocationRemote
Posted1 hour ago
I need a browser-based messaging application that mirrors the flow shown in my mock-ups: a welcome screen, social-media sign-in, chat list, real-time conversation view, notifications, and a profile section with privacy controls. The scope is limited to the web only—no native iOS or Android builds for now—so please structure the stack accordingly (React or Vue on the front end and Node, Django, or an equivalent real-time-capable back end are all acceptable).

Authentication must rely solely on social-media login (Google, Facebook, or similar). After a successful OAuth handshake, users arrive at a clean “Chats” page where they can search conversations, start a new chat, or open an existing one. Inside each chat, the user should be able to send and receive plain text messages instantly; additional media types will be handled in later phases, so keep the data model flexible.

Push-style browser notifications are essential: when a new message arrives, the “Notifications” panel and a small toast both update in real time. The profile page must let the user edit name, phone number, status message, toggle privacy/security settings, manage notification preferences, and log out.

Deliverables:
• Responsive web app matching the screens described above
• Source code with clear instructions to run locally and deploy (Docker or simple CLI)
• Real-time text messaging powered by WebSockets (Socket.IO, Pusher, or native WebSocket)
• Social-media OAuth integration with token refresh and logout flow
• Basic unit tests for critical routes and message handling

Acceptance criteria:
1. Sign-in with at least one social provider works end-to-end.
2. Messages appear on both sender and recipient browsers in under 500 ms.
3. Browser notifications trigger on every incoming message.
4. All pages load flawlessly on current Chrome, Firefox, Safari, and Edge.
5. README explains environment variables, build, and deployment steps.

Keep the UI light, modern, and accessible, using neutral colors and straightforward typography so it can evolve easily in the next development stages.
mobile app development web development
Apply on Freelancer →

Project sourced from Freelancer.com. Applications happen directly on the original platform — we never collect your data.