nodejs javascript server side

Evaluando Node.js

Node.js es una aplicacion que permite correr JS desde el lado del servidor.

Si bien es un proyecto muy nuevo, segun se ha podido apreciar cuenta con mucho potecial, y lo mas interesante, podemos meter frameworks en JS como modulos, y programar en forma mas “comoda” en javascript.

Para los que andan en la busqueda de un nuevo lenguaje (en especial los programadores PHP que siempre andan buscando cambiar, pero no encuentran un lenguaje comodo) es quizas la mejor opcion.

JavaScript es un lenguaje muy simple de comprender, orientado a objetos, y con infinitas posibilidades. Sin lugar a dudas, hay que poner mucho trabajo para node.js siga creciendo.

Bueno, manos a la obra, vamos por parte.

Estas pruebas las hice en Ubuntu, pero mas adelante veremos lo mismo sobre FreeBSD.

Instalacion.

Primero que nada bajamos node.js http://nodejs.org/#download

Despues tenemos que instalar algunos paquetes para poder compilar

#apt-get install build-essential libssl-dev

Ahora si, vamos a compilar.

Descomprimimos:

#tar -zxvf node-v0.2.3.tar.gz

vamos al directorio:

#cd node-v0.2.3

Configuramos:

#./configure

Compilamos:

#make

Instalamos:

#make install

Primeras pruebas

Bueno, ya con node.js instalado, solamente tenemos que ejecutar “node” y veremos la consola.

#node

Para salir de la consola, solamente tenemos que precionar ctrl+D

La consola en si no va  a ser tema de estudio, pero si queremos hacer una prueba, podemos ejecutar

var a="hola mundo";
a;

Como siempre, lo ideal es leer la documentacio, pero vamos a hacer algunas pruebas mas.

Creamos un archivo llamado server.js con nuestro editor preferido para programar y ponemos este codigo

var http = require('http');

http.createServer(function (request, response) {
  response.writeHead(200, {'Content-Type': 'text/plain'});
  response.end('Hello World\n');
}).listen(8124);

console.log('Server running at http://127.0.0.1:8124/');

Guardamos y ejecutamos escribiendo

#node server.js

Ahora comprobamos si efectivamente funciona abriendo nuestro navegador favorito y poniendo como url

http://127.0.0.1:8124

Bueno, por el momento ha sido todo, pero seguire escribiendo articulos sobre node.js ya que me parece un proyecto apacionado.

Para todos aquellos que piensan que hay pocos plugins para Mootools, les presentamos Forge, el directorio oficial de la gente de Mootools que reune una gran cantidad de soluciones pre fabricadas y de alta calidad.

Podemos encontrar galerias de imagenes, manejo de maps (con google maps obviamente), buscadores, tabs, scrollers, etc.

http://tbela.fragged.org/demos/upload/Demo/

http://dev.thesociable.net/PhotoSurface/Demo/

http://thinkphp.ro/apps/js-hacks/timezone/mootools/demo7.html

http://thinkphp.ro/apps/js-hacks/Request.Keywords/demo1.html

http://www.farkess.com/~patouche/tuto-mootools/carrousel-3d/

http://www.omnisdata.com/omnigrid/

http://updel.com/demos/drag2crop/

http://www.mikematas.com/#!2Rs/5cB/ui_design/iphone_settings

http://www.panaghia.it/dev/mosaic/

http://holyshared.github.com/Gradually/

http://mifjs.net/misc/louper/Demo/

http://www.chipwreck.de/blog/software/cwcrop/cwcrop-demo/

http://cpojer.net/Scripts/FileManager1-0/Demos

En esta ocasion les presentamos un portal de juegos totalmente escritos en html5.

Para los que no esten familiarizados con el termino html5, viene a ser asi como la evolucion y el futuro web, y segun mucho lo que desplaza a flash para siempre.

Les dejo el link, asi ustedes mismo pueden apreciar las posibilidades de html5. http://html5games.com/

Bueno, esto lo pongo porque seguramente en algun momento tendra que obtener las coordenadas de un element con javascript.

