SlideShare a Scribd company logo
1 of 26
Download to read offline
Un vistazo al futuro


  NODE.js
               Semana de la Ingenieria 2012
Universidad Tecnológica Nacional - Facultad Regional Tucumán
Todo sobre @jmma

                   Juan Maria Martinez Arce
                   Partner en INSIGNIA
                    
                    
                   Software Developer con experiencia en: C/C++,
                   Delphi, Genexus, PHP, Ruby, CSS, y Javascript.
                    
                   Especializado en el desarrollo de aplicaciones de
                   alto tráfico construidas con Ruby on Rails.
                    
                   Indefinida y perdidamente enamorado
                   de Ruby y todo su glamour.
                    
                   Cazador furtivo de tecnologías con las que se pueda
                   jugar un rato.
Empecemos por el principio...




         De todas las tecnologías que andan
         dando vuelta por Internet...
          

         Por qué NODE.js!?
Buenas preguntas, merecen respuestas simples

                         Es un tema de gustos
                         No podría ser de otra manera
                          
                          
                         +1 Javascript tanto server-side como client-side.
                          
                         +1 Construido sobre V8 (Google).
                          
                         +1 Es muy rápido.
                          
                         +1 Tiempo real / Alta concurrencia.
                          
                         +1 Se puede lograr mucho con poco.
                          
Hasta aquí no me dijiste nada...




                                   Falta que
                                   me digas
                                   que NODE.js
                                   es relativo.
Nos pongamos técnicos...


Qué es   NODE.js?
Fue construido sobre Javascript Runtime de Google (V8).
 
Utiliza un modelo I/O sin bloqueos guiado por eventos.
 
Pensado para aplicaciones de consumo intensivo de datos en tiempo real.
 
Eficiente consumo de memoria bajo sistemas de alta carga.
 
Gran manejo de concurrencia y balanceo de carga.
 
Un mix de características que vende.
 
Es NODE.js la nueva bala de plata?




                                Estoy seguro
                                que aquí
                                algo anda
                                mal...
NODE.js y su


