https://github.com/rodrigo-dev7/chat-real-time
Aplicação de chat real-timel conversando com um servidor em NodeJS.
https://github.com/rodrigo-dev7/chat-real-time
chat express javascript nodejs real-time socket-io
Last synced: about 1 month ago
JSON representation
Aplicação de chat real-timel conversando com um servidor em NodeJS.
- Host: GitHub
- URL: https://github.com/rodrigo-dev7/chat-real-time
- Owner: Rodrigo-dev7
- Created: 2020-05-22T14:27:13.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-12T20:56:24.000Z (about 3 years ago)
- Last Synced: 2025-04-02T17:51:48.256Z (11 months ago)
- Topics: chat, express, javascript, nodejs, real-time, socket-io
- Language: HTML
- Size: 55.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# CHAT REAL TIME
- Criar aplicações real-time com NodeJS fica muito fácil utilizando o poder do Socket.io.
Aplicação de chat em tempo real conversando com um servidor em NodeJS.
## SOCKET O que é
- Socket.IO é uma biblioteca JavaScript para aplicativos da web em tempo real. Permite comunicação bidirecional em tempo real entre clientes e servidores da Web. Ele tem duas partes: uma biblioteca do lado do cliente que é executada no navegador e uma biblioteca do lado do servidor para o Node.js.
## Server code
```
const express = require('express');
const path = require('path');
const app = express();
const server = require('http').createServer(app);
const io = require('socket.io')(server);
app.use(express.static(path.join(__dirname, 'public')));
app.set('views', path.join(__dirname, 'public'));
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
app.use('/', (req, res) => {
res.render('index.html')
});
let messages = [];
io.on('connection', socket => {
console.log(`Socket conectado: ${socket.id}`)
socket.emit('previousMessage', messages)
socket.on('sendMessage', data => {
messages.push(data);
socket.broadcast.emit('receivedMessage', data);
});
})
server.listen(3000);
```
## Frontend Code
```
var socket = io('http://localhost:3000');
function renderMessage(message) {
$('.messages')
.append('<div class="message"><strong>'+ message.author +'</strong>: '+ message.message +'</div>');
}
socket.on('previousMessage', function(messages) {
for (message of messages){
renderMessage(message)
}
})
socket.on('receivedMessage', function(message) {
renderMessage(message);
});
$('#chat').submit(function(event) {
event.preventDefault();
var author = $('input[name=username]').val();
var message = $('input[name=message]').val();
if (author.length && message.length) {
var messageObject = {
author: author,
message: message,
};
renderMessage(messageObject);
socket.emit('sendMessage', messageObject);
}
})
```
## Dependencias
```
# yarn add els express socket.io
```