function getCoordinates( Element ){
	var coordinates = {left:0,top:0};

	while( Element != null ) {
		console.log(Element, Element.offsetLeft  ,  Element.offsetTop);
		coordinates.left += Element.offsetLeft;
		coordinates.top += Element.offsetTop;
		Element = Element.offsetParent;

	}
return coordinates;
}

La funcion es simple, pasame el element (como objeto, con getElementById) y el script empieza a buscar todos los parents de ese objeto, y calcula su offsetLeft y offsetTop, como resultados obtenemos el total.

Espero que les sea util.

Si les ha pasado lo mismo que a mi, que Reflection en Chrome no esta operativo y muestra 2 veces la misma imagen, es porque deben parchar (yo lo tengo implementado con mootools 1.2.4 y la verdad tube que fixear varias cosas).

El problema es webkit419, que algo anda mal con la implementacion de canvas y objetos 2d… raro.

Solo basta con cambiar estas lineas de JS.

} else {
			var can = new Element('canvas').setProperties({'width':arg.width, 'height':arg.height});
			if(can.getContext && !Browser.Engine.webkit419){
				/*var ctx = can.getContext("2d");
				ctx.save();
				ctx.translate(0,arg.height-1);
				ctx.scale(1,-1);
				ctx.drawImage(i, 0, 0, arg.width, arg.height);
				ctx.restore();
				ctx.globalCompositeOperation = "destination-out";
				ctx.fillStyle = arg.color;
				ctx.fillRect(0, arg.height*0.5, arg.width, arg.height);
				var gra = ctx.createLinearGradient(0, 0, 0, arg.height*arg.ref);
				gra.addColorStop(1, "rgba(255, 255, 255, 1.0)");
				gra.addColorStop(0, "rgba(255, 255, 255, "+(1-arg.ref)+")");
				ctx.fillStyle = gra;
				ctx.rect(0, 0, arg.width, arg.height);
				ctx.fill();
				delete ctx, gra;*/

				 var ctx = can.getContext("2d");
                ctx.save();
                ctx.translate(0,arg.height-1);
                ctx.scale(1,-1);
                ctx.drawImage(i, 0, 0, arg.width, arg.height);
                ctx.restore();
                ctx.globalCompositeOperation = "destination-out";
                ctx.fillStyle = '#000';
                ctx.fillRect(0, arg.height*0.5, arg.width, arg.height);
                var gra = ctx.createLinearGradient(0, 0, 0, arg.height*0.5);
                gra.addColorStop(1, "rgba(255, 255, 255, 1.0)");
                gra.addColorStop(0, "rgba(255, 255, 255, "+(1-0.3)+")");
                ctx.fillStyle = gra;
                ctx.fillRect(0, 0, arg.width, arg.height);

			}
			return can;
		}

Seguramente a varios les habra pasado que quisieron implementar mooflow con una version de mootools bajada por ustedes mismos y se dieron cuenta que no caminaba.

Seguramente su firebug estaba abierto, y vieron el mensaje de error

