Práctica 3

Práctica 3

Esta es la documentación técnica y manual de usuario de mi práctica 3.

Índice de Contenidos

• Documentación Técnica
• Manual de Usuario
• Mejoras Implementadas
• Autor

---

Documentación Técnica

Descripción del Proyecto

Este proyecto es un sistema de chat en tiempo real que permite la comunicación entre múltiples usuarios mediante tecnología WebSocket. Consta de un servidor Node.js con Express y Socket.IO, y una interfaz web responsive.

Estructura del Proyecto

📂 Raíz del proyecto
├── 📂 public/
│   ├── 🖼️ chat.ico → Favicon de la página
│   ├── 🔊 error.mp3 → Sonido para errores
│   ├── 🖼️ fondorec.jpeg → Imagen de fondo
│   ├── 📄 index.html → Página principal
│   ├── 🔊 message.mp3 → Sonido para mensajes
│   ├── 🔊 notification.mp3 → Sonido para notificaciones
│   ├── 🔊 party.mp3 → Sonido para eventos
│   └── 📄 styles.css → Estilos CSS
│
├── 📄 package-lock.json → Lockfile de npm
├── 📄 package.json → Configuración de Node.js
├── 📄 README.md → Documentación del proyecto
└── 📄 server.js → Servidor backend en Node.js

Front-end:

• HTML5
• CSS3
• JavaScript ES6
• Socket.IO Client

Back-end:

• Node.js
• Express
• Socket.IO
• Módulos nativos (http, path)

Funcionalidades del Servidor

• Conexión WebSocket: Maneja conexiones persistentes bidireccionales
• Gestión de Usuarios: Registro y seguimiento de nicknames
• Broadcast de Mensajes: Distribución de mensajes a todos los clientes
• Sistema de Comandos: Procesamiento de comandos especiales (/help, /list, etc.)

Manual de Usuario

1. Requisitos del Sistema

🖥️ Para el Servidor

• Node.js (versión 14.x o superior)
• Gestor de paquetes npm o yarn
• 500 MB de espacio disponible
• Puerto 3000 accesible

🌐 Para el Cliente

• Navegador moderno (Chrome 80+, Firefox 74+, Edge 80+, Safari 13+)
• Conexión a Internet estable
• JavaScript habilitado

2. Instalación y Configuración

🔧 Pasos de Instalación

1. Clonar el repositorio

• Clona el repositorio o descarga los archivos del proyecto.

2. Navegar al directorio del proyecto

• cd P3

3. Instalar dependencias

• El proyecto requiere las siguientes dependencias que se instalarán automáticamente:

  npm install express socket.io

4. Iniciar el servidor

• npm start

5. Acceder al chat

• Abre un navegador y visita http://localhost:3000 para acceder al chat.

3. Funcionalidades del Chat

Interfaz de usuario

Pantalla de inicio:

• Campo para ingresar tu nickname.
• Botón "Confirmar" para establecer tu identidad en el chat.

Sala de chat principal:

• Área de mensajes.
• Contador de usuarios conectados.
• Indicador de "usuario está escribiendo".
• Campo de entrada de mensajes.
• Botón de enviar.

Comandos disponibles

Escribe estos comandos en el chat para activar funciones especiales:

Comando	Descripción	Ejemplo
/help	Muestra todos los comandos disponibles	/help
/list	Muestra número de usuarios conectados	/list
/hello	Saludo del sistema	/hello
/date	Muestra la fecha y hora actual	/date
/happy	Mensaje de celebración	/happy
/gato	Muestra un emoji aleatorio de gato	/gato
/dado	Simula el lanzamiento de un dado	/dado
/fiesta	Mensaje festivo con emojis	/fiesta
/amor	Muestra el nivel de amor en el chat	/amor

Mejoras Implementadas

1. Sistema de Comandos Ampliado:

   • Nuevos comandos interactivos:
     • /happy - Muestra mensaje de celebración
     • /gato - Envía un emoji aleatorio de gato
     • /dado - Lanza un dado virtual
     • /fiesta - Animación especial
     • /amor - Muestra porcentaje aleatorio de amor

2. Indicador de Usuarios Activos:

   • Contador en tiempo real de usuarios conectados y sus nicknames
   • Visualización en la interfaz (ej: "👥 5 usuarios activos")

3. Sistema de Nicknames:

   • Identificación personalizada con nicknames
   • Validación de nicknames únicos
   • Límite de caracteres (20 máximo)

4. Notificación de Escritura:

   • Indicador visual cuando un usuario está escribiendo
   • Muestra "[nickname] está escribiendo..."
   • Timeout automático después de 3 segundos

5. Nickname en los mensajes:

   • Identificación de los mensajes enviados

6. Favicon:

   • Se ha añadido un favicon al chat web

Autor

Daniel Pérez