Ruby on Rails y AngularJS

818
-1

Published on

Charla presentada para la Universidad Cenfotec, en el Colegio de Informáticos de Costa Rica. Marzo, 2014. La charla presenta una introducción a Ruby on Rails y cómo integrarlo con AngularJS

Published in: Software
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
818
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
21
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Ruby on Rails y AngularJS

  1. 1. Ruby on Rails y AngularJS Introducción al mundo de Ruby on Rails, AngularJS y el rol de ambos en la construcción de modernas aplicaciones Web Ing. Leopoldo Rojas Moguel, MBA leopoldo.rojas@arckanto.com @leopoldo_rojas
  2. 2. @leopoldo_rojas Software engineer & Web Developer. Ruby on Rails, AngularJS and Yii specialist. Innovation consultant. Family man & Sports fan
  3. 3. RUBY ON RAILS “[Rails] gained a lot of its focus and appeal because I didn’t try to please people who didn’t share my problems” … DHH
  4. 4. ¿Qué es Ruby on Rails? Es un framework open source para el desarrollo de aplicaciones Web
  5. 5. Ruby on Rails (aka Rails) • Está basado en el lenguaje orientado a objetos Ruby • Ruby fue creado en 1995 por Yukihiro Matsumoto (aka Matz) tomando ideas de PERL, Smalltalk y LISP • Rails fue liberado en el 2004 por David Heinemeier Hansson (aka DHH) • Ruby es a PHP, como Rails es a Yii ó CakePHP • Algunas aplicaciones conocidas: Shopify, Scribd, Twitter, Hulu, Zendesk
  6. 6. The “Rails way” • Rails es lo que se conoce como un “opinionated framework” • Privilegia los siguiente Patrones de Ingeniería de Software: • Active Record • Convention over Configuration • DRY: Don´t repeat yourself • MVC: Model-View-Controller • De los primeros frameworks de desarrollo Web en adoptar de manera completa el estilo arquitectural REST para aplicaciones Web
  7. 7. RUBY ON RAILS Aplicación Demo
  8. 8. ANGULARJS HTML enhanced for web apps!
  9. 9. ¿Qué es AngularJS? Es un framework de javascript para crear aplicaciones web dinámicas, el cual utiliza el HTML como mecanismo de lenguaje de template de las aplicaciones y permite extender el lenguaje base de HTML para representar los distintos componentes de la aplicación. “Es lo que el HTML hubiera sido, si hubiera sido diseñado para crear aplicaciones web” AngularJS Team
  10. 10. ANGULARJS Algunos Demos
  11. 11. ¿Qué es entonces AngularJS? • Un framework de javascript • Es tecnología server-agnostic ya que todo lo ejecuta del lado del browser • Intenta definir el comportamiento de la aplicación mediante nuevas “construcciones” (llamadas “directivas”) dentro del HTML mismo • Define lineamientos claros de cómo estructurar una aplicación web (client-side) • Orientado a aplicaciones web CRUD
  12. 12. La filosofía base de AngularJS • Desacoplar la manipulación del DOM de la lógica de la aplicación (Presentation vs Business Logic) • Desacoplar la lógica de la aplicación del lado del cliente, de la lógica de la aplicación del lado del servidor • El framework debe guiar a los Developers en cómo ir estructurando los diferentes componentes de una aplicación client-side • Le otorga mucha importancia a las pruebas (TDD y Testing- ready)
  13. 13. ¿Para qué NO es AngularJS? • No es una tecnología de aplicaciones Web del lado del servidor, sino que debe complementarse con una de ellas • No es óptima para aplicaciones con alta manipulación del DOM del browser, tales como los juegos o los editores de textos
  14. 14. Single-page Apps (SPAs) • Una aplicación web que está conformada por una sola página HTML • La aplicación se carga en una sola llamada al server • No es necesario refrescar la página para ir utilizando la aplicación • No se transfiere el control a ninguna otra página • Provee una experiencia similar a las aplicaciones desktop-only
  15. 15. 2-way Data Binding
  16. 16. Model-View-Controller (MVC) AngularJS
  17. 17. RAILS Y ANGULARJS La integración importa: “…el DC-3 integró cinco tecnologías de componentes, todas decisivas para formar un conjunto de éxito” … de la Quinta Disciplina por Peter Senge
  18. 18. SPA vs Aplicación Web tradicional
  19. 19. RAILS Y ANGULARJS BackEnd y FrontEnd trabajando juntos …
  20. 20. AngularJS y una RESTful API Servicio $http • Si el API no es completamente RESTful • Otorga más flexibilidad pero quizá se deba escribir más código Servicio $resource • Mejor con RESTful APIs • Viene con el módulo ngResource • Métodos de más alto nivel de abstracción
  21. 21. Y AÚN HAY MÁS Un “Bonus” por favor
  22. 22. 3-way Data Binding
  23. 23. ANGULARJS Y FIREBASE Demo de 3-way Data Binding
  24. 24. ¡MUCHAS GRACIAS! «...concentración y simplicidad. Lo simple puede ser más difícil que lo complejo. Tienes que trabajar duro manteniendo tu mente clara para hacer las cosas simples. Vale la pena llegar hasta el final con esto, porque cuando terminas puedes mover montañas» … Steve Jobs Ing. Leopoldo Rojas Moguel, MBA leopoldo.rojas@arckanto.com @leopoldo_rojas

×