BBVA API Market
JavaScript tiene una particularidad que le diferencia de gran parte del resto de lenguajes: un programador con conocimientos avanzados en esta sintaxis puede intervenir en toda la pila del desarrollo. Es lo que la comunidad de desarrolladores llama el cuarteto full-stack MEAN, en referencia a MongoDB (sistema de base de datos), Express (marco de desarrollo por el lado del back-end), AngularJS (marco por el lado del cliente) y Node.js (entorno de desarrollo por la capa del servidor). EmberJS es una alternativa a AngularJS.
EmberJS es un framework bajo el patrón MVC (Modelo-Vista-Controlador) para JavaScript. Con él se pueden desarrollar aplicaciones por el lado del cliente, apoyado en varias bibliotecas JavaScript como jQuery, una librería muy conocida en el mundo del desarrollo, o Handlebars, una alternativa a jQuery que crea plantillas HTML con datos en objetos en formato JSON.
¿Por qué es tan interesante utilizar un framework Modelo-Vista-Controlador para el diseño de aplicaciones? Porque será el marco de desarrollo quien se ocupe de sincronizar en cada momento los cambios en el documento HTML con el DOM, gracias a la información contenida en las variables de la Vista. Esto es posible por una razón sencilla: el patrón MVC separa las aplicaciones en componentes distintos de presentación, datos y lógica.
Características de EmberJS
EmberJS dispone de algunas características que pueden resultar una gran ventaja para un desarrollador de aplicaciones web. Algunas de ellas:
– EmberJS es un framework preparado para programar de forma sencilla y elegante, lo que sus creadores definen como The Ember Way. Esto permite que se puedan hacer grandes desarrollos con pocas líneas de código, siempre y cuando nos adaptemos a las limitaciones del marco.
– EmberJS es un marco de desarrollo que se basa en el paradigma de programación de software Convención sobre Configuración (CoC), que disminuye el número de decisiones que debe tomar el desarrollador gracias a que el framework las adopta de forma automática. Con ello se gana en simplicidad, pero se pierde en flexibilidad. El programador solo tiene que especificar los aspectos no convencionales del código de una aplicación porque EmberJS genera todo lo demás.
– El Router de EmberJS simplifica mucho el trabajo con su sistema de rutas anidadas: plantillas que comparten Router, Controlador y Vista y que replican desde la memoria el comportamiento por defecto asociado a esa ruta. Eso ahorra mucho esfuerzo y tiempo y todo es más sencillo.
– Binding de datos entre componentes. Automatiza la sincronización de los cambios en los datos, como hemos explicado anteriormente.
– Plantillas dinámicas gracias a Hadlebars.js.
– Inyección de dependencias entre controladores.
– La comunidad de desarrolladores que mantiene EmberJS es pequeña pero muy cualificada, algunos están detrás también de proyectos como el marco de desarrollo Ruby on Rails o la librería jQuery.
– Más sencillo de usar que BackboneJS, otra alternativa a AngulaJS.
Conceptos del núcleo de EmberJS
Lo lógico antes de comenzar a usar EmberJS es saber cuáles son los conceptos que afectan al uso de este marco para la creación de aplicaciones web:
– Plantillas: una plantilla, escrita con Handlebars, describe la interfaz de usuario de la aplicación. Cada plantilla está respaldada por un Modelo, y si el desarrollador actualiza ese Modelo, la plantilla se modifica de forma automática. El HTML plano de cada una de esas plantillas contiene:
– Expresiones: comandos que activan funcionalidades, por ejemplo, para definir vistas parciales e incorporarlas a otras plantillas, procesos de renderización de vistas y plantillas…
– Outlets: marcadores que conectan unas plantillas con otras.
– Componentes: elementos HTML personalizados que se usan para limpiar las plantillas repetitivas o crear controles reutilizables.
– Router: se encarga de definir rutas anidadas, cada una de ellas respaldada por un modelo de datos. Las plantillas y los modelos cambian con la navegación del usuario, pero el comportamiento por defecto asociado a esas rutas anidadas se mantiene inalterado.
App.Router.map(function() {
this.resource('post', { path: '/post/:post_id' }, function() {
this.route('edit');
this.resource('comments', function() {
this.route('new');
});
});
});
En este ejemplo, el Router crea las siguientes rutas anidadas:
– Componentes: son elementos HTML personalizados, implementados con lenguaje JavaScript y con las plantillas como interfaz gráfica.
– Modelos: un modelo es un objeto que almacena datos de forma persistente a lo largo del tiempo. Las plantillas son las responsables de mostrar cada uno de esos Modelos al usuario al convertirlos en HTML. Ember dispone de una capa de persistencia de datos llamada Ember Data, que ha sufrido alteraciones constantes durante el tiempo y de la que no se dispone de mucha documentación fiable en este momento.
– Ruta: son los objetos responsables de decirle a la plantilla qué modelo de datos debe usar y mostrar a cada usuario.
– Controlador: facilita, al igual que el modelo, propiedades a la plantilla.
Primeros pasos para empezar a programar
Estos serían los pasos a seguir si se quiere empezar a trabajar con EmberJS para el desarrollo de una aplicación web. Es algo relativamente sencillo:
– Descargar las dependencias de EmberJS: es necesario para programar una aplicación en EmberJS disponer primero de las librerías JavaScript jQuery y Handlebars. La primera se descarga aquí y la segunda, aquí.
– El segundo paso sería la instalación de Node.js.
– Luego es necesario configurar Ember CLI (la interfaz de línea de comandos de este marco de desarrollo). Ember CLI es el estándar de desarrollo de aplicaciones web en EmberJS. Su instalación se realiza mediante el comando npm install -g ember-cli.
– El cuarto es la instalación de Bower, un gestor de dependencias para front-end que mantiene actualizadas todas las librerías para el proyecto. Es necesario utilizar el comando npm install -g bower.
– Es conveniente la configuración de un sistema de automatización de pruebas. Una opción con EmberJS es la instalación de PhantomJS. Para la instalación se debe utilizar el comando npm install -g phantomjs.
– Una vez que tenemos instalada la interfaz de línea de comandos de EmberJS y todas sus dependencias, se puede empezar a crear el proyecto nuevo. Primero se utiliza el comando cd para elegir carpeta dentro del directorio del proyecto y luego se crear la aplicación nueva con el comando ember new nombre-aplicacion. ‘nombre aplicacion’ será el nombre literal que tendrá la aplicación creada en EmberJS.
La CLI tiene características interesante para cualquier desarrollador:
– Estructura el directorio de archivos del proyecto.
– Es capaz de compilar y comprimir esos documentos.
– Genera patrones comunes.
– Permite la incorporación sencilla de funcionalidades añadidas al marco de desarrollo. La comunidad de Ember desarrolla plugins y el resto los puede incorporar al framework. Se pueden buscar estos addons en varias páginas como Ember Observer o Ember Addons.
Síguenos en @BBVAAPIMarket
Llevar a un cliente por todo el proceso de compra hasta que este se formaliza es un viaje arduo y que se enfrenta a la posibilidad constante de abandono. Sin embargo, hay formas de lograr que la decisión de compra se haga realidad si se le dan facilidades como una financiación ágil, segura y adaptada a lo que necesita.
En un mundo conectado, las APIs son el pegamento que une todas las piezas que forman nuestra vida diaria. Y de la misma forma que un pegamento solo es potente si sabemos en qué material utilizarlo y conocemos sus propiedades, las APIs son tan útiles como su documentación permita.
Existen diferentes soluciones para monitorizar el rendimiento de una API, tanto en términos de tráfico como de calidad y rapidez de las respuestas que proporciona. Detectar fallos en el código o cuantificar los ingresos que genera también son algunas de las opciones que ofrecen estas útiles herramientas.
