README
Key Features:
- Real-time messaging capabilities.
- User authentication for secure access.
- Creation of chat rooms for grouped conversations.
- Ability to send text messages, images, and files.
- Data storage and chat functionality powered by chatengine.io.
- Responsive design for a seamless experience across various devices.
Technologies Used:
- Backend: Node.js with Express for server setup.
- Frontend: React.js for building the user interface.
- API Calls: Axios for handling API requests.
- Chat Functionality: chatengine.io for pre-built chat components.
Project Highlights:
- Utilization of React Chat Engine for advanced and customizable UI components.
- Implementation of multi-chat socket and logic for effective chat management.
- Creation of a chat UI by rendering components and integrating necessary props.
- Extensive customization options for tailoring the chat UI.
- Future updates will allow users to login with username and password.
Steps to run the Project
- Clone the repo
git clone https://github.com/dmpapageo/react-realtime-chat.git
- Navigate to the project folder
- run the commands
cd backend
, npm install
, and npm run start
to build and run the backend service
- open a new terminal in the project folder, move to the frontend folder
cd frontend
- run
npm install
and npm run dev
to start vite
- Open http://localhost:5173/ to your local. Happy chatting!
Video Demonstration:
https://github.com/dmpapageo/Chatbuddies/assets/12124034/dfaafd77-1393-4c28-ac84-5bbc1e007309