Finally getting started with AWS

It’s time to stop being uncomfortable with AWS. The JAWS stack (JavaScript + AWS) looks cool, but this basic AWS walkthrough seems like a good place to start.

I don’t get Webpack

I keep seeing mention of Webpack in various JavaScript discussions, but I just don’t get it. I don’t see where it fits in, where it starts and ends or what it really wants to be.

Most Webpack introductions I’ve read start by comparing it to Browserify, then mention how it’s rolls in Require.js style AMD modules  – as if that were a good thing. If Webpack were just a better Browserify, that’d be great, because Browserify is pretty great already.

But then things get weird. Webpack can (with a loader) process Sass files? It gathers image assets? What? It watches files too? But I’ve already got Gulp* doing all that and the workflow is really good. Can Webpack work with Gulp? Does it replace Gulp? Why so much redundancy?

Finally Webpack throws in a static web server. Well now just stop right there. BrowserSync is ten kinds of awesome and much more than just live-reloading pages; device synchronization, mirrored input, bandwidth throttling and DOM outlining are going to have to be pried away from me. 

* I know Gulp is supposed to be gulp, but proper nouns and English.

Alternate gulp clean task syntax

https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js

Lately I’ve started seeing a shorter version of the preferred Gulp clean task. At first glance, it looks like a potential bug, where gulp wouldn’t know when the task ended, but after looking a bit more closely, it’s easy to see why it works.

Here’s an example clean task from Gulp’s documentation, as of April 2015:

gulp.task('clean', function(cb) {
  del(['build'], cb);
});

And here’s a variation on the new, shorter version:

gulp.task('clean', del.bind(null, ['build']));

Note that in both cases, del refers to the del module which was required at the top of the file.

This works because Gulp always sends a callback argument when calling a task function. Binding the pattern to del (after nulling the context) just assigns the pattern as a default argument. Internally, it’s exactly the same as the more explicit version which just hands gulp’s callback over. The shorter version just lets that happen implicitly.

function(cb) {
    del(['build'], cb);
}

is really the same as this:

function(cb) {
    var delBound = del.bind(null, ['build']);
    delBound(cb);
}

While it’s nice to save a few keystrokes, hiding the callback feels a bit sneaky. Binding can be kind of ugly too, in this case null is just noise and the most meaningful argument, the pattern glob, is moved away from the function that’s using it.

I don’t think I’m going to be adopting this style in my own gulpfiles.

@sebmck, creator of the Babel JS Transpiler, (née 6to5) is continuing his takeover of the modern JavaScript landscape. In the past week or two, my JS linter switched over  to eslint with babel-eslint (seemingly replacing both JSCS and JSHint). Now Babelify is replacing the Reactify transform I’ve been using with Browserify. Babel was already my default JS syntax in Sublime Text. 

I hope Sebastian and the Babel team can maintain this, and I also hope he ends up somewhere with deep pockets and great mentors. 

Update: Someone listened!