Threadly - A Better Whatsapp-Web
Table of Contents
Overview
This project is a compelete Turborepo-Full-Stack system for adressing a major issue in Whatsapp-Web, which is No call(Started before whatsapp had call) and No Discussion on a whiteboard as in Google-Meet. This App solves all.
Story
So I have started this way way ago, like its been 2ish years as of building this (more like procastinating about it). I wanted to build something cool in socket and I saw Hitesh Chaodhary sir fast-api had one of a project in socket that I can build upon, so yanked it and started it.
Hurdles: :1. So it was before AI was this good, I got stuck with a huge error (Parsing cookies from backend - via cookie-parser package) so they just updated their package and because I was using TS, for some reason the types were messing it up and it was never returing the parsed JSON, after 3 days of debugging and making my life more hell with AI, I went with the solution of downgrading it to a stable version (even till this day i date to upgrade it, its still on "cookie": "0.7.2" - comparing to currnt 1.4.2)
-
Its about time I have implemented calling feature, now I have to decide should I try to implement SFU (selecting forwarding unit - fancy word for saying less pressure on sever when doing threesome or more). But I didn't know how to implmenet that, heck after implementing the call feature I didn't even know what I was doing, so then I dropped the entire project. 1.5 years later, AI becase so good then in less than a week I have vibe-coded (Or I like to call took help from my Jr. Dev) whiteboard, SFU both.
-
Now we are at hosting, so I cant possibly host this with ease on vercel or render, so I went with AWS coz I love sshing (try speaking it at once), and after hours of tinkering the website is live, except the SFU is dead. Turns out I gotta add media-soup inbound rules in security group and open the port for it to work and wallah Its lively as ever!
Technologies Used
| Layer | Technology |
|---|---|
| Monorepo | Turborepo + pnpm |
| Frontend | React 19, TypeScript, Vite, Tailwind CSS 4, shadcn/ui |
| Backend | Express 5, TypeScript, Socket.io 4 |
| Database | MongoDB + Mongoose 8 |
| Auth | JWT (access + refresh tokens), bcryptjs |
| 1:1 Calls | Native WebRTC (STUN via Google) |
| Group Calls | mediasoup 3 SFU (server) + mediasoup-client (browser) |
| File Upload | Multer (temp) → Cloudinary (cloud) |
| Validation | express-validator |
| Rate Limiting | express-rate-limit |
| Logging | Winston + Morgan |
| HTTP Client | Axios |
Features
User Management:
- Registration, login, logout, change password.
- Profile management -> Update Account Details, Pfp, Bio etc.
- Track Friend List, Get All Friends etc
Seeding:
- Seed Random Users with Dummy information
- Get Seeded Informaiton of the Pre-seeded users.
- Seed user with @faker-js.
Messages & Chat Management:
- Send Message, Delete Message, Get Message. Basic CRUD for messages.
- Create One on One Chat, Group Chat, Get all Chats.
- Manipulate Group, RBAC, Add Participants, Kick Participants, Delete Group etc.
- Seach For available users in DB.
Health Check:
- Endpoint to verify the server's health
Future Improvements
- Add a pub-sub model to handle More traffic
- Call logs
- Emoji addition
- And what not!