https://github.com/mukulsomukesh/chat-application

This is a full-stack Chat Application built using React.js, Node.js, Express.js, MongoDB, Tailwind CSS, and Redux. It offers a user-friendly interface for real-time conversations, including features like sign up, sign in, logout, profile image customization, user search, one-to-one chat, group creation, group chat, group administration, and message
https://github.com/mukulsomukesh/chat-application

chat-application express-js mongodb-atlas node-js reactjs redux socket-io tailwind-css

Last synced: about 1 year ago
JSON representation

This is a full-stack Chat Application built using React.js, Node.js, Express.js, MongoDB, Tailwind CSS, and Redux. It offers a user-friendly interface for real-time conversations, including features like sign up, sign in, logout, profile image customization, user search, one-to-one chat, group creation, group chat, group administration, and message

• Host: GitHub
• URL: https://github.com/mukulsomukesh/chat-application
• Owner: mukulsomukesh
• Created: 2023-06-23T22:48:23.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2025-01-02T20:37:10.000Z (over 1 year ago)
• Last Synced: 2025-03-30T19:51:08.431Z (about 1 year ago)
• Topics: chat-application, express-js, mongodb-atlas, node-js, reactjs, redux, socket-io, tailwind-css
• Language: JavaScript
• Homepage: https://chat-app-ca.netlify.app/
• Size: 323 KB
• Stars: 16
• Watchers: 1
• Forks: 11
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Chat Application



        

        

  Welcome to the Chat Application! This is a full-stack project built using React.js, Node.js, Express.js, MongoDB, Tailwind CSS, and Redux. The application provides an intuitive and user-friendly interface for users to engage in real-time conversations with others. It incorporates a range of features such as sign up, sign in, logout, profile image customization, user search, one-to-one chat, group creation, group chat, group administration, and message notifications.

## Features

- **User Authentication**: Users can sign up for an account, log in, and log out securely.

- **Profile Customization**: Users can personalize their profiles by changing their profile images.

- **User Search**: Users can search for other users to connect with.

- **One-to-One Chat**: Users can engage in real-time private conversations with each other.

- **Group Creation**: Users can create groups for collaborative discussions.

- **Group Chat**: Users can participate in group conversations, allowing multiple members to interact simultaneously.

- **Group Administration**: Administrators have the authority to rename groups and manage group membership by adding or removing users.

- **Message Notifications**: Users receive real-time notifications for new messages.

## Technologies Used

- **Front-end**: React.js, Redux, Tailwind CSS

- **Back-end**: Node.js, Express.js

- **Database**: MongoDB

## Screenshots

**Sign up**

![Sign up](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146231/lxipjhn3pdvkf5h6it98.png)

**Sign in**

![Sign In](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146246/pntbaaigxkup1puqgjwa.png)

**Home**

![home](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146043/p7obaxsyrz5l074jkyj7.png)

**Users Chat**

![home](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689145934/ipqp3jb0qyb32nip6osj.png)

**User Profile**

![user_profile](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146213/wvyx7ndxisaxpkgopxnh.png)

**Search User**

![search_user](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146068/utilpiyhlxikhju36c7d.png)

**Notfication**

![notification](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146057/b85aapingyke67r41vvb.png)

**Create Group**

![create_group](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689145950/afzfrs7dxuxij2z24vgy.png)

**Group Information**

![group_information](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689145976/bd8wyctt2tw4ukgwuoht.png)

**Group Admin Options**

![group_admin_option](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146029/rbkuo9dgrym9y3ayymz4.png)

**Change Group Name Only For Admin**

![rename](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146017/da8y031jf7twpxlp2ipy.png)

**Remove User From Group Only For Admin**

![remove_user](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1689146005/ymitbkdkz2mlfvrb9gvl.png)

**Add Users To Group Only For Admin**

![Add_user](https://res.cloudinary.com/dfrhy6m3m/image/upload/v1690197588/lehnw0hfqfnxu8ktajys.png)

  Backend Installation 

 

 clone repo  

 cd backend 

 npm install 

 node index.js 



  Frontend Installation 

 

 clone repo  

 cd frontend 

 npm install 

 npm start 



 Team Members 

 

 Mukul Jatav 



Let's Connect



    

        

    



 Show Your Support 

 Give a ⭐️ if you like this project!