Chat-App.md

Chat App

Tier: 3-Advanced

Real-time chat interface where multiple users can interact with each other by sending messages.

As a MVP(Minimum Viable Product) you can focus on building the Chat interface. Real-time functionality can be added later (the bonus features).

User Stories

• User is prompted to enter a username when he visits the chat app. The username will be stored in the application
• User can see an input field where he can type a new message
• By pressing the enter key or by clicking on the send button the text will be displayed in the chat box alongside his username (e.g. John Doe: Hello World!)

Bonus features

• The messages will be visible to all the Users that are in the chat app (using WebSockets)
• When a new User joins the chat, a message is displayed to all the existing Users
• Messages are saved in a database
• User can send images, videos and links which will be displayed properly
• User can select and send an emoji
• Users can chat in private
• Users can join channels on specific topics

Useful links and resources

• Socket.io
• How to build a React.js chat app in 10 minutes - article
• Build a chat application like Slack - React / JavaScript Tutorial - Youtube
• Socket.io Chat App Using Websockets - Youtube Tutorial

Example projects

• Chatty2