Protocolos de comunicación AJAX

Un protocolo es una serie de reglas a seguir para poder establecer una comunicación entre 2 o mas programas, computadoras, entre otras.

Si haz desarrollado en Java usando threads y sockets, probablemente sabes a que me refiero, es importante establecer reglas y eviarlas "over the wire" para que se pueda establecer una conversación coherente.

Esto tiene mucho que ver con respuestas de XMLHttpRequest. En la arquitectura web tenemos 2 lugares de "trabajo", el server y el cliente. Estos 2 workspaces trabajan en un universo completamente diferente, esto quiere decir que variables del server no pueden ser vistas por el cliente, al menos de manera directa y por lo tanto una sentencia o accion de server no puede provocar un refresh del cliente (vdd nena? jaja) o viceversa. Cada dia salen mas y mas nuevas tecnologias que buscan acortar la distancia entre ambos "universos", sin embargo esto es solo una ilusion, al menos por ahora, pues solo son procedimientos que te hacen pensar que el lenguaje cliente y lenguaje server pudieran ser uno mismo cuando en realidad existen todo tipo de metodos o tweaks por atras. Para que este fuera posible, la arquitectura cliente-servidor deberia de rehacerse.

Muy bien, una vez aclarado esto es tiempo de comenzar.


Accion de server a Cliente

Muy bien, supongamos que tenemos una aplicación de chat en la web que se actualiza por medio de llamadas asincronas conectandose con el server cada 5 segundos, que sucede si en una de esas llamadas se nos niega la conección (Ya sea porque lo tumbaron, ya no esta loggeado u otras), como le hacemos para redirigirlo a la pagina de login??

Lo que tenemos que hacer es desarrollar un mini protocolo de comunicación entre el cliente y el server, que ambos lo entiendan (o al menos que nosotros lo entendamos).

por ejemplo:

Server (PHP)
 echo "{success:false, errorType:1, data:{...}}"

Cliente (Javascript)
 //Obtenemos la respuesta por medio de un XMLHttpRequest
 var response = eval(ajaxResponse);
 //Apartir de aqui, podemos hacer lo que queramos con el JSON
 if(response.errorType == 1){
   window.location = "../index.php"
 }

*El ejemplo es solo para motivos didacticos

Este tip es de lo mas sencillo, lo dificil para algunos es la arquitectura web, que se puede hacer y que no =P

Una vez que le agarramos la onda, todo tipo de loqueras se nos empiezan a ocurrir jaja.


Introduction to ExtJS

Hi! in my previous posts I talked about some basic tips and tricks any web and javascript developer should know and posted a very handy video that explains the rest of them. That should be more than enough to start learning the amazing world of ExtJS.

I'd like to add that I "discovered" ExtJS existence when I downloaded an open source project management application called opengoo which all of its main UI components were made by ExtJS.

What's ExtJS?


It's an amazing javascript framework!!...Amazing you say? indeed! It is a complete toolkit that enable us to make professional ajaxed web applications in minutes, without caring about css styling or performance, ExtJS does it for you.

In a Nutshell

The framework can be devided in two:

ExtJS Core : This is the utility library, whats that? well, have you heard of JQuery, prototype, yui? it's the same thing, it contains DOM Selectors, Animations, Event Handling and many more, but if you are more familiar with those above, ExtJS has something called "Adapters", this adapters will let you use Jquery or prototype as your core library insted of Ext's it will work the same.

ExtJS : This is an efficient, powerful and very well engineered widget library which has out of the box Grid Panels, Trees, Modal windows, menus, form controls and many more. All of this components were crafted using the best javascript patterns and practices that even enable you to extend all of the components functionality and even mix components to adapt to your application needs without making changes to the framework source.


ExtJS is going UP!

This framework has been rated by Gartner as "promising" for the near future along with adobe flex and others.

Since it is made of pure javascript code, html and css, its is possible to use this framework with adobe air and create desktop applications.

Avery day more developers are starting to use ExtJS, however the current user base have already created a bunch of custom opensource controls for you to use, you'll be amazed by those eye candy controls ;)


In the next post i'll create a "Hello ExtJS" till we get to "Creating Big Applications Using ExtJS" =) it's going to be interesting, stay tunned !

Bye!