Your SlideShare is downloading. ×
Writing Bullet-Proof Javascript: By Using CoffeeScript
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Writing Bullet-Proof Javascript: By Using CoffeeScript

3,281

Published on

CoffeeScript talk slides given by Susan Potter in April 2010 at the University of Illinois Research Park.

CoffeeScript talk slides given by Susan Potter in April 2010 at the University of Illinois Research Park.

Published in: Technology
1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total Views
3,281
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
1
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Writing bullet proof Javascript (by using CoffeeScript) April 2010 @SusanPotter
  • 2. Outline1. Javascript lifecycle: copy-n-paste (mid/late-90s) coarse-grained translation layers (mid-00s) (unobtrusive) pure Javascript (late-00s)2. What is CoffeeScript?3. Why use CoffeeScript?4. CoffeeScript Examples5. CoffeeScript Tools6. Resources
  • 3. Copy-n-paste (mid/late-90s) Used mostly for: preloading images image hover-overs alerts/confirms Lots of dreadful Dreamweaver snippets Wild west era of Javascript Nobody really understood Javascript Bad Javascript snippets spread like wild fire!
  • 4. Coarse-grained translation layers (mid-00s) Ruby on Rails popularized this with RJS & JS helpers. "AJAX-friendly" frameworks started appearing in other languages: Python, Groovy, Erlang, PHP, etc. RJS-style good for specific coarse-grained functionality. RJS-style bad when you need more flexibility & control. RJS-style promotes bad code smells: long templates, methods inline Javascript (inflexible & non-reusable) hard to debug and troubleshoot
  • 5. Pure Javascript (late-00s) Everyone wanted to be a Javascript ninja & unobtrusive Javascript (UJS) became cool with rise of libraries. Pro: most control and flexibility Pro: libraries made UJS and better JS style easier and more accessible. Con: common Javascript pitfalls: devs still consider it secondary or tertiary language easy to pollute global space accidentally large "falsey" values can cause problems unintuitive prototypal object-oriented many others too numerous to list
  • 6. What is CoffeeScript? Fine-grained translation layer on top of Javascript.class User constructor: (login) -> @login: loginuser = new User(mbbx6spp)if signedIn() $(#top-header).html(Welcome + user.login)else $(#top-header).html(Welcome Anonymous)
  • 7. Why use CoffeeScript? Prevents common mistakes using different syntax. More terse & expressive. More readable. Generates Javascript without any JSLint warnings.
  • 8. Why not use CoffeeScript? Adds another level of indirection. Another syntax to learn. Already know Javascript (the good parts) well.
  • 9. CoffeeScript Examples: jQuery http://gist.github.com/365144
  • 10. CoffeeScript Examples: Mathhttp://gist.github.com/365187
  • 11. CoffeeScript Examples: OO http://gist.github.com/365215 CoffeeScript: lines 35 Javascript: lines 60 CoffeeScript: more readable Javascript generated: optimized and zero JS Lint warnings
  • 12. CoffeeScript Tools bistro_car: Rails plugin http://github.com/jnicklas/bistro_car Rails applications only, lacking optimization. Rack adapter for CoffeeScript http://github.com/mattly/rack-coffee Ruby/Rack applications only. Caffeinator http://github.com/mbbx6spp/caffeinator Coming soon, not yet ready! Goals: Any framework, any Javascript optimization.
  • 13. Resourceshttp://coffeescript.orgIRC: freenode #coffeescripthttp://github.com/jashkenas/coffee-script/issuesTwitter: use #coffeescript hashtag on questions/queries @SusanPotter for pointers :)

×