Nuevas herramientas en el desarrollo cross-platform

Tras el boom de Javascript y la aparición de Node, han surgido innumerables herramientas que se han vuelto imprescindibles para cualquier desarrollo con esta tecnología: Grunt, Gulp, Jshint, Jslint, Uglify, Npm, Jasmine , Karma, Bower, Yeoman, etc. Cualquier proyecto actual cross-platform usa varias de estas herramientas o frameworks. Realmente es imposible estar al día de todas y cada una de las herramientas que aparecen, pero sí hay algunas que han destacado notablemente y que intentaremos, al menos clasificar, para esclarecer que es realmente todo este conjunto de «palabros» ¡Vamos a por ello!

Npm

Npm es el gestor de paquetes de Node. A través de él podemos instalar tanto globalmente en nuestro sistema (npm install -g herramienta) como en un proyecto en concreto (npm install herramienta) las diferentes herramientas que nos harán falta durante nuestro desarrollo en cross-platform. Si usamos:  npm install –save-dev grunt se añadirá la herramienta a nuestra lista de dependencias (package.json)

Bower

Es otro gestor de paquetes pero enfocado al frontend de nuestra aplicación y está optimizado para esto. Podríamos decir que Bower es al navegador lo que Npm al servidor. Se instala a través de npm: npm install -g bower Y se usa exactamente del mismo modo bower install –save jquery Antes de continuar ¿Se pueden usar ambos conjuntamente? ¡Por supuesto! Lo normal es que con Npm se gestionen herramientas propias del desarrollo, mientras que con Bower gestionemos las librerías de las que va a hacer uso nuestra aplicación. Lo bueno de estos gestores es que haciendo uso del archivo package.json (en el caso de Npm) y bower.json (en el caso de Bower), no tenemos que mantener todas las librerías al trabajar con sistemas de control de versiones. Bastará con que estén estos archivos y haciendo uso de Npm install y Bower install, podremos descargar todas las librerías desde sus repositorios oficiales.

Grunt

Es un gestor de tareas. Su objetivo es, básicamente, automatizar tareas tales como compilación de nuestros archivos sass /less a css, compresión de ficheros, procesos de testeo para nuestra app, etc. A fin de cuentas, cualquier tipo de tarea que tengamos que realizar con cierta asiduidad para ahorrarnos tiempo. Grunt se basará en módulos propios que están gestionados por Npm. Los módulos de Grunt suelen tener el prefijo grunt- y en caso de que sean oficiales grunt-contrib-: npm install –save-dev grunt-contrib-uglify Las tareas de Grunt se definen en el archivo Gruntfile.js y lo que se define en él es la configuración de los módulos de Grunt que hemos instalado. Podéis ampliar esta información aquí.

Gulp

Su objetivo es exactamente el mismo que el de Grunt, es decir, automatizar tareas. Gulp se basa en una cadena de tareas y es, bajo mi punto de vista, bastante más intuitivo que Grunt. Para instalarlo: npm install –save-dev gulp Gulp también utiliza módulos de Npm con el prefijo gulp- y, en este caso, se configura a través del archivo gulpfile.js. La principal diferencia es que Gulp hace uso de streams (sí, como en Unix) y Nodejs incorpora un módulo para streams llamado pipe(). Además, con Gulp tendremos que ir concatenando tareas a través del método pipe. A parte de éstas, hay muchas más herramientas que nos pueden ser de gran utilidad. Ni que decir tiene que el hecho de configurarlas todas, incluso antes de comenzar con nuestro desarrollo, puede ser bastante engorroso, si bien a largo plazo sea beneficioso. Pero todo esto puede simplificarse, y de qué manera, con Yeoman.

Yeoman

El objetivo de Yeoman es aligerar el proceso de implantación de herramientas y librerías al comienzo de nuestro desarrollo cross-platform. Hace uso de Bower para manejar dependencias, de Grunt para realizar pruebas y construir la aplicación, y una herramienta propia llamada «Yo» para construir el esqueleto de la aplicación. Yeoman se basa en generadores que podemos encontrar en su web oficial. Hay muchos de ellos muy completos, y que, solamente respondiendo sencillas preguntas desde nuestra consola, acabaremos teniendo toda la estructura de nuestro proyecto lista para empezar a desarrollar e incluso tareas automatizadas(grunt o gulp según el generador que elijamos) ya preparadas para dicha estructura. npm install -g yo bower grunt-cli gulp npm install -g generator-webapp yo webapp Dejamos atrás muchísimas herramientas, pero estas son principalmente, las que se están llevando la palma a la hora de desarrollar una aplicación cross-platform. ¿Os animáis? Autor del post: Miguel Sánchez]]>