http://www.ecma-international.org/ecma-262/6.0/

ECMAScript 6forreal

const keyword, block scope

destructuring, array

arrow functions

destructuring, object

template strings

default value

{ what: „ready to use TDD env“,

why: „practice, practice, practice“,

url: „http://TDDbin.com“, twitter: „@tddbin“ }

{ what: „ES6 learning by doing“,

when: „new kata every day“,

url: „http://ES6katas.org“, twitter: „@es6katas“ }

{ what: „TDD, pairing, clean code“,

when: „every 3 months“, next: „5th December 2015“,

url: „http://jsCodeRetreat.com“, twitter: „@jsCodeRetreat“ }

ECMAScript 6

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

N O W

LET’S CODE

http://kangax.github.io/compat-table/es6/

Did you notice?

• Tests run on node.js

• No browser involved

• Decouple from the evil DOM

• react.js-think helps :)

let’s BUILD

not now :)

webpack

https://gist.github.com/substack/68f8d502be42d5cd4942

webpack

browserify

N O W

LET’S BUILD

noticed that it linted react-syntax, JSX?

seeing is

believing

CD

🙋

@WolframKriesingjob status:

👍