// establish a WebSocket connection
const socket = new WebSocket('ws://localhost:8080');
// DOM elements
const messageInput = document.getElementById('message-input');
const sendButton = document.getElementById('send-button');
const messagesContainer = document.getElementById('messages-container');
// send message when send button is clicked
sendButton.addEventListener('click', () => {
const message = messageInput.value;
socket.send(message);
messageInput.value = '';
});
// handle incoming messages
socket.onmessage = (event) => {
const message = event.data;
const messageElement = document.createElement('div');
messageElement.innerText = message;
messagesContainer.appendChild(messageElement);
};
This code sets up a WebSocket connection to a server running at 'ws://localhost:8080'. When the "send" button is clicked, the message in the input field is sent to the server over the WebSocket connection. Incoming messages from the server are displayed in the 'messages-container' element.
Note that this is just a basic example and will likely need to be expanded and modified to fit the specific requirements of your chat app.
I trust this helps you! if you have any query you can ask me.
