Get your team started on a custom learning journey today!
Our Boulder, CO-based learning experts are ready to help!
Get your team started on a custom learning journey today!
Our Boulder, CO-based learning experts are ready to help!
Follow us on LinkedIn for our latest data and tips!
There are a lot of tasks involved with creating and deploying a front-end application. Common tasks include things like watching file changes, concatenating/minifying files, prefixing files for different browsers, and linting Javascript. Before task runners like Gulp and Grunt existed, these tasks were often done using shell or bash scripts on the command line.
Javascript, for example, can be minified in many ways using the command line. Let’s explore one way I found in a post called Minify JS from the command line. The steps involve installing Java (or checking the version already installed), installing Google’s Closure Compiler, and then running a script on the command line to minify a JS file:
$ which java $ chmod o+r closure-compiler.jar $ minifyjs [file].js
For a simple one off task, this is a very easy way to do this (there are many other similar scripts for other tasks). Just about everything that you could do with a dedicated task runner like Gulp or Grunt, you could do with a simple bash script, shell script, or npm package/command.
But it can quickly get a lot more complicated when you need to concatenate multiple files, run multiple tasks in order (with outputs from one becoming inputs on another). Furthermore, using bash or shell requires developers to switch between languages. Using a Javascript task runner like Gulp allows you to code and run your build tasks in the same language (Javascript).
To minify (aka uglify) Javascript in Gulp, the command setup would generally look something more like this:
First install the gulp-uglify package using npm:
$ npm install --save-dev gulp-uglify
Then setup the following command in your gulpfile:
var gulp = require('gulp'); var uglify = require('gulp-uglify'); gulp.task('uglify', function() { return gulp.src('lib/*.js') .pipe(uglify()) .pipe(gulp.dest('dist')); });
Then run gulp uglify from the command line.
This uglify command will minify the Javascript files from the paths you specify and put them in the destination folder (‘dist’ in this case). You might have to write a few more lines than the commands in the first example but there are many advantages with the Gulp approach. You can more easily specify which files you want to work with and the output destination. The task is written in Javascript and you can easily batch this command with another (say for concatenating). The gulp-uglify plugin has other options you could use to determine how comments are treated, whether to mangle the variable/function names, and if you wish to compress the files.
Build tasks can be done in many ways. Using a dedicated task runner like Gulp allows for running build tasks using Javascript, easier organization, easier readability, and easier combining/batching of tasks.
Customized Technical Learning Solutions to Help Attract and Retain Talented Developers
Let DI help you design solutions to onboard, upskill or reskill your software development organization. Fully customized. 100% guaranteed.
DevelopIntelligence leads technical and software development learning programs for Fortune 500 companies. We provide learning solutions for hundreds of thousands of engineers for over 250 global brands.
“I appreciated the instructor’s technique of writing live code examples rather than using fixed slide decks to present the material.”
VMwareDevelopIntelligence has been in the technical/software development learning and training industry for nearly 20 years. We’ve provided learning solutions to more than 48,000 engineers, across 220 organizations worldwide.
Thank you for everyone who joined us this past year to hear about our proven methods of attracting and retaining tech talent.
© 2013 - 2022 DevelopIntelligence LLC - Privacy Policy
Let's review your current tech training programs and we'll help you baseline your success against some of our big industry partners. In this 30-minute meeting, we'll share our data/insights on what's working and what's not.
Training Journal sat down with our CEO for his thoughts on what’s working, and what’s not working.