Programación Reactiva, Javascript Isomorfo y Meteorjs !
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Programación Reactiva, Javascript Isomorfo y Meteorjs !

on

  • 613 views

Programación Reactiva, Javascript Isomorfo y Meteorjs !

Programación Reactiva, Javascript Isomorfo y Meteorjs !
Reactive Programming, DerbyJs, Mojito, TogetherJs, MeteorJs, Useful Links Modulus.io etc!!

Statistics

Views

Total Views
613
Views on SlideShare
609
Embed Views
4

Actions

Likes
2
Downloads
9
Comments
0

1 Embed 4

https://twitter.com 4

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Programación Reactiva, Javascript Isomorfo y Meteorjs ! Presentation Transcript

  • 1. Programación Reactiva www.grandpa.im
  • 2. ¿Qué es? “La programación reactiva es un paradigma de programación orientado a flujos de datos y la propagación de cambios” (Wikipedia) Manifiesto de Programación Reactiva: http://www.reactivemanifesto.org/
  • 3. Javascript Isomorfo Antes: Desde los labores de la Web, la navegación la experiencia ha trabajado de esta manera: Un navegador web pediría una página en particular (por ejemplo, “ http://www.geocities.com/ ") -Causando un servidor en algún lugar en la Internet para generar una página HTML y enviarlo de vuelta. Esto ha funcionado bien porque los navegadores no eran muy poderosos y las páginas HTML representaban documentos que eran en su mayoría estáticos y autónomos. JavaScript, fue creada para permitir que las páginas web fuerán más dinámicas, no permitía mucho más que presentaciones de imágenes y la era del diseño Jquery y efectos prettys.
  • 4. Javascript Isomorfo Traducción parcial del Post http://nerds.airbnb.com/isomorphic-javascript-future-web-apps/ por Spike Brehm Después de años de avances en la computación personal, tecnólogos creativos han llevado a la web a sus límites , y los navegadores web han evolucionado para mantenerse al día. Ahora, la Web se ha convertido en una plataforma de aplicaciones con todas las funciones, y tiempos de ejecución de JavaScript rápida y estándares HTML5 ha permitido a los desarrolladores crear aplicaciones ricas en las que antes sólo eran posibles en las plataformas nativas. ¿Aplicaciones ricas en el navegador?
  • 5. ¿Aplicaciones en el navegador?
  • 6. Luego llegaron las Apps Single Page No pasó mucho tiempo antes de que los desarrolladores comenzaron a construir aplicaciones enteras en el navegador usando JavaScript, aprovechando estas nuevas capacidades. Aplicaciones como Gmail, el clásico ejemplo de la aplicación de una sola página, pueden responder inmediatamente a las interacciones del usuario, ya no tener que hacer una ida y vuelta al servidor acaba de hacer una nueva página. Las bibliotecas como Backbone . js, Ember.js y Angular.js se conocen como cliente MVC (Modelo- Vista-Controlador) o MVVM (Modelo-Vista-ViewModel) bibliotecas a menudo. La arquitectura MVC del lado del cliente típico es como la siguiente:
  • 7. Problemas en el paraíso En la práctica, sin embargo, hay algunos defectos fatales con este enfoque que le impiden ser adecuado para muchos casos de uso. SEO Una aplicación que sólo se puede ejecutar en el lado del cliente no puede servir de HTML para los rastreadores, por lo que tienen mala SEO by default. Web crawlers función haciendo una petición a un servidor web y la interpretación de los resultados, pero si el servidor devuelve una página en blanco, no es de mucho valor. Hay soluciones, pero no sin saltar a través de algunos aros.
  • 8. Rendimiento Por la misma razón, si el servidor no hace que una página de HTML, sino que espera a JavaScript del lado del cliente para hacerlo, los usuarios experimentarán unos segundos críticos de la página en blanco o spinner carga antes de ver el contenido de la página. Hay muchos estudios que muestran el efecto drástico un sitio lento tiene en los usuarios, y por lo tanto los ingresos. Amazon afirma que cada reducción de http://venturebeat.com/2013/11/08/the-future-of-web- apps-is-ready-isomorphic-javascript/00 ms en el tiempo de carga de página obtiene ingresos por el uno por ciento. Twitter pasó un año y 40 ingenieros de la reconstrucción de su sitio para hacer en el servidor en lugar del cliente, reclamando una mejora de 5 veces en el tiempo de carga percibida.
  • 9. Mientras que el caso ideal puede conducir a una bonita y clara separación de las preocupaciones, inevitablemente, algunos trozos de lógica de la aplicación o la vista lógica terminan duplicado entre el cliente y el servidor, a menudo en diferentes idiomas. Los ejemplos más comunes son la fecha y el formato de moneda, validaciones de formulario y la lógica de enrutamiento. . Esto hace que el mantenimiento sea una pesadilla, especialmente para las aplicaciones más complejas. Algunos desarrolladores, incluido yo mismo, nos sentimos mordidos por este enfoque que es a menudo sólo después de haber invertido tiempo y esfuerzo para construir una aplicación de una sola página que empezamos a encontrar sus inconvenientes. Mantenibilidad
  • 10. ¡Una buena solución!
  • 11. A medida que más organizaciones se sienten cómodos con Node.js para correr en producción, es inevitable que cada vez más aplicaciones web empezarán a compartir código entre su cliente y el código del servidor. Es importante recordar que JavaScript isomorfo es un espectro - puede comenzar con sólo compartir las plantillas, el progreso va desde la capa vista completa de la aplicación, hasta el final llegando a la mayoría de la lógica de negocio de la aplicación. Exactamente qué y cómo el código JavaScript se comparte entre el entorno depende por completo de la aplicación que se está construyendo y su conjunto único de restricciones. La vista desde aquí
  • 12. En Airbnb, se empezo a rediseñar todo el cliente en proceso de construcción de usar Node.js herramientas basadas en como Gruntjs y Browserify. Nuestra aplicación principal Rails puede nunca ser totalmente sustituida por una aplicación de Node.js, pero al adoptar estas herramientas se hace cada vez más fácil de compartir ciertos trozos de JavaScript y plantillas entre entornos Lo escuchaste aquí primero -. Dentro unos años, será raro ver una aplicación web avanzada que no ejecuta algo de JavaScript en el servidor. La vista desde aquí
  • 13. Resumen Sincroniza automáticamente los datos entre navegadores, servidores y bases de datos. El más “mágico” de todos, un simple script y wua la!! Toda una API para realtime Extensa API con módulos para ejecutar código Buen founding, excelente equipo de desarrollo y grandiosa comunidad.
  • 14. Mojito Mojito es un framework para el desarrollo de aplicaciones web usando JavaScript o HTML5 que Yahoo! ha decidido liberar con la idea de crear una comunidad de desarrolladores alrededor de este framework para que, gracias a su adopción, el proyecto crezca y se termine convirtiendo en un estándar. Gracias a Mojito, los desarrolladores podrán trabajar a alto nivel y abstraerse de la plataforma destino, evitando la necesidad de conocer la programación en Android, iOS o BlackBerry y obteniendo una versión de la aplicación para cada una de las plataformas destino. De hecho, una de las ventajas de usar este framework es que éste está optimizado para generar aplicaciones muy optimizadas para trabajar en movilidad, es decir, para superar las adversidades del uso de conexiones de datos móviles (cortes, caída del nivel de señal, etc) gracias a la flexibilidad de realizar la ejecución de los procesos tanto desde el lado del servidor como el del cliente. http://developer.yahoo.com/cocktails/mojito/ Official Page
  • 15. Derby incluye un potente motor de sincronización de datos llamada Racer. A pesar de que funciona de forma diferente , Racer es en Derby algo así como ActiveRecord es a Rails. Racer sincroniza automáticamente los datos entre navegadores , servidores y bases de datos. Suscribciones a modelos y a los cambios en los objetos y consultas específicas , lo que permite un control granular de la propagación de datos sin definir canales. Racer es compatible con la resolución de conflictos “Out of the box”, lo que simplifica enormemente la creación de aplicaciones multi-usuario. Muy bueno para hacer aplicaciones REST, Derby está basado en Express.js el cual tiene un excelente soporte para aplicaciones REST y si estas buscando un framework para una aplicación REST y NO html mejor usar librerías como Express.js y no Derby, de igual forma si no estás pensando en apps con funcionalidades “multiusuario” o “realtime” es mejor no usar Derby. Ejemplos con Derby: http://todos.derbyjs.com/derby → Todos http://chat.derbyjs.com/lobby → chat Derbyjs
  • 16. MeteorJS Nuestro Equipo comenzó con MeteorJS
  • 17. ¿Qué es MeteorJS? Meteor es una plataforma para crear aplicaciones web en tiempo real construida sobre Node.js. Meteor se localiza entre la base de datos de la aplicación y su interfaz de usuario y se asegura de que ambas partes estén sincronizadas. Como Meteor usa Node.js, se utiliza JavaScript en el cliente y en el servidor. Y más aún, Meteor es capaz de compartir código entre ambos entornos. hot code pushes baby!, gracias al canal que dejamos abierto cada vez que se actualiza el código cliente en el servidor este lo sirve directamente a los clientes que estén conectados. ¿No es maravilloso? olvídate de esas eternas tensas esperas a que se limpien las caches de los servidores para ver el efecto de tu pase a producción, tu éxito o tu fracaso sin esperas.
  • 18. ¿Por qué gastar tiempo aprendiendo Meteor en lugar de otro framework web? Dejando a un lado las características de Meteor, creemos que todo se reduce a una sola cosa: Meteor es fácil de aprender. Meteor permite crear una aplicación web en tiempo real en cuestión de horas. Y si ya hemos hecho desarrollo web, estaremos familiarizados con JavaScript, y ni siquiera tendremos que aprender un nuevo lenguaje. Meteor podría ser el marco ideal para nuestras necesidades, quizás no. Pero ¿por qué no probarlo y descubrirlo por nosotros mismos?. ¿Porque Meteorjs?
  • 19. Llegando un tantico lejos...
  • 20. Llegando un tantico lejos... - Si hay seguridad de los datos - Es posible tener upload de archivos reactivo, roles y control sobre el “Hot code” - Gran comunidad...Fast-render, Iron-router, Atmosphere, Roles… - Una app controlada en producción, sin miedo a seguir desarrollando sobre ella - No es magia sino al principio, buena curva de aprendizaje y enfoque sobre todo en la seguridad de la información (Publicaciones, suscripciones y métodos) - Muchos retos en el camino, pero siempre con una comunidad dispuesta a aportar en el proceso - Facil deploy en desarrollo y gratis!!, múltiples opciones para deploys en producción.
  • 21. -http://nerds.airbnb.com/isomorphic-javascript-future-web-apps/ → Javascript Isomorfo https://www.meteor.com/ → Oficial Page Meteorjs http://es.discovermeteor.com/ → El mejor recurso actual para aprender Meteorjs en Español Porque Fibers en Meteorjs? -http://meteorhacks.com/fibers-eventloop-and-meteor.html -https://modulus.io/ → Excelente Cloud para aplicaciones Nodejs y Meteorjs, Incribete y recibe 15 dolares para probarla! Links recomendados
  • 22. - http://www.goodui.org/ → Una de las mejores guías de Ux, simple y al grano. - https://www.smartfile.com/ → Un CDN que utilizamos, es excelente :D. - http://meteorhacks.com/pro-meteor/ → Production Users' Guide To Meteor - https://atmospherejs.com/ → Sistema de paquetes de MeteorJs(Yo compartí el de gráficas “nvd3js” y mi hermano el de validaciones en el servidor “Nice”) Hay excelentes paquetes!! - http://nvd3.org/ → Reusable charts for D3, lo utilizamos bastante, no tiene muchas gráficas y opciones pero esta bueno. - https://university.mongodb.com/ → Para los que quieran aprender Mongodb :D! Y bueno, posteen más, queremos que la comunidad siga creciendo, muchas gracias! Otros links(Ux, Dbs,...whatever)
  • 23. Muchas gracias Equipo Grandpa Luis Álvarez @goluis Julián Alvarez @ouyeahbro www.grandpa.im