The document discusses ECMAScript 6 (ES6) features for writing test-driven development (TDD) code with Traceur and other tools. It provides three code snippets showing how to write tests with ES6 features like import, arrow functions, and template strings. It also lists several online resources for learning ES6, doing coding exercises with TDD, and attending code retreat events focused on TDD.

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

3. ECMAScript 6
for
real

5. const keyword, block scope
destructuring, array
arrow functions
destructuring, object

7. template strings
default value

10. {
what: „ready to use TDD env“,
why: „practice, practice, practice“,
url: „http://TDDbin.com“,
twitter: „@tddbin“
}

12. {
what: „ES6 learning by doing“,
when: „new kata every day“,
url: „http://ES6katas.org“,
twitter: „@es6katas“
}

13. {
what: „TDD, pairing, clean code“,
when: „every 3 months“,
next: „5th December 2015“,
url: „http://jsCodeRetreat.com“,
twitter: „@jsCodeRetreat“
}

14. ECMAScript 6

15. Photo by tranchis - Creative Commons Attribution-NonCommercial-ShareAlike License https://www.flickr.com/photos/25813335@N00 Created with Haiku Deck

16. Photo by bogdog Dan - Creative Commons Attribution-NonCommercial License https://www.flickr.com/photos/25689440@N06 Created with Haiku Deck

17. Photo by aquababe - Creative Commons Attribution-NonCommercial License https://www.flickr.com/photos/25138992@N00 Created with Haiku Deck

18. Traceur

19. Photo by Luz Adriana Villa A. - Creative Commons Attribution License https://www.flickr.com/photos/11599314@N00 Created with Haiku Deck

21. Photo by Hindrik S - Creative Commons Attribution-NonCommercial-ShareAlike License https://www.flickr.com/photos/63991153@N00 Created with Haiku Deck

22. Photo by droetker0912 - Creative Commons Attribution-NonCommercial-ShareAlike License https://www.flickr.com/photos/58020577@N06 Created with Haiku Deck

23. Sep
2014long time ago, in tech

25. http://www.uxebu.com/blog/2014/11/es6-tdd-work-traceur-mocha-sinon/

26. https://github.com/uxebu/mocha-sinon-traceur-example

27. expect().toBe()
expect().toHaveXyz()
expect().toEqualSomethingICanDefine()

28. WHY ES6
at all?

29. https://gist.github.com/wolframkriesing/ab6d82024aec7068382a

31. ES6 import is static! yeah!
'import' and 'export' may only appear at the top level

34. ENOUGH
reason
but there is looooooots more

36. > 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';

38. LET’S
CODE
kata group’s
link
kata group’s
name

39. N O W
LET’S
CODE

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

41. Did you notice?
• Tests run on node.js
• No browser involved
• Decouple from the evil DOM
• react.js-think helps :)

42. let’s
BUILDnot now :)

43. webpack

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

45. webpackbrowserify

47. N O W
LET’S
BUILD

48. noticed that it linted
react-syntax, JSX?

49. seeing
is
believing

53. CD

57. 🙋
@WolframKriesing
job status:
👍