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:
👍