¿Qué es Gulp?

¿Qué es Gulp? Una descripción es que Gulp es un ejecutor de tareas. Otra sería que es un kit de herramientas para automatizar tareas que consumen tiempo.

Como sea que lo llames, hay una característica que sigue siendo verdad: automatización. Vayamos un poco más a fondo...

¿Qué es Gulp?

¿Qué es un Ejecutor de Tareas?

Básicamente, utilizas Gulp para automatizar material que normalmente tendrías que hacer manualmente, como compilar manualmente Sass, optimizar manualmente imágenes, actualizar manualmente tu página en el navegador, y así sucesivamente.

Bueno, éstas tres acciones pueden ser consolidadas en tareas independientes. Luego tomarías esas tareas y pondrías a Gulp a que las ejecute automáticamente. Por eso herramientas como Gulp y Grunt se llaman ejecutores de tareas.

Piping

Una diferencia importante entre Gulp y otros ejecutores de tareas que existen es la manera en que manejan las operaciones de archivos. Gulp esencialmente pasará un flujo de datos de un plugin hasta el siguiente sin escribir ese flujo o stream en un archivo temporal entre éstas tareas. Eso se llama piping o streaming.

Si buscas en la web una definición para piping, probablemente obtendrás algo muy técnico. Asi que voy a tratar de simplificarlo un poco. Un flujo de trabajo de Gulp funciona con diferentes plugins que realizan varias operaciones en ciertos archivos.

Para darte un ejemplo, el plugin Sass tomará un archivo Sass o SCSS y lo compilará a un archivo CSS. El plugin Uglify tomará un archivo JavaScript normal y lo minificará.

Así que el punto con piping es que puedes tomar un conjunto de archivos y ejecutarlos a través de un conjunto de plugins o a través de un plugin. Y obtendrías un diferente tipo de archivo al final, exactamente lo que dije con el plugin Sass. Comienzas con  un archivo SCSS, y finalizas con un archivo CSS.

Flujos de Datos

Normalmente éstos tipos de ejecutores de tareas escribirán archivos temporales en el disco. Bueno, Gulp no hace eso-utiliza flujos de datos.

Así que el contenido de ese archivo es preservado realmente en un buffer-es un flujo de datos básicamente. Y es pasado de un plugin a otro hasta que alcanza su destino final. Y entre éstos plugins, ese flujo experimenta algunos cambios.

Así lo que puedes hacer, por ejemplo, es comenzar con los archivos SCSS y pasarlos al plugin Sass. Ahora, el plugin Sass acepta archivos SCSS y retorna archivos CSS. Así que el flujo de datos que obtienes después del plugin Sass es diferente del que ingresó al plugin.

Y luego puedes hacer más cosas con ello. Quizá los ejecutes por medio de un autoprefixer (agregador de prefijos), ¿no? Así que Gulp tomará ese flujo de datos, y va a ejecutarlo a través del plugin autoprefixer, que acepta un archivo CSS.  Y también retorna ese archivo CSS, pero en el proceso agrega todos los prefijos para navegadores necesarios. Así que también cambia el contenido de ese archivo.

Y finalmente, por ejemplo, puedes minificarlo, o puedes escribirlo en el disco. Así es esencialmente como funciona el piping. Pasas datos al inicio del flujo o stream, y obtienes un tipo diferente de datos al final, y en el proceso tienes éstos puntos que realizan ciertas operaciones en ese flujo de datos.

Observa el Curso Completo

Espero que ahora tengas una comprensión básica de lo que es Gulp. Para tener una idea más clara, podrías tomar el curso completo. La Guía del Diseñador Web para Gulp, en la que explicamos cómo funciona Gulp en mayor detalle.

Puedes tomar éste curso inmediatamente con una suscripción a Envato Elements. Por una sola cuota mensual, obtienes acceso no únicamente a éste curso, sino también a nuestra creciente biblioteca de más de 1,000 cursos en video y a libros electrónicos que son referencia en la industria en Envato Tuts+.

Además ahora obtienes descargas ilimitadas de la enorme librería de 440,000 recursos creativos de Envato Elements. Crea con fuentes, fotos, gráficos y plantillas originales, y entrega mejores proyectos más rápido.