Un sitio web como sabemos está constituido entre otro por archivos html, js, css, jpg, gif, mp3, mp4, ico etc. Siempre que devolvemos un recurso a un cliente (normalmente el navegador) en la cabecera de respuesta indicamos el tipo de recurso devuelto:

Debemos inicializar el valor 'Content-Type' con el tipo de recurso a devolver, como en el concepto anterior solo devolvíamos archivos html nos bastaba con indicar siempre el valor: 'text/html'

Protocolo MIME

Los MIME Types son la manera estándar de mandar contenido a través de internet. Especifican a cada archivo con su tipo de contenido. Según el tipo de archivo que retornamos indicamos un valor distinto a Content-Type. Ejemplos de valores:
Content-type: text/html
Content-type: text/css
Content-type: image/jpg
Content-type: image/x-icon
Content-type: audio/mpeg3
Content-type: video/mp4

Ejemplo:

Confeccionaremos un sitio que contenga una serie de archivos html, css, jpg, mp3, mp4 e ico. Crearemos un directorio llamado ejercicio10 y dentro de este otro directorio interno llamado static donde dispondremos todos los archivos html,css, jpg, mp3, mp4 e ico. En el directorio ejercicio10 tipearemos nuestra aplicacion Node.js que tiene por objetivo servir las páginas HTML y otros recursos que pidan los navegadores web. La aplicación Node.js la llamamos ejercicio10.js

Primero definimos un objeto literal asociando las distintas extensiones de archivos y su valor MIME:
var mime = {
'html' : 'text/html',
'css' : 'text/css',
'jpg' : 'image/jpg',
'ico' : 'image/x-icon',
'mp3' : 'audio/mpeg3',
'mp4' : 'video/mp4'
};
Todo el resto del código es idéntico al concepto anterior salvo cuando tenemos que retornar el recurso que solicita el navegador:
var vec = camino.split('.');
var extension=vec[vec.length-1];
var mimearchivo=mime[extension];
respuesta.writeHead(200, {'Content-Type': mimearchivo});
respuesta.write(contenido);
respuesta.end();
Descomponemos en un vector separando por el punto la variable camino:
var vec = camino.split('.');
Si tenemos en la variable camino el valor:
/pagina1.html
Luego de ejecutarse el método split pidiendo que separa por el caracter punto tenemos en la variable vec dos elementos:
vec[0] tiene almacenado /pagina1
vec[1] tiene almacenado html
Sacamos el último elemento del vector que en definitiva almacena la extensión del archivo:
var extension=vec[vec.length-1];
Seguidamente rescatamos la propiedad del objeto literal mime:
var mimearchivo=mime[extension];
Por ejemplo si tenemos en la variable extension el valor 'html' luego en la variable mimearchivo se almacena: 'text/html' que es
el valor para dicha propiedad definida en la variable mime.
Ahora llamamos al métdodo writeHead donde retornamos el tipo MIME para dicha extensión:
respuesta.writeHead(200, {'Content-Type': mimearchivo});
El resto de este programa no sufre cambios con respecto a devolver siempre archivos HTML.
Luego de iniciar la aplicación desde la consola:

Ya podemos solicitar páginas al servidor que acabamos de inicializar y comprobar que nos retorna los distintos recursos enumerados dentro de cada página (imágenes, audios, videos, hojas de estilo etc.):

La organización de los archivos en el disco duro es:

Como vemos en la carpeta ejercicio10 se ubica la aplicación Node.js y la carpeta static con todos los recursos:

En nuestro ejemplo hemos limitado a servir 6 formatos de archivos distintos:
var mime = {
'html' : 'text/html',
'css' : 'text/css',
'jpg' : 'image/jpg',
'ico' : 'image/x-icon',
'mp3' : 'audio/mpeg3',
'mp4' : 'video/mp4'
};

JPanel en Java son objetos contenedores, la finalidad de estos objetos es la agrupación de otros objetos tales como botones, campos de texto, etiquetas, selectores, etc; una gran ventaja de Usar JPanel en Java es que podemos manejar la agrupación de una mejor forma, supongamos que tenemos una serie de botones en un panel, y deseamos desactivarlos todos a las vez, en lugar de hacerlo individualmente con los botones, podemos desactivar el panel y con esto los botones.

CREANDO JPANEL EN JAVA

Con el siguiente ejemplo voy a mostrar tres paneles, cada uno con un layout diferente, ademas de esto tres botones los cuales mostraran como quitar o poner la visibilidad en cada panel obteniendo el beneficio de la agrupación que comentaba en la introducción:

Si se ejecuta el codigo se vera la siguiente ventana:

Un módulo fundamental para implementar aplicaciones en un servidor web es el 'http'. 'http' es un módulo del core de Node.js e implementado en C para una mayor eficiencia en las conexiones web.

Protocolo HTTP

