Skip to content

💬 A real-time chat application based on pure JavaScript technologies inspired by UOL Chat, allowing users to enter chat rooms, send and receive messages, and view previous messages. It also utilizes the UOL Chat API for maintaining user connections and implementing some features.

Notifications You must be signed in to change notification settings

natividadesusana/uol-chat

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

39 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Project UOL Chat

The implemented project is a real-time chat, inspired by UOL Chat. It allows the user to enter a chat room, send and receive messages and view previous messages exchanged in the room. It is based on pure JavaScript technologies and does not use libraries or other languages that compile to JavaScript. In addition, it uses the Chat UOL API to maintain the user's connection and implement some functionalities.

Captura de Tela 2023-01-22 às 17 53 26

Captura de Tela 2023-01-22 às 17 58 28

Captura de Tela 2023-01-22 às 17 59 30

Captura de Tela 2023-01-22 às 18 00 07

To test the project working, access this link: https://projeto5-batepapouol-navy.vercel.app/

ℹ️ About

The project was motivated by the need to develop pure JavaScript skills and explore developing real-time chats. The project implements the following features:

  • Room Entry: When the user accesses the page, they are asked to enter their name, and then the name is sent to the server to register the user. If the server responds successfully, the user can join the room. Otherwise, he must choose another name.
  • Sending messages: User can send messages to the chat room. When the server responds successfully, the chat room messages are updated and the new message is displayed.
  • Message View: The chat displays past messages from the chat room as well as newly sent messages. There are three types of messages: regular messages, reserved messages, and status messages (such as "Joined" or "Left" the room). Each message type has a different background and reserved messages are only displayed if the sender or recipient is the same as the user.
  • Auto Update: The chat room is updated every three seconds to keep the user up to date with the latest messages.
  • Keeping the connection: The server must know that the user is still online. For this, every 5 seconds the system must send a POST request to the Chat UOL API informing that the user is active.
  • Message search: User can search previous messages in the chat room.

🛠️ Technologies

  • Javascript
  • UOL Chat API

💻 How to run the project

  1. Clone the repository to your local machine.
  2. Open the index.html file in a web browser.
  3. Enter your name and click "Join Room".
  4. Send and receive messages in the chat room.

How to Contribute

Contributions are always welcome! If you find any bugs or have suggestions for new features, feel free to open an issue or pull request.


Mobile Layout

Captura de Tela 2023-01-22 às 18 03 46

Captura de Tela 2023-01-22 às 18 05 18

Captura de Tela 2023-01-22 às 18 04 33

Captura de Tela 2023-01-22 às 18 04 50

About

💬 A real-time chat application based on pure JavaScript technologies inspired by UOL Chat, allowing users to enter chat rooms, send and receive messages, and view previous messages. It also utilizes the UOL Chat API for maintaining user connections and implementing some features.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages