Summer Internship II-ChatMates (Web Chat Application)
Introduction
We made a chat web app in PHP using VS code for front end and Phpmyadmin for database . The name of this web application is Realtime chat application . In this web application the user is greeted with the login page and has to signup if the user is new. Then after signing-up he/she can see the people that are in there in the application and can engage in a chat securely with anyone. The user can engage socially and can develop communication skills using this application.
How it works
In this chat application, when you open it in your browser for the first time, a signup form is displayed in which you must register your data, such as name, email, password, and image. The email and image fields are fully verified, which means you only need to enter a valid email and image file. After successful registration, you will be redirected to the user page, where you can see their full name, image, status, and logout button at the top. If someone signs, the user like you will appear at the bottom. up.
On this page, you can see your photo, name, status, and the last message they sent you. You need to click on a specific user, or you can also search for any existing user by name, and then you will be redirected to the chat page, where you can see the image, name and status of the user you want to chat with.
Once you send a message to another user, the message will immediately appear in your chat box and the message will also appear in the chat box of the other user to whom you sent the message. In the message recipient’s chat box, the user received a message with a picture of the sender. Remember, once the chat box starts scrolling, the chat box will automatically scroll to the bottom. You can log out of the chat application at any time. Once you log out, all other users will immediately know that you are logout or offline.
After logging out, you can log back in and use the email and password you used in the registration form. If you enter the correct credentials, you will be redirected to the user’s page and all other users will immediately know that you are logged in and that you are active.
Implementation
The chat logic is entirely built using front-end technologies like HTML, CSS, JavaScript and PHP and the back-end resides in Phpmyadmin database. Bootstrap is used for responsiveness and JQuery is used for chat logic assigning outgoing and incoming message id.
We have used all general coding standards of the PHP programming language with the necessary norms and standards. For developing design of this application we use some basic UI/UX for this web app.
System Requirement
- Hardware Requirements:- This Project is based on web application so for that 2GB ram and some free space is required.
- Software Requirements:-
- Device
- Web browser
- For developers: IDE and MySQL
System Design
- Use Case Diagram
- Flowchart
Snapshots
Further Extensions
- Forgot Password module can be developed
- Message encryption performance
- Hosting
- Small UI tweaks
Conclusion
We made this web application so that during the pandemic people can connect with each other and also improve there communication skills. Another benefits include social media interaction with perks of privacy. As there is no media sharing available fake media videos can also be avoided. On a learning aspect we got to do hands-on with several web technologies and also in future we will try to deploy the system and improve the performance of the system.
