ecmascript 6 for real
TRANSCRIPT
const his = it;his('identity', () => {const [firstName, lastName, company] =
'Wolfram Kriesing uxebu'.split(' ');
assert.equal(firstName, 'Wolfram');assert.equal(lastName, 'Kriesing');assert.equal(company, 'uxebu');});
const youCan = it;youCan('find me', () => {
const [url, twitter] ='uxebu.com,@WolframKriesing'.split(',');
assert.equal(url, 'uxebu.com');assert.equal(twitter, '@WolframKriesing');
});
const me = it;me('runs', () => {const [,...runs] =('uxebu,es6katas.org,tddbin.' +'com,jsCodeRetreat').split(',');
assert.deepEqual(runs, ['es6katas.org','tddbin.com','jsCodeRetreat'
]);});
const me = it;me('runs', () => {const [,...runs] =('uxebu,es6katas.org,tddbin.' +'com,jsCodeRetreat').split(',');
assert.deepEqual(runs, ['es6katas.org','tddbin.com','jsCodeRetreat'
]);});
{what: „ES6 learning by doing“,
when: „new kata every day“,
url: „http://ES6katas.org“,twitter: „@es6katas“
}
{what: „ready to use TDD env“,
why: „practice, practice, practice“,
url: „http://TDDbin.com“,twitter: „@tddbin“
}
{what: „TDD, pairing, clean code“,
when: „every 3 months“,next: „5th September 2015“,
url: „http://jsCodeRetreat.com“,twitter: „@jsCodeRetreat“
}
ECMAScript 6forreal
Photo by tranchis - Creative Commons Attribution-NonCommercial-ShareAlike License https://www.flickr.com/photos/25813335@N00 Created with Haiku Deck
Photo by bogdog Dan - Creative Commons Attribution-NonCommercial License https://www.flickr.com/photos/25689440@N06 Created with Haiku Deck
Photo by aquababe - Creative Commons Attribution-NonCommercial License https://www.flickr.com/photos/25138992@N00 Created with Haiku Deck
Traceur
Photo by Luz Adriana Villa A. - Creative Commons Attribution License https://www.flickr.com/photos/11599314@N00 Created with Haiku Deck
Photo by Hindrik S - Creative Commons Attribution-NonCommercial-ShareAlike License https://www.flickr.com/photos/63991153@N00 Created with Haiku Deck
Photo by droetker0912 - Creative Commons Attribution-NonCommercial-ShareAlike License https://www.flickr.com/photos/58020577@N06 Created with Haiku Deck
Sep 2014
long time ago, in tech
http://www.uxebu.com/blog/2014/11/es6-tdd-work-traceur-mocha-sinon/
https://github.com/uxebu/mocha-sinon-traceur-example
expect().toBe()
expect().toHaveXyz()
expect().toEqualSomethingICanDefine()
WHY ES6 at all?
https://gist.github.com/wolframkriesing/ab6d82024aec7068382a
ES6 import is static! yeah!
'import' and 'export' may only appear at the top level
ENOUGHreason
but there is looooooots more
> traceur --script import.js --out out.js/playground/import.js:1:1: Unexpected token import/playground/import.js:1:8: Semi-colon expected/playground/import.js:1:16: Semi-colon expected/playground/import.js:1:19: Semi-colon expected/playground/import.js:1:27: Semi-colon expected
> babel import.js 'use strict';var _assert = require('assert');
> cat import.js import {assert as a} from 'assert';
LET’S
CODE
kata group’s link
kata group’s name
LET’S
CODE
kata group’s link
kata group’s name
N O W
LET’S
CODE
Did you notice?
• Tests run on node.js
• No browser involved
• Decouple from the evil DOM
• react.js-think helps :)
let’s
BUILD
webpack
https://gist.github.com/substack/68f8d502be42d5cd4942
N O W
LET’S
BUILD
noticed that it linted react-syntax, JSX?
seeing
is
believing
!"
uxebu.com/workshop
@WolframKriesing