Como vimos en la introducción de este curso. Vamos a desarrollar una aplicación web tipo chat usando Node.js y SocketIO. Esta es la primera entrada donde entraremos en materia. Para ello necesitamos un servidor, ya sea en la nube o en local gracias a WAMP. También debemos descargar el entorno de ejecución de JavaScript que vamos a usar. El famoso Node.js.

Lo que nos va a permitir esta aplicación que vamos a crear va a ser el poder tener una especie de sala de chat en el cual vamos a poder entrar y enviar mensajes. También vamos a poder interactuar con varios clientes a la vez y en tiempo real. Esto quiere decir que podremos meter el chat en nuestro teléfono y los mensajes que escribamos de allí aparecerán en otros clientes como un ordenador y otro móvil conectados al mismo servidor. Lo mismo sucede si el mensaje se manda desde el pc. Esos mensajes se recibirán en el resto de aparatos conectados a ese servidor. Si el servidor es una página web, se podrán mandar los mensajes que se envíen desde el chat que vamos a crear y nos llegarán directamente.

Vamos a ver cómo hacemos esto que puede parecer muy complicado pero realmente es muy sencillo. La potencia que nos brinda SocketIO es tremenda y nos servirá para hacer aplicaciones en tiempo real como esta del chat. La sencillez para poder utilizarla también es muy grande.

Trabajaremos con la consola de Windows

Lo primero que vamos a hacer va a ser crear nuestro proyecto así que podemos hacerlo a través de la consola de Windows o alguna otra consola que nos guste utilizar. Habrá que ir al directorio donde tenemos los proyectos y crearemos un proyecto nuevo con el comando “mkdir” y le pondremos el nombre de “curso-sockets” y ahí dentro es donde vamos a trabajar con Node y con socketIO. Para hacer la aplicación de chat lo primero que tenemos que hacer un proyecto de Node.js es iniciarlo con el comando “npm init“.

Este comando lo que va a hacer en generar  el famoso fichero package.json el cual nos va a permitir definir dentro de las dependencias del proyecto, una serie de scripts para poder trabajar con el proyecto, cual va a ser el nombre, el número de verisón de este momento y otra serie de datos como las dependencias que vamos a tener que gestionar. Al lanzar el comando “npm init” nos va a saltar un asistente que no para pedir diferentes cosas que iremos añadiendo y pulsnado “enter” para pasar a la siguiente línea.

El nombre del proyecto que en este caso es “curso-sockets”, la versión que es la 1.0.0, la descripción que sera “Proyecto de chat con Node y Socket.io” y por último el end pont que suele llamarse index.js. el resto de campos podemos dejarlos vacíos o meter los datos que prefieras ya que no tendrán relevancia para nuestro proyecto.

Estas líneas, como ya comentábamos, nos crean un paquete llamado package.json. Si queremos ver el contenido de este paquete json, debemos usar el comando “cat” con las siguientes líneas

cat package.json
{
"name": "curso-sockets",
"version": "1.0.0";
"description": "Proyecto de chat con Node y Socket.io",
"main": "index.js",
"author": Alberto Vela (developeando.net)"
}

Comenzamos con nuestro proyecto web de chat con Node.js y Socket.io

Para comenzar con el proyecto, lo guardaremos  dentro de un Servidor WEB o en su defecto, en un servidor WAMP Apache. Se guardarán tres ficheros con los nombres:

  • curso-socket.sublime-projects
  • curso-socket.sublime-workspace
  • package.json

Ahora toca definir nuestra aplicación en el servidor. Para ello creamos una carpeta llamada “server” dentro del proyecto que servirá para definir y programar nuestra aplicación en el servidor. será en esta carpeta la que se encargue de recibir los mensajes y tendrá instalado el socket.io funcionando junto con el servidor y otros paquetes que veremos y añadiremos más adelante como ExpressJS.

También crearemos otra carpeta a la que llamaremos “client” donde añadiremos el HTML y CSS que dará forma a nuestra aplicación y dónde introduciremos el script que se conecte al socket utilizado para que pueda funcionar nuestra aplicación.