This document discusses teaching front-end developers new JavaScript skills by having them read books, experiment with code snippets ("spike it"), and learn frameworks. It recommends using a Model-View-Controller approach with templating to structure JavaScript code. Benefits include increased developer speed, hundreds of automated tests running in parallel, and time savings from faster loading and editing.

2. How to teach an old dog
new tricks
Andreas Knecht
JIRA Developer
2

3. JIRA Team
August 2012
3

4. 6 front-end developers
JIRA Team
August 2012
3

5. Need client-side features
4

6. Need client-side features
• Better UX
4

7. Need client-side features
• Better UX
• Performance
4

8. Need client-side features
• Better UX
• Performance
• Better REST API
4

9. BUT...
5

10. 6

11. JavaScript
development is hard!
6

12. Teaching an old dog new tricks
7

13. 3 Step Process
8

14. Read a book
1
9

15. Spike it!
2
10

16. Pick a framework
3
11

17. Pick a framework
3
11

18. Benefits
12

19. Documented Approach
13

20. Documented Approach
Model
Templating (View)
View (Controller) 13

21. Engineer JavaScript
vs
14

22. NAPI
15

23. NAPI
15

24. napi.js (691) 16

25. NoteDetailsView.js (56)
EditNoteView.js (68)
NoteModel.js (91)
vs NoteCollection.js (43) NoteListView.js (58)
NoteRowView.js (41)
templates.soy (87) NoteToolsView.js (81)
AddNoteView.js (94)
napi.js (691) 16

26. NoteDetailsView.js (56)
EditNoteView.js (68)
NoteModel.js (91)
vs NoteCollection.js (43) NoteListView.js (58)
NoteRowView.js (41)
templates.soy (87) NoteToolsView.js (81)
AddNoteView.js (94)
napi.js (691) (619) 16

27. Refactoring
17

28. Refactoring
17

29. Refactoring
17

30. Refactoring
17

31. Templating
18

32. Templating
18

33. Testing
19

34. Testing
19

35. Testing
917 tests
19

36. Testing
917 tests
29 parallel agents! 19

37. Testing
vs
917 tests
29 parallel agents! 19

38. Testing
vs
917 tests 785 tests
29 parallel agents! 19

39. Testing
vs
917 tests 785 tests
29 parallel agents! 1 agent 19

40. Testing
19

41. More than unit tests
20

42. More than unit tests
20

43. More than unit tests
20

44. More than unit tests
20

45. More than unit tests
20

46. Devspeed
21

47. Devspeed
• 10+ second saving
• ~1.5 hours per week
• Inline Edit: 10 hours/week!
22

48. Devspeed
• 10+ second saving
• ~1.5 hours per week
• Inline Edit: 10 hours/week!
22

49. Devspeed
• 10+ second saving
• ~1.5 hours per week
• Inline Edit: 10 hours/week!
22

50. Make the switch!
23

51. Thank you!