Simple Chat System using PHP/MySQL and WebSocket with Source Code

Project: Simple Chat System using PHP/MySQL and WebSocket with Source Code

About

The Simple Chat System using PHP/MySQL and WebSocket is a simple PHP/MySQL project also with the help of a web socket. The system is inspired by well-known applications or web applications such as Facebook Messenger, Skype, and Viber. In this project, the system will help you to understand how a chat system works like on how they are stored, send, and receive messages of the multiple users. Talking about the flow of the system, the chat system users must create their credentials to access the system and connects to other users. System users can simply find their desired user/s to chat with by searching the name or username of the other users and when the user finds the desired user to chat within the suggested field or the search result field, they will simply click the user of their choice and this will be redirected to conversation field. When both users do not have any conversation from the past, the thread will be automatically created when one of the users will send a new message to the other user, and if they have already a conversation before the messages will be automatically fetched from the database. With help of a web socket, this will make update the message count and conversation messages in real-time, which means if both users are online or logged into the chat system the data will be updated automatically without reloading the page. The messages that have sent will remain as unread messages until the receiver will open the conversation box and by the time the user views the messages, the unread messages will be automatically updated in to read messages.

Features

• Loggin Page
  • The page where chat system users will submit their system credentials to access their conversations with other users or to start sending messages to the other users.
• Signup Modal
  • The popup modal in the Login page where the new users will register their system credentials.
• Home Page
  • The page where the system users will be redirected by default after logging into the chat system.
• Search Bar
  • The input where the users will search the name or username of the other users to send a new message to them.
• Conversation List
  • The list of other users that the logged-in user has messaged before or received a message before located on the left side of the screen. This list displays the user image, name, and the count of unread messages.
• Conversation Box
  • The card or box on the conversation page where all messages between users are shown.

To have an actual demo of the Simple Chat System, download the source code, and follow the instructions below on how to run the source code.

How to Run

1. Download the source code and extract the zip file.
2. Download or set up any local web server that runs PHP script.
3. Make sure uncomment the "extension=sockets" line in your php.ini file.
4. Run the php-socket.php file in your command line or terminal. [ php php-socket.php ]
5. Open the web-server database and create a new database name it chat_db.
6. Import the SQL file located in the database folder of the source code.
7. Copy and paste the source code to the location where your local web server accessing your local projects. Example for XAMPP('C:\xampp\htdocs')
8. Open a web browser and browse the project. E.g [http://localhost/simple-chat-system]

Admin Access:

Username: admin
Password: admin123

I hope this Simple Chat System project will help you with what you are looking for. Feel free to modify the source code in the way you wanted.

Explore more on this website for more Source Codes and Tutorials.

Enjoy!