uncaught exception: [Exception... "Component returned failure code: 0x80040111 (NS_ERROR_NOT_AVAILABLE) [nsIDOMCanvasRenderingContext2D.drawImage]” nsresult: “0×80040111 (NS_ERROR_NOT_AVAILABLE)”

Bueno, esto no es el fin del mundo, es un simple error conceptual por la gente de mooflow, pero lo solucionamos muy facilmente.

Busquen esta linea y modifiquen segun corresponda.

Element.implement({
reflect: function(arg){
//i = arg.img.clone();
var i = arg.img.clone().set('src', arg.img.src);

En uno de mis sitios mas “visitados” he integrado hace unos 3 meses el api de facebook connect, con la expectativa de aumentar el trafico, viralizar mis contenidos y sobre todo poder probar el api de la gente de facebook (que tan popular es en estos días).

Lo primero que me molesto, fue generar archivos en mi proyecto para la gente de facebook, también el api me parecio muy limitada y lo peor de todo… tardaba horrores en cargar.

Mas allá de que mi sitio era un promedio de 10 veces mas “lento”, y que cada 2 x 3 el api se comportaba de forma muy rara, los resultados fueron realmente muy malos, ya que no me aporto en nada haber creado fanpage, programar el compartir en tu muro lo que veías, etc.

Claro esta que podemos discutir de si los contenidos son interesantes o valen la pena compartir, o si el registro era necesario o no, pero claramente no todo lo que se hace con facebook es bueno y exitoso (claramente siempre depende de varios factores).

Entonces fue cuando tome la decisión de eliminar todo lo relacionado con facebook (a nivel api) de mi sitio (ya que considere que no era targe para facebook), ya que prefería velocidad y comodidad para mis users vs “viralidad”.

Casi decepcionado habia perdido las esperanzas de “viralizar” o “socializar” mi sitio cuando recorde a google friend connect.

Entre, di de alta mi sitio, eleji mi gadget (la toolbar de amigos, comments y demás) y la implemente en todas las pages de mi site.

Realmente google friend connect es otra cosa, cargaba 10 veces mas rápido que facebook connect, no se rompe nunca, no he detectado comportamientos raros, y no es tan “rebuscada” como la api de facebook.

Claro que esta es mi simple apreciación (Cesar Casas) y opinión, pero doy un total apoyo a google friend connect, y le saco todas las fichas a facebook.

He estado revisando un poco los antiguos post a la lista de webandbeer, y encontre uno que inicie hace ya un tiempito, y creo que vale la pena volver a recordar.

Estoy hace semanas matandome con manuales de html5, y experimentando mucho.

Algo que encontre y es muy pero muuuuy interesante, es el pensar en que como
html5 tiene websocket, uno podria en javascript programar toda una etapa que
decida en base a una conf inicial como debe comportarse la app, en base a
por ejemplo los times de repuestas de un servidor.

Por ejemplo, tenemos 3 WS, entonces, si ponemos un “cron” que revise cada WS
en intervalos de 1 minuto por ejemplo, midiendo solo el time de un simple
echo, eso nos permitiria saber que servidor esta teniendo mejor time de
respuestas, y no delegariamos ese laburo a equipos de load o RR.

Estoy pensando mientras escribo obviamente, pero tambien me imagino que si
podemos conectarnos a cualquier lado (websocket elimina la restriccion del
protocolo httprequest), y que javascript tiene un soporte total a utf8,
basicamente podemos escribir cualquier protocolo y armar un client web de
cualquier cosa que viaje por tcp/ip.

Obviamente que el concepto de AJAX desaparece bajo esta implementacion ya
que podemos tener la conexion abierta y escuchando el evento de que algo ha
llegado por ese socket.

Aca dejo un ejemplo de lo que se puede hacer:

http://www.google.com/url?sa=D&q=http://code.google.com/p/websocket-sample/wiki/samples%3Fts%3D1263487925%26updated%3Dsamples&usg=AFQjCNEAH0O2Js_aVLvJLVax4eO6dEytwA

Copie y pegue lo que literalmente escribi en ese post.

Lo dejo para investigar y ver que se puede hacer.

A todos aquellos fanaticos de mootools como yo, seguramente en algun momento les habra pasado que cuando quieren usar el metodo Scroll de la clase fx (fx.scroll), en ie en algunos caso el metodo no funciona correctamente.

Investigando un poco en google, encontre una clase que soluciona el problema (scroll2).

Ademas de encontrar la solucion, me puse  a ver que era lo que pasaba.

Encontre que cuando los metodos getWidth y getHeight son ejecutados en ie, no estan retornando correctamente los respectivos valores, y es por ello que la clase se comporta de una forma muy rara.

Entonces, aca les dejo el archivo para solucionar el bug de fx.scroll de mootools (1.2).

fx.Scroll2

De esta manera se anunció el release oficial de la versión 1.2 del Firebug.

Básicamente es un release final luego de varias betas.

Aquí pueden ver las release notes completas, con todos los bugs corregidos y los nuevos features.