Si alguna vez ha trabajado con código, ha escuchado la frase «Manténgalo SECO» (» No se repita»). En otras palabras, si tiene que realizar una tarea repetidamente, encuentre una manera de hacerlo de manera más eficiente, lo que generalmente significa menos código.

Cuando comenzamos a desarrollar un nuevo proyecto, a menudo nos encontramos repitiendo las mismas cosas una y otra vez, cosas como optimizar imágenes, reducir código y compilar archivos. En algunos casos, nos repetimos varias veces por minuto. El costo de tiempo de estas tareas se suma rápidamente a medida que hacemos cambios o creamos nuevos archivos.

Eso es terriblemente ineficiente. Sin mencionar que agrega desgaste a nuestros dedos y teclas del teclado. ¡Los corredores de tareas están aquí para ayudar!

¿Qué es un Ejecutor de tareas?

Los corredores de tareas literalmente hacen eso: ejecutan tareas. Los programadores pueden especificar qué tareas quieren que realice un ejecutor de tareas, y este hará todo el trabajo por ellos.

Antes de ejecutar los ejecutores de tareas, si quería compilar Sass, ejecutar Autoprefixer y luego minificar el CSS resultante cada vez que hiciera un cambio, se habría visto obligado a completar cada tarea por separado. Naturalmente, eso sería molesto muy rápido. Sin mencionar que perderías una enorme cantidad de tiempo repitiéndote a ti mismo. No es divertido.

Con un ejecutador de tareas, puede especificar las tareas que desea completar, ejecutarlo una vez y hará todo el trabajo por usted. Ahorre tiempo, ahorre dinero y salve el mundo (¿tal vez?).

Hay un montón de corredores de tareas por ahí: Brunch.js, Gulp.js, Brócoli.js, Pastel.js, y Grunt.js, solo por nombrar algunos Javascript incorporados. Sí, sus nombres suenan como algo que harías durante tu cumpleaños (excepto brócoli, que suena como un cumpleaños triste), ¡pero puedes usarlos todo el año!

Nuestro corredor de tareas elegido es Grunt.js

Nuestro Corredor de tareas de Elección

Hemos elegido usar Grunt.js. Es el corredor de tareas más apoyado y popular del mercado. Funciona leyendo un archivo Grunt que contiene la configuración de la tarea en un objeto Javascript. A continuación, ejecute un comando en su terminal para especificar la tarea que desea ejecutar. Pan comido.

Su archivo Grunt puede ser tan simple o robusto como le gustaría, dependiendo de las tareas que esté ejecutando.

Los archivos Grunt típicos realizan las siguientes tareas:

CSS

  • Compilar Sass en CSS
  • Ejecutar Autoprefixer en el nuevo CSS para capturar cualquier prefijo de proveedor que hayamos perdido
  • Reducir el CSS prefijado
  • Actualizar nuestro banner CSS con nueva información de marca de tiempo

Javascript

  • Compruebe si hay errores en nuestro Javascript
  • Concatenar otros scripts incluidos en un archivo
  • Vuelva a comprobar si hay errores
  • Minificar scripts

Imágenes

  • Optimice cualquier JPG, GIF o PNG para que el tamaño del archivo más pequeño

Otras utilidades

  • Ver archivos para cambios y volver a ejecutar tareas según sea necesario
  • Ejecutar BrowserSync para realizar pruebas en varios navegadores y dispositivos a la vez

Puede imaginar lo doloroso que sería tener que ejecutar estas tareas manualmente. Todo lo que tenemos que hacer es ejecutar un simple comando:

$ grunt

Al igual que la magia, este comando ejecuta todas nuestras tareas y nos salva de repetirnos.

Para más información sobre Grunt.js, echa un vistazo a su documentación y empieza a buscar archivos Grunt.

Deja una respuesta

Tu dirección de correo electrónico no será publicada.