# SECTION A: Tech Stack & Folder Structure ## Recommended Tech Stack ### Frontend * Framework: Next.js * Language: TypeScript * Styling: Tailwind CSS * State Management: Zustand * Real-time Communication: Socket.IO ### Backend * Runtime: Node.js * API Layer: Next.js API Routes * Authentication: Firebase Authentication * Database: Cloud Firestore * Presence & Realtime: Firebase Realtime Database ### DevOps & Utilities * Hosting: Vercel * File Validation: Zod * Environment Management: dotenv * Rate Limiting: express-rate-limit * Logging: pino --- ## Essential Dependencies ```bash npm install next react react-dom typescript npm install firebase socket.io socket.io-client npm install tailwindcss postcss autoprefixer npm install zustand zod axios npm install uuid nanoid npm install pino npm install express-rate-limit npm install @types/node @types/react @types/react-dom ``` --- ## Scalable Folder Structure ```plaintext anonymous-chat-platform/ │ ├── public/ │ ├── assets/ │ └── icons/ │ ├── src/ │ ├── app/ │ │ ├── api/ │ │ │ ├── auth/ │ │ │ │ └── route.ts │ │ │ ├── matchmaking/ │ │ │ │ └── route.ts │ │ │ ├── messages/ │ │ │ │ └── route.ts │ │ │ └── report/ │ │ │ └── route.ts │ │ │ │ │ ├── chat/ │ │ │ ├── [roomId]/ │ │ │ │ └── page.tsx │ │ │ └── loading.tsx │ │ │ │ │ ├── login/ │ │ │ └── page.tsx │ │ │ │ │ ├── layout.tsx │ │ ├── page.tsx │ │ └── globals.css │ │ │ ├── components/ │ │ ├── chat/ │ │ │ ├── ChatBox.tsx │ │ │ ├── MessageBubble.tsx │ │ │ └── TypingIndicator.tsx │ │ │ │ │ ├── common/ │ │ │ ├── Button.tsx │ │ │ ├── Loader.tsx │ │ │ └── Modal.tsx │ │ │ │ │ └── layout/ │ │ ├── Navbar.tsx │ │ └── Sidebar.tsx │ │ │ ├── config/ │ │ ├── firebase.ts │ │ ├── socket.ts │ │ └── env.ts │ │ │ ├── hooks/ │ │ ├── useAuth.ts │ │ ├── useChat.ts │ │ └── useSocket.ts │ │ │ ├── lib/ │ │ ├── matchmaking/ │ │ │ └── queueManager.ts │ │ │ │ │ ├── moderation/ │ │ │ └── profanityFilter.ts │ │ │ │ │ ├── utils/ │ │ │ ├── generateRoomId.ts │ │ │ └── rateLimiter.ts │ │ │ │ │ └── validators/ │ │ └── messageValidator.ts │ │ │ ├── services/ │ │ ├── authService.ts │ │ ├── chatService.ts │ │ └── socketService.ts │ │ │ ├── store/ │ │ ├── authStore.ts │ │ └── chatStore.ts │ │ │ ├── styles/ │ │ └── animations.css │ │ │ └── types/ │ ├── chat.ts │ ├── user.ts │ └── api.ts │ ├── .env.local ├── next.config.js ├── tsconfig.json ├── tailwind.config.js ├── package.json └── README.md ``` # SECTION B: Database Schema ## Firebase Firestore Schema ```json { "users": { "userId": { "anonymousName": "ShadowFox92", "status": "online", "socketId": "socket_324234", "createdAt": "timestamp", "lastSeen": "timestamp", "isBanned": false, "preferences": { "language": "en", "region": "global" } } }, "matchQueue": { "queueId": { "userId": "user_123", "joinedAt": "timestamp", "preferences": { "language": "en" } } }, "chatRooms": { "roomId": { "participants": [ "user_123", "user_456" ], "status": "active", "createdAt": "timestamp", "endedAt": null, "lastMessage": { "messageId": "msg_001", "text": "Hello", "senderId": "user_123", "createdAt": "timestamp" } } }, "messages": { "roomId": { "messageId": { "senderId": "user_123", "text": "Hi there!", "messageType": "text", "isDeleted": false, "createdAt": "timestamp" } } }, "reports": { "reportId": { "reportedUserId": "user_456", "reportedBy": "user_123", "reason": "abuse", "roomId": "room_001", "createdAt": "timestamp" } }, "presence": { "userId": { "isOnline": true, "typingInRoom": "room_001", "lastActive": "timestamp" } } } ``` --- ## Collection Relationships ```json { "users.userId": { "linkedTo": [ "chatRooms.participants", "messages.senderId", "reports.reportedBy", "reports.reportedUserId" ] }, "chatRooms.roomId": { "linkedTo": [ "messages.roomId", "reports.roomId" ] }, "matchQueue.queueId": { "linkedTo": [ "users.userId" ] } } ``` # SECTION C: Core API Logic ## 1. Matchmaking API ### Endpoint ```http POST /api/matchmaking ``` ### Request Payload ```json { "userId": "user_123", "preferences": { "language": "en" } } ``` ### Core Logic * Add user to matchmaking queue * Search for compatible waiting user * Create new room if match found * Return roomId and peer details ### Response ```json { "success": true, "roomId": "room_001", "matchedUser": { "userId": "user_456", "anonymousName": "NightWolf" } } ``` --- ## 2. Send Message API ### Endpoint ```http POST /api/messages ``` ### Request Payload ```json { "roomId": "room_001", "senderId": "user_123", "text": "Hello there!" } ``` ### Core Logic * Validate message * Store message in Firestore * Broadcast message through Socket.IO * Update room lastMessage field * Trigger moderation filters ### Response ```json { "success": true, "messageId": "msg_001", "createdAt": "timestamp" } ``` --- ## 3. Report User API ### Endpoint ```http POST /api/report ``` ### Request Payload ```json { "reportedUserId": "user_456", "reportedBy": "user_123", "roomId": "room_001", "reason": "spam" } ``` ### Core Logic * Store abuse report * Increment violation counter * Auto-ban if threshold exceeded * Notify moderation system ### Response ```json { "success": true, "message": "Report submitted successfully" } ```