Lo primero que haremos es repasar el funcionamiento de este protocolo tan importante en Internet. HTTP (HyperText Transfer Procolol) o (Protocolo de transferencia de hipertexto) permite la transferencia de datos entre un servidor web y normalmente un navegador. Cuando accedemos a un sitio web desde un navegador escribimos entre otras cosas:
http://host[:puerto][/ruta y archivo][?parámetros]
http (indica el protocolo que utilizamos para conectarnos con un servidor web)
host (es el nombre del dominio por ej. google.com.ar)
puerto (es un número que generalmente no lo disponemos ya que por defecto el protocolo http utiliza el nro 80, salvo que nuestro servidor escuche peticiones en otro puerto que ya en este caso si debemos indicarlo)
[/ruta y archivo] (indica donde se encuentra el archivo en el servidor)
?parámetros (datos que se pueden enviar desde el cliente para una mayor identificación del recurso que solicitamos)
Desde el navegador parte el pedido y el servidor tiene por objetivo responder a esa petición.

Servidor web con Node.js

Cuando trabajamos con la plataforma Node.js debemos codificar nosotros el servidor web (muy distinto a como se trabaja con PHP, Asp.Net, JSP etc. donde disponemos en forma paralela un servidor web como puede ser el Apache o IIS) Veremos inicialmente la implementación de un servidor web utilizando solo el módulo 'http' pero más adelante incorpararemos otros módulos que nos facilitan el desarrollo de sitios web complejos (de todos modos siempre utilizando y extendiendo las funcionalidades del módulo 'http')

Ejemplo

Implementar un servidor web con Node.js que retorne HTML con un mensaje indicando que el sitio esta en desarrollo. No importa que archivo pidamos del servidor retornar siempre el mismo HTML. Creamos el archivo ejercicio7.js y lo guardamos en la carpeta donde estamos haciendo nuestros prácticos para poder probarlo:

Para probarlo primero ejecutamos el programa ejercicio7.js:

Como vemos luego de ejecutarlo el programa muestra el mensaje 'Servidor web iniciado' y no finaliza, esto debido a que esta esperando peticiones en el puerto 8888. Podemos abrir nuesto navegador y accedir al servidor local (localhost) en el puerto 8888 y ver que ahora tenemos como resultado:

Si detenemos el servidor que creamos desde la consola (Presionamos las teclas Ctrl C que aborta el programa) y solicitamos
nuevamente datos al servidor podremos ver que ahora el servidor no responde:

Es importante entonces tener en cuenta que el programa Node.js este ejecutándose para poder pedirle recursos. Otra cosa muy importante es que cada vez que hagamos combios en el código fuente de nuestra aplicación en JavaScript debemos detener y volver a lanzar el programa para que tenga en cuenta las modificaciones. Pasemos ahora a analizar el código de nuetro servidor. Primero requerimos el módulo 'http' y guardamos una referencia en la variable http:
var http=require('http');
El módulo 'http' tiene una función llamada createServer que tiene por objetivo crear un servidor que implementa el protocolo HTTP. La función createServer debemos enviarle una función anónima (o podemos implementar una función definida como vimos en el concepto anterior) con dos parámetros que los hemos llamado pedido y respuesta. Los objetos pedido y respuesta los crea la misma función createServer y los pasa cuando se dispara el pedido de una página u otro recurso al servidor. Igual que cuando vimos archivos de texto estamos utilizando programación asincrónica, la función createServer se ejecuta en forma asíncrona lo que significa que no se detiene, sino que sigue con la ejecución de la siguiente función: servidor.listen(8888); La función listen (escucha) que también es asíncrona se queda esperando a recibir peticiones. Antes que solicitemos una página desde el navegador podemos ver en la consola el mensaje de: 'Servidor web iniciado'. El programa como podemos ver desde la consola no ha finalizado sino que esta ejecutandose un ciclo infinito en la función listen esperando peticiones de recursos. Dijimos que cuando hay una solicitud de recursos al servidor se dispara la función anónima llegando dos objetos como parámetro:


El primer parámetro que lo iremos viendo a medida que avance el tutorial contiene entre otros datos el nombre del archivo que solicitamos, información del navegador que hace la petición etc. En nuestro programa actual al parámetro pedido no lo utilizamos El parámetro respueta es el que tenemos que llamar a los métodos: writeHead: es para indicar la cabecera de la petición HTTP (en esta caso indicamos con el código 200 que la petición fue Ok y con el segundo parámetro inicializamos la propiedad Content-Type indicando que retornaremos una corriente de datos de tipo HTML write: mediante la función write indicamos todos los datos propiamente dicho del recurso a devolver al cliente (en este caso indicamos en la cabecera de la petición que se trataba de HTML) end: finalmente llamando a la función end finalizamos la corriente de datos del recurso (podemos llamar varias veces a la función write previo a llamar por ónica vez a end) Otra cosa importante de notar de nuestro servidor web elemental es que no importa que archivo pidamos a nuestro servidor web siempre nos devolverá el código HTML que indicamos en la función anónima que le pasamos a createServer (en este ejemplo solicito el archivo pagina1.html, lo mismo sucedería si pido otras páginas: pagina2.html, pagina3.php etc.):