miércoles, 19 de septiembre de 2012

Cristalab

Cristalab


Introducción a TDD con Ruby on Rails y Test Unit

Posted: 19 Sep 2012 08:18 AM PDT

Uno de los temas que más me llamó la atención del desarrollo web en esta época fue el uso de todas las metodologías ágiles (si no sabes qué son, debes leer inmediatamente ese vínculo que estamos en el siglo XXI). Una de las que me pareció más intrigante e interesante fue TDD. Para darles un poco de contexto yo venía de una formación un poco más aburrida "formal" donde tenía RUP, Java y PHP como herramientas de desarrollo principal. Sin embargo mi tesis la hice en Action Script 2.0 y Macromedia Flash :cool: (todavía no era Adobe).

Luego de muchos años comencé a escuchar sobre TDD y cuando comencé a trabajar con el equipo de Xenda me encontré con un universo totalmente nuevo y maravilloso. Sobre TDD solamente voy a agregar a lo que dice el vínculo que puse antes, que es una técnica que nos asegura un software bastante limpio. Lo que sí voy a remarcar es que es una forma de desarrollo que está más vinculada a unos lenguajes que a otros. TDD es más usada por programadores de Ruby y Python que programadores de PHP y Java por ejemplo. Sin embargo PHPUnit y JUnit nos permiten trabajar con toda comodidad usando TDD en esos lenguajes.

Es importante que tengas en cuenta que es una metodología de desarrollo que requiere de práctica y que puede parecer un poco engorrosa al inicio pero luego nos trae muchos beneficios como por ejemplo tener un código limpio, asegurarme que, según va creciendo el proyecto mi código se mantiene funcionando correctamente, etc.

Este ejemplo lo voy a hacer usando TDD con Test Unit para Ruby. Test Unit para Ruby no es el único entorno de trabajo en TDD para Ruby y podemos ir más alla de los test unitarios y desarrollar usando test a niveles superiores. Tenemos rspec, capybara, cucumber y otras maravillosas herramientas de desarrollo que podrás investigar luego. Por ahora vamos a la base.

Necesitas para este ejemplo tener instalado Ruby. No te compliques la vida e instala Ruby on Rails, y si eres Windows user recomiendo RailsInstaller.

Para comenzar debemos tener un directorio llamado Calculadora y dentro de él dos archivos con extención rb (de Ruby) llamados Calculadora.rb y Calculadora_Test.rb.

Y ahora comenzamos.

Enviar comentario

Streaming de video en HTML5 usando Canvas y getUsermedia

Posted: 24 Aug 2012 08:40 AM PDT

Hoy quiero compartirles un tutorial/experimento que he realizado con Canvas + getUsermedia. La finalidad de esto es trasmitir lo que mi cámara web vé al resto del mundo, sin la necesidad de Flash.

Es lógico que en algún momento será posible trasmitir video y audio, en vivo, sin la necesidad de Flash, como yo lo veo tal vez éste esfuerzo nos dé una idea al respecto.

El primer regalo de WebRTC ha sido el acceso a la cámara y el micrófono de nuestra computadora para nuestro navegador, ello a través de la función getUserMedia, sin embargo la comunicación real-time todavía no está lista y quién sabe cuánto tengamos que esperar para que sea viable a niveles de producción.



Hoy, puedo mostrarles éste ejemplo que he creado utilizando Canvas y getUserMedia para trasmitir y la etiqueta img para que las personas accedan al streaming. La limitante para poder entrar al streaming sería entonces que tu navegador soporte Socket.io.

El resultado de ésto puede verse desde dos puntos de vista, el primero es que de manera local (como se ve en el video) las cosas funcionan bastante bien.

Sin embargo cuando se trata de correrlo online va algo lento, ésto puede ser porque lo he probado en un VPS con únicamente 500mb de RAM, no soy un experto en streaming pero puede que un servidor más poderoso y posiblemente una conexión más rápida que mis 2mb hagan ésto más viable.

¿Cómo funciona el streaming?


Las cosas son bastantes simples:
  1. Accedemos a la cámara con getUserMedia.
  2. Pasamos la información de la cámara a una etiqueta video.
  3. Usamos requestAnimationFrame para dibujar cada Frame del video dentro de Canvas.
  4. Con el método toDataURL obtenemos la información de Canvas en una imagen.
  5. Mandamos las imágenes vía socket.io a un servidor (bastante sencillo) con Node.js
  6. En el server mandamos la imagen a laws sockets conectadas.
  7. Las sockets colocan la imagen en el atributo src de una imagen y listo :O


Como las imágenes se envían en cada Frame del video, lo que tendremos en las sockets es el video reconstruido vía imágenes. Es sólo una idea, me gustaría saber qué opinan los expertos, les dejo el tutorial completo para aquellos que quieran seguirlo.



Y el repositorio en github, por si alguien quiere sólo trabajar en el código.

Por último, tal vez ésto te interese:

Enviar comentario

No hay comentarios:

Publicar un comentario