2008-03-24

Frase célebre

Hace mucho que no posteo nada, asi que voy a usar una frase célebre de relleno:

Computer science education cannot make anybody an expert programmer any more than studying brushes and pigment can make somebody an expert painter

Eric Raymond

Z

2008-03-03

El eslabón que faltaba entre el .NET Framework y los browsers: Volta

Hace un mes, mas o menos, mi amigo Johnny me había comentado al pasar sobre un compilador de MSIL a Javascript que estaban haciendo en Microsoft, pero no le di mucha importancia. Pensé que era uno de esos proyectos locos que solo servían como prueba de concepto o similar... hasta que lo vi.

Microsoft Volta es un proyecto (todavía en estado alpha o, a lo sumo, pre-beta) de Microsoft Live Labs para poder desarrollar aplicaciones web multicapa sin tener que preocuparse por aprender nuevos lenguajes, lidiar con problemas para hacer javascript cross-browser y varias otras cosas.
En cierta manera se puede ver como la respuesta de Microsoft al Google Web Toolkit, aunque todavía bastante menos maduro y obviamente, usando .NET en vez de Java.

Un ejemplo de lo que nos permite hacer Volta es hacer el diseño en HTML de una página, codificar todo su comportamiento desde cualquier lenguaje que trabaje con el .NET Framework y finalmente, el compilador de Volta generará todo el código y las assemblies necesarias para correr todo lo que se quiera correr desde el cliente, y las clases que deban ser ejecutadas desde el servidor serán llamadas de forma transparente, sin tener que agregar nada aparte de un atributo en la clase, indicándolo.

Nota antes de intentar usar esto: para poder crear nuevos proyectos de Volta, es necesario tener instalado Visual Studio 2008 y el Tecnology Preview de Volta. Tener en cuenta que es una de las primeras versiones que salen fuera de Microsoft como preview y aún contiene varios bugs y limitaciones.

Nota sin mucho sentido: como todavía no hay version del Copy Source as HTML para Visual Studio 2008, los ejemplos que voy a mostrar los voy a pegar como imágenes. Perdón por eso, pero hacer que se vea bien el codigo posteado en blogger es una tarea bastante ardua y no tengo muchas ganas de perder tiempo en esto :D

A continuación les muestro una aplicación de ejmplo que hice, la cual consiste en un simple Chat:

Mi idea era la siguiente: hacer una página que tenga 2 textboxes, uno para el nick y otro para el mensaje a escribir, un boton para enviar el mensaje y un div donde se vaya escribiendo el texto del chat.

Para empezar, creé el html de la página:
1

Una vez hecho esto, codifiqué la clase que representa esta página y obtuve los controles desde código manejado para poder usarlos:
2

En el evento Click del boton de la página hice que se llame al método _btnSend_Click, el cual se encarga de llamar al metodo AddMessage de la clase ChatState, la cual es la encargada de mantener el estado del chat, y luego agrega el nuevo texto al div donde se muestra la conversación:
3

Para poder mostrar también lo que el resto de la gente escribía en el chat, necesitaba poder pedirle al servidor que me actualice el contenido del div, por lo que creé un Time que se de dispare cada 5 segudos y llame al metodo UpdateChatBox, el cual se encarga de pedir las nuevas lineas agregadas al chat usando el método GetResponse de la clase ChatState y mostrarlas:
4

Como se habrán dado cuenta, la gran mayoría de todo este código debería correr en el cliente, excepto tal vez por la clase ChatState, la cual debería ejecutar en el servidor, conservando el estado de la conversación. Para hacer esto lo único que hay que hacer es ir a la clase ChatState, hacer click derecho sobre el nombre, ir a Refactor y hacer click en Tire-split to run at origin. Haciendo esto, se le agregará el atributo RunAtOrigin, lo que le indica a Volta que ese código debe ser ejecutado en el servidor y no en el cliente:
5

Finalmente, tocando F5 se dispara el browser elegido para debug (se puede usar IE o Firefox) y... listo! Estamos debuggeando nuestra aplicación volta!

Aca muestro un ejemplo de la aplicación funcionando:
6

Código del ejemplo: aca.
Hasta aca llega el post de hoy. Cuando haga algo mas veo de postearlo.

Z