Lado   OSCURO
Y, sí... Tenía que tener algo malo...

                            El problema de ser joven
                            Como en toda tecnología novedosa...
                             
                             
                            :( Muy poca documentación.
                             
                            :( Comunidad relativamente pequeña.
                             
                            :( Ambiente de producción poco amistoso.
                             
                            :( Hay que programar en Javascript.
                             
                            :( Hay que programar en Javascript.
Este es el ejemplo más simple que se puede lograr en NODE.js.
 
Un server que a cada petición responde: "Hello World".
Pensado para aplicaciones de consumo intensivo de datos en tiempo real.
 
Javascript es un lenguaje extremadamente potente.
Fue elegido en la implementación de NODE.js porque su comportamiento en el browser
es exactamente el comportamiento que NODE.js busca implementar.
 
El gran pero: Javascript no es un lenguaje simple ni mucho menos natural.
Require mucho tiempo de aprendizaje y paciencia (sobre todo con los errores).
Para dimensionar mejor el concepto:
 
Necesitamos definir la clase Pet
Para que simplemente nos salude, diciéndonos su
nombre.
 
Todo ese código, al ejecutarlo, produce esto:
 
 
 
 
 
 
Nuevamente, Javascript no es un lenguaje
simple ni mucho menos natural.
Require mucho tiempo de aprendizaje y
paciencia (sobre todo con los errores).
Basta de pálidas!




                    Node.js es
                    una masa,
                    les mostremos
                    por qué!
Playtime!


caso   Práctico
Qué queremos hacer...

                        I'm Here!
                        Una app para dejar tu huella en esta charla.
                         
                        Objetivos:
                         
                        - Un usuario debería poder hacer check-in dejando su
                        nombre y un mensaje.
                         
                        - La app debería proveer un dashboard desde donde
                        se listen todos los checkins.
                         
                        - Actualizar el dashboard en tiempo real a medida
                        que los usuarios hagan checkin.
                         
                        - Testear el código de la App.
Antes de empezar...

                      Qué tenemos disponible
                      Veamos qué tecnologías nos pueden dar una mano
                       
                      - CoffeeScript. Para no sufrir con Javascript.
                      - Jade. Para simplificar las vistas en HTML.
                      - Redis.io. Para almacenar nuestros checkins.
                      - Express.js. Framework para aplicaciones web.
                      - Socket.io. Para la actualización en real-time.
                      - Foundation. Para que la app quede presentable.
                      - Mocha. Para testear nuestro código.
                      - Node.js. Para hacer funcionar todo lo anterior.
                      - npm.js. Para instalar todo lo anterior.
                      - Mucha Fé. Para que todo funcione correctamente.
                      - Cruzar los dedos. Para que la demo funcione.
Bootstraping
Instalemos los paquetes básicos que nos hacen falta
 
- Node.js.
http://nodejs.org/
La manera más simple de instalar Node.js es descargar
el instalador desde la página. El mismo instalará node.
js y npm.
 
- Express.js.
http://expressjs.com/
Se instala de manera muy sencilla con:
npm install -g express
 
- Redis
http://redis.io/
La instalación varía mucho entre cada OS. En estos
casos, es muy bueno preguntarle a google.
Modelo User
Necesitamos una clase para abstraer el
almacenamiento de la información que
manejará nuestra app.
 
CoffeeScript nos permite escribir código
Javascript a través de una sintaxis muy
similar a la de Ruby.
Mas info: http://coffeescript.org/
 
Redis. Nos provee de una DB simple (clave,
valor) para almacenar la información del
modelo y recuperarla.
Mas info: http://redis.io/documentation
 
- Entendiendo el Voodoo.
Este modelo necesita generar un key en el
que se almacenarán todos los usuarios,
identificados por un ID basado en su nombre.
 
Vistas requeridas
Necesitamos un formulario para postear los datos
del usuario y un listado de checkins para ser
mostrado en el dashboard.
 
Jade es un template engine que nos permite
escribir código HTML a través de un markup muy
simple y muy elegante.
Mas info: http://jade-lang.com/
 
Algo muy positivo. La sintaxis de Jade y
CoffeeScript son muy similares, esto ayuda mucho
al momento de cambiar de contexto entre un
código y el otro.
Routing
                    Nuestra app necesita manejar
                    3 URLs. Una para mostrar el
                    formulario, otra para postear
                    estos datos y crear el checkin
                    y una tercera para presentar el
                    dashboard.
                     
                     




Express permite implementar pequeños routers de
manera muy sencilla para manejar las URLs que
necesitamos.
 
Los conceptos más complicado de asimilar son:
> En Javascript no hay scope mas que el scope de
la función.
> Cada función que se ejecute de manera
asincrónica debe proporcionar un callback.
Testing
                 El desarrollo guiado por tests
                 es una práctica a la que
                 deberíamos ajustarnos
                 siempre. Ahorra mucho
                 esfuerzo al momento de
                 realizar bugfixing o pruebas
                 de integración.
                  
                  




Mocha provee un framework para escribir
tests que verifiquen código producido en
Javascript. Es muy versátil y extremadamente
veloz.
Mas info: http://visionmedia.github.
com/mocha/
 
Lo más complicado: hacerse camino a través
de los errores iniciales (que son poco
descriptivos)
El Dashboard
El core feature de nuestra app consiste en contar
con un dashboard que se actualice a medida que
los usuarios vayan haciendo check in, en tiempo
real en todos los clientes conectados.
 
Socket.io provee un mecanismo para implementar
enlaces en tiempo real entre un server y sus
clientes corriendo entre distintos dispositivos.
Mas info: http://socket.io/#how-to-use
 
Lo que hay que entender: la implementación de
Socket.io en una app requiere de soporte tanto
server-side como client-side.
 
En el server, es necesario indicar qué evento se
debe propagar entre los clientes conectados.
 
En el cliente, se debe resolver qué hacer una vez
que dicho evento ha sido transmitido.
 
La hora de la verdad...

                          Qué debería pasar..?
                          Si es que Murphy no hace de las suyas.
                           
                          Hacer checkin. Debería poder el formulario,
                          poner mis datos, hacer submit y mis datos
                          deberían ser listados en el dashboard.
                           
                          Actualización en Tiempo Real del Dashboard.
                          Por cada checkin que se realice, el dashboard
                          deberá actualizarse automáticamente en cada
                          dispositivo conectado.
                           
                          A ver qué resultó de todo esto.
                           
                           
                           
                          Atención: esto podría fallar.
Live Demo

A jugar con   ImHere
Y llegamos al final.

                       Qué hacemos ahora?
                       Les tiro un par de ideas...
                        
                       Consultar dudas. Y sí... Por ahí hablo rápido y
                       digo incoherencias. Mejor quitarse la duda
                       ahora.
                        
                       Agendan mis datos por cualquier cosa.
                       @jmma
                       juan@insignia4u.com
                       www.insignia4u.com
                       http://github.com/jmax
                        
                       Nos vamos. No si antes agradecer a la UTN-
                       FRT por el espacio y el esfuerzo para que esta
                       charla salga así de bien.
                        
Y bueh... nos tenemos que ir.

          Gracias por venir y
              participar.
El código de la demo app se puede descargar en: https://github.com/jmax/imhere
Esta presentación estará disponible muy pronto en: http://www.insignia4u-blog.com/
Ningún ser viviente fue lastimado durante la preparación de esta presentación.
Cualquier similitud con hechos de la vida real es mera coincidencia.

More Related Content

What's hot

ventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticosventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticos
Irving Muñoz
 
Mi lenguaje de programación de preferencia
Mi lenguaje de programación de preferenciaMi lenguaje de programación de preferencia
Mi lenguaje de programación de preferencia
eliabreu1234
 

What's hot (19)

Construye un bot para Microsoft Teams sin saber programar
Construye un bot para Microsoft Teams sin saber programarConstruye un bot para Microsoft Teams sin saber programar
Construye un bot para Microsoft Teams sin saber programar
 
Qué es java
Qué es javaQué es java
Qué es java
 
Visual studio 2017 - Mobile Hybrid Application
Visual studio 2017 - Mobile Hybrid ApplicationVisual studio 2017 - Mobile Hybrid Application
Visual studio 2017 - Mobile Hybrid Application
 
Introduccion a Java
Introduccion a JavaIntroduccion a Java
Introduccion a Java
 
Java Scripts
Java ScriptsJava Scripts
Java Scripts
 
Java script
Java scriptJava script
Java script
 
RIA con JavaFX
RIA con JavaFXRIA con JavaFX
RIA con JavaFX
 
1.introduccion java
1.introduccion java1.introduccion java
1.introduccion java
 
Lenguaje de Programación Java
Lenguaje de Programación JavaLenguaje de Programación Java
Lenguaje de Programación Java
 
todo sobre java
todo sobre javatodo sobre java
todo sobre java
 
Lenguaje de programación java
Lenguaje de programación javaLenguaje de programación java
Lenguaje de programación java
 
Que Es Java
Que Es JavaQue Es Java
Que Es Java
 
Mini curse
Mini curseMini curse
Mini curse
 
ventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticosventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticos
 
Lenguaje java
Lenguaje javaLenguaje java
Lenguaje java
 
Jornada 10 años ASP NET en Español - Implementación de Notificaciones Push...
Jornada 10 años ASP NET en Español - Implementación de Notificaciones Push...Jornada 10 años ASP NET en Español - Implementación de Notificaciones Push...
Jornada 10 años ASP NET en Español - Implementación de Notificaciones Push...
 
Ruben fuentes programacion_web
Ruben fuentes programacion_webRuben fuentes programacion_web
Ruben fuentes programacion_web
 
Mi lenguaje de programación de preferencia (JAVA)
Mi lenguaje de programación de preferencia (JAVA)Mi lenguaje de programación de preferencia (JAVA)
Mi lenguaje de programación de preferencia (JAVA)
 
Mi lenguaje de programación de preferencia
Mi lenguaje de programación de preferenciaMi lenguaje de programación de preferencia
Mi lenguaje de programación de preferencia
 

Viewers also liked (8)

Html5 offline
Html5 offlineHtml5 offline
Html5 offline
 
Del Freelancing a la Empresa. La historia de INSIGNIA.
Del Freelancing a la Empresa. La historia de INSIGNIA.Del Freelancing a la Empresa. La historia de INSIGNIA.
Del Freelancing a la Empresa. La historia de INSIGNIA.
 
Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)
Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)
Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)
 
Web basics101
Web basics101Web basics101
Web basics101
 
Spinach
SpinachSpinach
Spinach
 
administrate_me
administrate_meadministrate_me
administrate_me
 
Code Blast 2012 - Ruby on Rails v.2012
Code Blast 2012 - Ruby on Rails v.2012Code Blast 2012 - Ruby on Rails v.2012
Code Blast 2012 - Ruby on Rails v.2012
 
Software Factory 2.0: El Modelo Agil
Software Factory 2.0: El Modelo AgilSoftware Factory 2.0: El Modelo Agil
Software Factory 2.0: El Modelo Agil
 

Similar to Code Blast 2012 - Node.js

TEMA Nº 1: INTRODUCCIÓN A J2EE
TEMA Nº 1: INTRODUCCIÓN A J2EETEMA Nº 1: INTRODUCCIÓN A J2EE
TEMA Nº 1: INTRODUCCIÓN A J2EE
Anyeni Garay
 
Node.js - un poco de informacion.
Node.js - un poco de informacion.Node.js - un poco de informacion.
Node.js - un poco de informacion.
Luis Toscano
 
Desarrollo de Apps con la herramienta Phonegap
Desarrollo de Apps con la herramienta PhonegapDesarrollo de Apps con la herramienta Phonegap
Desarrollo de Apps con la herramienta Phonegap
CongresoWeb
 
COMPLEMENTOS DEL NAVEGADOR
COMPLEMENTOS DEL NAVEGADORCOMPLEMENTOS DEL NAVEGADOR
COMPLEMENTOS DEL NAVEGADOR
JOSELINE
 
ventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticosventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticos
Irving Muñoz
 

Similar to Code Blast 2012 - Node.js (20)

Gwt I - entendiendo gwt
Gwt I - entendiendo gwtGwt I - entendiendo gwt
Gwt I - entendiendo gwt
 
Aprendiendo GWT
Aprendiendo GWTAprendiendo GWT
Aprendiendo GWT
 
Desarrollo de Aplicaciones con Node.js | INTERSYS UNPRG | 2012
Desarrollo de Aplicaciones con Node.js | INTERSYS UNPRG | 2012Desarrollo de Aplicaciones con Node.js | INTERSYS UNPRG | 2012
Desarrollo de Aplicaciones con Node.js | INTERSYS UNPRG | 2012
 
Tutorial Java
Tutorial JavaTutorial Java
Tutorial Java
 
Node JS (Francisco Cerdas)
Node JS (Francisco Cerdas)Node JS (Francisco Cerdas)
Node JS (Francisco Cerdas)
 
El coste de no usar integración continua
El coste de no usar integración continuaEl coste de no usar integración continua
El coste de no usar integración continua
 
GWT: Why GWT, GQuery, and RequestFactory
GWT: Why GWT, GQuery, and RequestFactoryGWT: Why GWT, GQuery, and RequestFactory
GWT: Why GWT, GQuery, and RequestFactory
 
FULLSTACK JS DEV in 2017
FULLSTACK JS DEV in 2017FULLSTACK JS DEV in 2017
FULLSTACK JS DEV in 2017
 
TEMA Nº 1: INTRODUCCIÓN A J2EE
TEMA Nº 1: INTRODUCCIÓN A J2EETEMA Nº 1: INTRODUCCIÓN A J2EE
TEMA Nº 1: INTRODUCCIÓN A J2EE
 
TEMA Nº 1: INTRODUCCIÓN A J2EE
TEMA Nº 1: INTRODUCCIÓN A J2EETEMA Nº 1: INTRODUCCIÓN A J2EE
TEMA Nº 1: INTRODUCCIÓN A J2EE
 
Node.js - un poco de informacion.
Node.js - un poco de informacion.Node.js - un poco de informacion.
Node.js - un poco de informacion.
 
Desarrollo de Apps con la herramienta Phonegap
Desarrollo de Apps con la herramienta PhonegapDesarrollo de Apps con la herramienta Phonegap
Desarrollo de Apps con la herramienta Phonegap
 
Meetup app-moviles
Meetup app-movilesMeetup app-moviles
Meetup app-moviles
 
Cv dennys-jose-marquez-reyes-desarrollador-web
Cv dennys-jose-marquez-reyes-desarrollador-webCv dennys-jose-marquez-reyes-desarrollador-web
Cv dennys-jose-marquez-reyes-desarrollador-web
 
COMPLEMENTOS DEL NAVEGADOR
COMPLEMENTOS DEL NAVEGADORCOMPLEMENTOS DEL NAVEGADOR
COMPLEMENTOS DEL NAVEGADOR
 
Mobile Day - Lecciones de vuelo
Mobile Day - Lecciones de vueloMobile Day - Lecciones de vuelo
Mobile Day - Lecciones de vuelo
 
Charla GDG Madrid: Cordova + AngularJS + Ionic
Charla GDG Madrid: Cordova + AngularJS + IonicCharla GDG Madrid: Cordova + AngularJS + Ionic
Charla GDG Madrid: Cordova + AngularJS + Ionic
 
ventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticosventajas y desventajas de programas informaticos
ventajas y desventajas de programas informaticos
 
Hack x crack_java
Hack x crack_javaHack x crack_java
Hack x crack_java
 
Hack x crack_java
Hack x crack_javaHack x crack_java
Hack x crack_java
 

Recently uploaded

Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
AnnimoUno1
 

Recently uploaded (11)

pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 

Code Blast 2012 - Node.js

  • 1. Un vistazo al futuro NODE.js Semana de la Ingenieria 2012 Universidad Tecnológica Nacional - Facultad Regional Tucumán
  • 2. Todo sobre @jmma Juan Maria Martinez Arce Partner en INSIGNIA     Software Developer con experiencia en: C/C++, Delphi, Genexus, PHP, Ruby, CSS, y Javascript.   Especializado en el desarrollo de aplicaciones de alto tráfico construidas con Ruby on Rails.   Indefinida y perdidamente enamorado de Ruby y todo su glamour.   Cazador furtivo de tecnologías con las que se pueda jugar un rato.
  • 3. Empecemos por el principio... De todas las tecnologías que andan dando vuelta por Internet...   Por qué NODE.js!?
  • 4. Buenas preguntas, merecen respuestas simples Es un tema de gustos No podría ser de otra manera     +1 Javascript tanto server-side como client-side.   +1 Construido sobre V8 (Google).   +1 Es muy rápido.   +1 Tiempo real / Alta concurrencia.   +1 Se puede lograr mucho con poco.  
  • 5. Hasta aquí no me dijiste nada... Falta que me digas que NODE.js es relativo.
  • 7. Fue construido sobre Javascript Runtime de Google (V8).   Utiliza un modelo I/O sin bloqueos guiado por eventos.   Pensado para aplicaciones de consumo intensivo de datos en tiempo real.   Eficiente consumo de memoria bajo sistemas de alta carga.   Gran manejo de concurrencia y balanceo de carga.   Un mix de características que vende.  
  • 8. Es NODE.js la nueva bala de plata? Estoy seguro que aquí algo anda mal...
  • 10. Y, sí... Tenía que tener algo malo... El problema de ser joven Como en toda tecnología novedosa...     :( Muy poca documentación.   :( Comunidad relativamente pequeña.   :( Ambiente de producción poco amistoso.   :( Hay que programar en Javascript.   :( Hay que programar en Javascript.
  • 11. Este es el ejemplo más simple que se puede lograr en NODE.js.   Un server que a cada petición responde: "Hello World". Pensado para aplicaciones de consumo intensivo de datos en tiempo real.   Javascript es un lenguaje extremadamente potente. Fue elegido en la implementación de NODE.js porque su comportamiento en el browser es exactamente el comportamiento que NODE.js busca implementar.   El gran pero: Javascript no es un lenguaje simple ni mucho menos natural. Require mucho tiempo de aprendizaje y paciencia (sobre todo con los errores).
  • 12. Para dimensionar mejor el concepto:   Necesitamos definir la clase Pet Para que simplemente nos salude, diciéndonos su nombre.   Todo ese código, al ejecutarlo, produce esto:             Nuevamente, Javascript no es un lenguaje simple ni mucho menos natural. Require mucho tiempo de aprendizaje y paciencia (sobre todo con los errores).
  • 13. Basta de pálidas! Node.js es una masa, les mostremos por qué!
  • 14. Playtime! caso Práctico
  • 15. Qué queremos hacer... I'm Here! Una app para dejar tu huella en esta charla.   Objetivos:   - Un usuario debería poder hacer check-in dejando su nombre y un mensaje.   - La app debería proveer un dashboard desde donde se listen todos los checkins.   - Actualizar el dashboard en tiempo real a medida que los usuarios hagan checkin.   - Testear el código de la App.
  • 16. Antes de empezar... Qué tenemos disponible Veamos qué tecnologías nos pueden dar una mano   - CoffeeScript. Para no sufrir con Javascript. - Jade. Para simplificar las vistas en HTML. - Redis.io. Para almacenar nuestros checkins. - Express.js. Framework para aplicaciones web. - Socket.io. Para la actualización en real-time. - Foundation. Para que la app quede presentable. - Mocha. Para testear nuestro código. - Node.js. Para hacer funcionar todo lo anterior. - npm.js. Para instalar todo lo anterior. - Mucha Fé. Para que todo funcione correctamente. - Cruzar los dedos. Para que la demo funcione.
  • 17. Bootstraping Instalemos los paquetes básicos que nos hacen falta   - Node.js. http://nodejs.org/ La manera más simple de instalar Node.js es descargar el instalador desde la página. El mismo instalará node. js y npm.   - Express.js. http://expressjs.com/ Se instala de manera muy sencilla con: npm install -g express   - Redis http://redis.io/ La instalación varía mucho entre cada OS. En estos casos, es muy bueno preguntarle a google.
  • 18. Modelo User Necesitamos una clase para abstraer el almacenamiento de la información que manejará nuestra app.   CoffeeScript nos permite escribir código Javascript a través de una sintaxis muy similar a la de Ruby. Mas info: http://coffeescript.org/   Redis. Nos provee de una DB simple (clave, valor) para almacenar la información del modelo y recuperarla. Mas info: http://redis.io/documentation   - Entendiendo el Voodoo. Este modelo necesita generar un key en el que se almacenarán todos los usuarios, identificados por un ID basado en su nombre.  
  • 19. Vistas requeridas Necesitamos un formulario para postear los datos del usuario y un listado de checkins para ser mostrado en el dashboard.   Jade es un template engine que nos permite escribir código HTML a través de un markup muy simple y muy elegante. Mas info: http://jade-lang.com/   Algo muy positivo. La sintaxis de Jade y CoffeeScript son muy similares, esto ayuda mucho al momento de cambiar de contexto entre un código y el otro.
  • 20. Routing Nuestra app necesita manejar 3 URLs. Una para mostrar el formulario, otra para postear estos datos y crear el checkin y una tercera para presentar el dashboard.     Express permite implementar pequeños routers de manera muy sencilla para manejar las URLs que necesitamos.   Los conceptos más complicado de asimilar son: > En Javascript no hay scope mas que el scope de la función. > Cada función que se ejecute de manera asincrónica debe proporcionar un callback.
  • 21. Testing El desarrollo guiado por tests es una práctica a la que deberíamos ajustarnos siempre. Ahorra mucho esfuerzo al momento de realizar bugfixing o pruebas de integración.     Mocha provee un framework para escribir tests que verifiquen código producido en Javascript. Es muy versátil y extremadamente veloz. Mas info: http://visionmedia.github. com/mocha/   Lo más complicado: hacerse camino a través de los errores iniciales (que son poco descriptivos)
  • 22. El Dashboard El core feature de nuestra app consiste en contar con un dashboard que se actualice a medida que los usuarios vayan haciendo check in, en tiempo real en todos los clientes conectados.   Socket.io provee un mecanismo para implementar enlaces en tiempo real entre un server y sus clientes corriendo entre distintos dispositivos. Mas info: http://socket.io/#how-to-use   Lo que hay que entender: la implementación de Socket.io en una app requiere de soporte tanto server-side como client-side.   En el server, es necesario indicar qué evento se debe propagar entre los clientes conectados.   En el cliente, se debe resolver qué hacer una vez que dicho evento ha sido transmitido.  
  • 23. La hora de la verdad... Qué debería pasar..? Si es que Murphy no hace de las suyas.   Hacer checkin. Debería poder el formulario, poner mis datos, hacer submit y mis datos deberían ser listados en el dashboard.   Actualización en Tiempo Real del Dashboard. Por cada checkin que se realice, el dashboard deberá actualizarse automáticamente en cada dispositivo conectado.   A ver qué resultó de todo esto.       Atención: esto podría fallar.
  • 24. Live Demo A jugar con ImHere
  • 25. Y llegamos al final. Qué hacemos ahora? Les tiro un par de ideas...   Consultar dudas. Y sí... Por ahí hablo rápido y digo incoherencias. Mejor quitarse la duda ahora.   Agendan mis datos por cualquier cosa. @jmma juan@insignia4u.com www.insignia4u.com http://github.com/jmax   Nos vamos. No si antes agradecer a la UTN- FRT por el espacio y el esfuerzo para que esta charla salga así de bien.  
  • 26. Y bueh... nos tenemos que ir. Gracias por venir y participar. El código de la demo app se puede descargar en: https://github.com/jmax/imhere Esta presentación estará disponible muy pronto en: http://www.insignia4u-blog.com/ Ningún ser viviente fue lastimado durante la preparación de esta presentación. Cualquier similitud con hechos de la vida real es mera coincidencia.