Creando nuestra primera aplicación con Socket.io

Clase 7 de 26 • Curso de Aplicaciones en Tiempo Real con Socket.io

Cristian David Noreña Saldarriaga

student•

¿quieres ahorrarte la instalación de nodemon?, si es así, esta info es para ti.

actualmente desde la versión 18.11.10 de node, se encuentra el modo "watch", este comando reinicia el proceso cuando se cambia un archivo.

así quedaría el script:

"start": "node --watch src/index.js"

Irving Juárez

student•

Yo antes tambien pensaba que `node --watch` era un buen reemplazo de nodemon, pero el problema con el watch de node es que no deja ver logs, siempre los borra al momento de reload. Despues de investigar parece que no hay manera en la que watch deje ver los logs, por lo que mejor regrese a nodemon

Miguel Angel Choque Pacompia

student•

Con module

import express from "express";
import { createServer } from 'http';
import path from "path";
import { Server } from "socket.io";
import * as url from 'url';

const app = express();
const httpServer = createServer(app);
const io = new Server(httpServer);
const __dirname = url.fileURLToPath(new URL('.', import.meta.url));

app.use(express.static(path.join(__dirname, '/views')));

app.get('/', (req, res) => {
  res.sendFile(__dirname + '/views/index.html');
});

io.on('connection', (socket) => {
  console.log(socket.id);
});

httpServer.listen(3000);

uRieL Martinez Bautista

student•

npm init npm i express socket.io --save npm i bufferutil utf-8-validate --save-dev git init npm i nodemon --save-dev

Cayo Legal

student•

Es necesario usar el módulo http para usarla en la instancia Server de socket io? Tenia entendido que express ya crea un servidor

Johann F. Rojas

student•

No es necesario, puedes poner el servidor en una variable y pasarla a Socket.io

Fredy Max Chavez Loyola

student•

Para trabajar con modulos

index.js

index.html

package.json Agregar esta linea en el archivo

Yusef Gonzalez

student•

{ "type": "module", "name": "proyectname", "version": "1.0.0", "description": "", "main": "index.js"....

ahi es donde se debe poner

Henry Corredor

student•

Yo todavía no tengo claro qué diferencia tiene poner o no la etiqueta --save con npm install...

Enrique Maya Garcia

student•

Se usaba para añadir dependencias de producciòn. A partir de npm 5 para arriba, ya no es necesario ponerlo porque los paquetes por defecto se descargan para produccion(dependencies). Puedes usar --save-dev para instalar dependencias para desarrollo(devDependencies), aunque igual puedes dejar de usar ese flag y cambiarlo por -D

Carlos Antonio Molano Solarte

student•

Para los que usan Yanr 🐿 👍

yarn init
yarn add express socket.io
yarn add bufferutil utf-8-validate --dev

David Condori Quispe

student•

--save ?

Francisco Carranza

student•

¿Que tema de visual studio usa el profe?

Andres Mauricio Cárdenas Sánchez

student•

No lo pude hacer funcionar, me sale este error y no encuentro el por que validando rutas y cada linea esta exactamente igual

La verdad no tengo idea el porque ?

Error: ENOENT: no such file or directory, stat

Juan David Gonzalez Pamplona

student•

¿Alguien sabe como se puede configurar el socket io client en un .html de django template? El socket server está en una url publicada en internet.

Juan Pablo Neyra Guncay

student•

import express from "express";
import { createServer } from 'http';
import path from "path";
import { Server } from "socket.io";
import * as url from 'url';

const app = express();
const httpServer = createServer(app);
const io = new Server(httpServer);
const __dirname = url.fileURLToPath(new URL('.', import.meta.url));

app.use(express.static(path.join(__dirname, '/views')));

app.get('/', (req, res) => {
  res.sendFile(__dirname + '/views/index.html');
});

io.on('connection', (socket) => {
  console.log(socket.id);
});

httpServer.listen(3000);

Creando nuestra primera aplicación con Socket.io

Fundamentos de Socket.io

Cómo hacer aplicaciones en tiempo real

Protocolos de comunicación: HTTP vs. WebSockets

¿Qué es Socket.io?

Socket.io vs. WebSockets

¿Cómo funciona Socket.io?

Ciclo de vida de Socket.io

Socket.io en la práctica

Creando nuestra primera aplicación con Socket.io

Obteniendo información de conexiones en el servidor

Emisión de eventos

On, Once y Off

Broadcast de eventos

Creación de salas con Socket.io

Namespaces en Socket.io

Lógica de envio de mensajes

Manejo offline

Eventos volátiles

Manejo de Middlewares

Herramientas extra

Debugging en Socket.io

Configuración para testing usando la librería jest

Testing con jest

Admin UI

Proyecto WebChat

Estructura inicial del proyecto WebChat

Sistema de autenticación

Programando la lógica del chat

Detalles finales y demostración de chat en tiempo real

Cierre

¿Quieres un Curso Práctico de Socket.io?