After publishing my article on ECMAScript 6, some have reached out to ask how I exactly I make it all work.
I refrained from including these details on the original post because they're subject to immiment obsoletion. These tools are changing and evolving quickly, and some of these instructions are likely to become outdated in the coming months or even weeks.
When evaluating the available transpilers, I decided to use 6to5, which has recently been renamed to Babel. I chose it based on:
Hello, visitors! If you want an updated version of this styleguide in repo form with tons of real-life examples… check out Trellisheets! https://github.com/trello/trellisheets
“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”
You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?
| // Translates a Google diff-match-patch diff to an array of ottypes textv1 ops | |
| // Pretty straight-forward! | |
| module.exports = function (diff) { | |
| var ops = []; | |
| for(var i = 0; i < diff.length; i++) { | |
| var diffComp = diff[i]; | |
| switch(diffComp[0]) { | |
| case -1: // DELETION | |
| ops.push({d:diffComp[1].length}); | |
| break; |
| define(function(require) { | |
| var React = require('react'); | |
| var paramRegex = /__(\d)+/; | |
| var parser = new DOMParser(); | |
| var errorDoc = parser.parseFromString('INVALID', 'text/xml'); | |
| var errorNs = errorDoc.getElementsByTagName("parsererror")[0].namespaceURI; | |
| // turns the array of string parts into a DOM | |
| // throws if the result is an invalid XML document. |
Mini projects by Maxime Euzière (xem), subzey, Martin Kleppe (aemkei), Mathieu Henri (p01), Litterallylara, Tommy Hodgins (innovati), Veu(beke), Anders Kaare, Keith Clark, Addy Osmani, bburky, rlauck, cmoreau, maettig, thiemowmde, ilesinge, adlq, solinca, xen_the,...
(For more info and other projects, visit http://xem.github.io)
(Official Slack room: http://jsgolf.club / join us on http://register.jsgolf.club)
| // Returns a function, that, as long as it continues to be invoked, will not | |
| // be triggered. The function will be called after it stops being called for | |
| // N milliseconds. If `immediate` is passed, trigger the function on the | |
| // leading edge, instead of the trailing. | |
| function debounce(func, wait, immediate) { | |
| var timeout; | |
| return function() { | |
| var context = this, args = arguments; | |
| clearTimeout(timeout); |
| // Support routines for automatically reporting user timing for common analytics platforms | |
| // Currently supports Google Analytics, Boomerang and SOASTA mPulse | |
| // In the case of boomerang, you will need to map the event names you want reported | |
| // to timer names (for mPulse these need to be custom0, custom1, etc) using a global variable: | |
| // rumMapping = {'aft': 'custom0'}; | |
| (function() { | |
| var wtt = function(n, t, b) { | |
| t = Math.round(t); | |
| if (t >= 0 && t < 3600000) { | |
| // Google Analytics |
To setup your computer to work with *.test domains, e.g. project.test, awesome.test and so on, without having to add to your hosts file each time.
| var redis = require("redis") | |
| , subscriber = redis.createClient() | |
| , publisher = redis.createClient(); | |
| subscriber.on("message", function(channel, message) { | |
| console.log("Message '" + message + "' on channel '" + channel + "' arrived!") | |
| }); | |
| subscriber.subscribe("test"); |
