JSConf 2011 talk

2. Code is Cool
- but -
Products are Better
@aaronheckmann
github/aheckmann

3. Why?

4. `
http://wilwheaton.typepad.com/wwdnbackup/images/numbers.png

5. `
http://www.thebrannanblog.net/wp-content/uploads/2011/01/boombox.jpg

6. 4 ½ devs

8. http://farm1.static.flickr.com/199/480091641_3c2d87ddfa.jpg © Warner Bros Pictures

9. ?
http://farm1.static.flickr.com/199/480091641_3c2d87ddfa.jpg © Warner Bros Pictures

10. Don't Write Code

11. Not writing code

12. Not writing code
http://www.codeproject.com/KB/ajax/sal/ajax.jpg

13. If you're writing ajax
requests today you're
probably wasting
your time.
http://1.bp.blogspot.com/_4ynpbjsnPvk/SYioZdoZokI/AAAAAAAAKTM/HzAZZ3BsBak/s400/oregon-trail-3.jpg

14. Data-Dynamic

15. Data-Dynamic
1) event delegation

16. Data-Dynamic
1) event delegation
<form data-dynamic action='/explore' data-validate>

17. Data-Dynamic
1) event delegation
<form data-dynamic action='/explore' data-validate>

18. Data-Dynamic
1) event delegation
<form data-dynamic action='/explore' data-validate>
<anything data-dynamic='/wagon'>1840s</anything>

19. Data-Dynamic
1) event delegation
<form data-dynamic action='/explore' data-validate>
<any data-dynamic='/wagon' method='post'>1840s</any>

20. Data-Dynamic
1) event delegation
<form data-dynamic action='/explore' data-validate>
<any data-dynamic='/wagon' method='post'>1840s</any>
<a href='/oregon/trail' data-popup-remote>adventure!</a>

21. Data-Dynamic
1) event delegation
<form data-dynamic action='/explore' data-validate>
<any data-dynamic='/wagon' method='post'>1840s</any>
<a href='/oregon/trail' data-popup-remote>adventure!</a>
<span data-tip-remote='/tip/furtrade'>fur trade</span>

22. Data-Dynamic
1) event delegation
2) Managed JSON Response

23. Data-Dynamic
2) Managed JSON Response
res.send({
replace: { selector: html }
, emit: [eventName, args...]
, trigger: [selector, eventName, args...]
, popup: html
, redirect: url
, success: msg
, invalid: msg
, etc
});

24. Data-Dynamic
2) Managed JSON Response
res.send({
replace: { selector: html }
, emit: [eventName, args...]
, trigger: [selector, eventName, args...]
, popup: html
, redirect: url
, success: msg
, invalid: msg
, etc
});

25. Data-Dynamic
2) Managed JSON Response
res.send({
replace: { selector: html }
, emit: [eventName, args...]
, trigger: [selector, eventName, args...]
, popup: html
, redirect: url
, success: msg
, invalid: msg
, etc
});

26. Data-Dynamic
2) Managed JSON Response
res.send({
replace: { selector: html }
, emit: [eventName, args...]
, trigger: [selector, eventName, args...]
, popup: html
, redirect: url
, success: msg
, invalid: msg
, etc
});

27. Data-Dynamic
2) Managed JSON Response
res.send({
replace: { selector: html }
, emit: [eventName, args...]
, trigger: [selector, eventName, args...]
, popup: html
, redirect: url
, success: msg
, invalid: msg
, etc
});

28. Data-Dynamic
2) Managed JSON Response
res.send({
replace: { selector: html }
, emit: [eventName, args...]
, trigger: [selector, eventName, args...]
, popup: html
, redirect: url
, success: msg
, invalid: msg
, etc
});

29. Not Writing Code
http://joyindeutschland.files.wordpress.com/2011/02/oregon_trail_ii_opening.jpg

30. +

31. Get Dysentery

32. $ npm install express-mongoose
https://github.com/learnboost/express-mongoose

33. http://www.blogcdn.com/www.autoblog.com/media/2008/05/asimo_conducts_dso.jpg
Instrumentation

34. global
variable
leaks
http://www.changetheequation.org/clientuploads/Leaky%20Pipe.jpg

35. Code is Cool
- but -
Products are Better
@aaronheckmann
github/aheckmann