paginas web barcelona

Centro Web Barcelona

Soluciones en Internet

GULP y GRUNT



blog centro web barcelonaGulp es un automatizador de tareas en codigo Javascrit y que corre bajo Node.js, Con Gulp se incrementa la rapidez de ejectuat tareas y se facilita el trabajo de progrmaación.

Para trabajar con Gup, debes subir al directorio raíz del proyecto un fichero de configuración Gulpfile.js y tener instalada Node.js

Gulp concatena todos los archivos JS en un solo denominado vendor.min.js, por ejemplo. Gulp nos permite realizar muchos trabajos, por ejemplo, optimizar imagenes, recarga del navegaror, validación de sintaxis,etc.

Gulp se basa en código Javascript y es Open Source. Gulp.js no necesita escribir archivos y/o carpetas temporales en el disco duro, lo cual supone que realizará las mismas tareas que Grunt pero en menor tiempo.

Gulp.js también tiene sus propios plugins (1800 de ellos oficiales). Existen plugins muy facilidadesd e usar y para muchas funcionalidades

Para trabajar con Grunt, necesitamos tener instaladas 3 cosas:

  1. Node.js , un sistema para poder ejecutar Javascript fuera del navegador.
  2. npm (Node Packaged Modules) para manejar dependencias en Node.js Desde la versión 0.6.3 npm viene integrado en el proceso de instalación de Node.js, así que no tienes que instalarlo por separado. *Gracias a mi tocayo @FelixOrtegaM
  3. El propio Grunt primero de forma global y luego como módulo dentro de cada proyecto.

La instalación de Node.js es muy sencilla tan solo hay que visitar la web (Nodejs) y descargar la aplicación dependiendo de tu sistema operativo.

Las tareas en Grunt siguen siempre un mismo patrón:

1) Instalar el plugin desde la consola

2) Cargar la tarea en el archivo Gruntfile.js

3) Configurar la tarea también desde Gruntfile.js

Cualquiera que haya desarrollado algo medianamente complejo (tampoco mucho) usando Javascript conocerá herramientas de “compilación” como grunt con las cuales podemos automatizar procesos como la validación de sintaxis, la concatenación de ficheros, la minificación, la ejecución de tests, etc.

A principios del 2014, una alternativa a grunt empezó a tomar peso dentro de la comunidad de Javascript, donde como todos sabéis, si algo tiene más de 24 horas ya está obsoleto y es necesario reemplazarlo inmediatamente. Esa alternativa es gulp, un sistema de compilación basado en streams maravilloso y que nos permite hacer cosas nunca vistas.

En Gulp ñps archivos son convertidos en streams que se procesan en memoria y se almacenan en el disco al final del proceso sin generarse archivos intermedios y procesandose con otras herramientas. Eso implica una simplificación de las arquitectura de los plugin.

Otra característica de Gulp es el uso de código frente a la configuración. En Grunt se utiliza la configuracióna través del método grunt.initConfig para declarar lo que hará cada plugin.

Gulp utiliza un sistema de orquestación de tareas basado en dependencias- Indicando en cada tarea de que otras tareas depende, típica de la mayoría de sistemas de compilación.

¿Grunt o Gulp?

Grunt es mas popular que Gulp pero este último está recortando la distancia rápidamente. Aparte del gusto de cada uno y la costumbre de uso, hay tareas mas fáciles de definir con código y otras más fácil con configuración. Grunt es un poco mas flexible pues puede manjearse de las dos maneras.

Los scripcs de Gulp son muy cómodos paramanejar el proceso de información a través de pipes