This is a frontend-only chat application built using React and Material UI (MUI). The application simulates a real-time messaging interface with features such as chat list management and basic chat functionality.
React, JavaScript (ES6), and Material UI (MUI)
To run the project locally, follow these steps:
Make sure you have Node.js installed
Clone the repository:
git clone https://github.com/jkartoshka/chat-fe.git
cd chat-fe
run: npm install
Run the development server:
npm start
The app will be available at http://localhost:3000.
A chat list is displayed on the left with mock data of messages. Select a chat from the chat list to view or send messages. The chat window will display messages with timestamps and user names.
Click on "+" in Chat List Header to start a new conversation. Add participants by typing in the input box and pressing the "+" button. The participants will display as chips in the header. Start typing and send messages. Once you send a message the chat will be created.
Add multiple participants in a new chat to create a group conversation. Group participants are displayed with their avatars and names.
To delete a chat Click the three dots in a chat, and menu will appear. Click Delete and the chat will be removed