Stuff I'm Up To

Technical Ramblings

ES6 vs CoffeeScript — December 15, 2016

ES6 vs CoffeeScript

ECMAScript is the underlying standard that JavaScript is built to. My main exposure has been with ES5 as supported by “corporate” modern browsers. However, the more modern browsers now support ES6. ES6 brings a lot of changes to the party and many are arguing that it’s making the need for CoffeeScript diminish significantly.

Just typical. I discover something that I find useful and it starts to become redundant – or does it?

Continue reading

Iced CoffeeScript —
Atom & Lint — December 14, 2016

Atom & Lint

I’ve been using Atom for a little while now and have to say I find it a lot quicker than Brackets. It has the occasional moment when loading a large script file and it tries hard to parse it and colourise it that causes it to hang for an age, but mostly it performs really well for me.

One of the excellent features I find useful is the integration with Git. I can easily see what line of a script I’ve changed, added or deleted.

The next feature I added was lint. Lint allows Atom to validate the script you’re writing meets guidance for it’s structure. There are several lint plug-ins you can use, but the one I’m using mostly is coffee-lint. This lints my CoffeeScript and reports if I’m failing outside of the guide lines for the document structure. eg. a trailing space on a line, a line length longer than 80 characters or an indentation issue.

It all helps to keep your code clean and consistent and in theory readable by anyone else.

http://www.coffeelint.org/

Continue reading

CoffeeScript — December 8, 2016

CoffeeScript

It’s like JavaScript, but less of a grind… well maybe.

I’ve been on a mission of discovery and uncovered all kinds of new stuff recently. From Electron, Node.js, GulpJS etc. CoffeeScript is my latest encounter on this path.

CoffeeScript is a language that compiles into JavaScript — which I think is wrong because JavaScript isn’t compiled, but then let’s not mess with semantics.

http://coffeescript.org/

Basically what it does is allows you to write a more simplistic version of JavaScript and “compile” it into the full blown JavaScript version. It has some pretty handy features, but sure takes some getting used to.

One of the nicest features (and also a little frustrating) is the for … loop. It’s nice how you don’t have to deal with indexed arrays if you use it. It indexes the array for you, but then allows you to reference the content like in a foreach singular, plural type manner.

eg dothis for file in files

Which results in

for (i = 0, len = files.length; i < len; i++) {
    file = files[i];
    dothis(file);
}

One of the biggest things it handles for you is all the comma and semicolon malarkey that is an everyday frustration of writing JavaScript. It simplifies things so much that much of your code loses brackets (both round and curly), commas and semicolons. That’s not to say it doesn’t have it’s quirks, but if you’re able to write JavaScript it’s easy to pick up CoffeeScript.

The way it works is you write your script as an indented style .coffee file eg. main.coffee and then you use the coffee processor to “compile” the .coffee into a regular .jsmain.js file. You can even have the coffee processor watch your filesystem for changes so as you save the .coffee file it will automatically create the .js file for you.

So far I’m a little uncertain about it’s value to me personally. I find it’s tricky to troubleshoot as I need to look at the JavaScript it generated anyhow. Then once I’ve found the problem I need to translate the solution into CoffeeScript to get it to “compile” it back to JavaScript and retest it.

Seriously, 10 minutes after writing this I discover “source maps”. Just add –map to your cofffee processor and it’ll create a map file that when you’re debugging in your browser it looks at your actual CoffeeScript, so you can spot any issues in the CoffeeScript code without necessarily looking at the JavaScript. Very cool!

Without a doubt it’s resulted in fewer lines of code to generate the same JavaScript output, but is it saving me any time really? I’m not so sure as it’s taking me on a journey to learn another language, which when you need to know JavaScript anyhow, seems a little unnecessary.

Continue reading