Your SlideShare is downloading. ×
0
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to CoffeeScript
Intro to 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

Intro to CoffeeScript

1,034

Published on

This is

This is

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,034
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
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. The Billy D. Williams of Client Side Scripting<br />Jeremy Woertink<br />
  • 2. The cool side of JavaScript<br /><ul><li>1 to 1 with JavaScript
  • 3. Cleaner Syntax
  • 4. OOP style coding
  • 5. Rubyish!
  • 6. Built into Rails 3.1</li></li></ul><li>Venti mocha latte, please!<br />note: I have no idea what that actualy is<br />
  • 7. JavaScript<br />var i, bean, beans, count;<br /> bean ='columbian';<br /> beans = [];<br /> beans.push(bean);<br /> count = beans.length;<br />if(typeof bean !=='undefined'&& bean !==null) {<br /> alert('We have a '+bean+' bean');<br /> }<br />for(i =0;i < count; i++) {<br /> alert(beans[i]);<br /> }<br />
  • 8. CoffeeScript<br /> bean ='columbian'<br /> beans = [] <br /> beans.push bean <br /> count = beans.length # not needed<br /> alert "We have a #{bean} bean" if bean?<br /> alert bean for bean in beans<br />
  • 9. Grande Chai Code Light<br />Installing:<br />Install NodeJS<br />http://nodejs.org/<br />Install NPM<br />http://npmjs.org/<br />npm install coffee-script<br />gem "barista"<br />https://github.com/Sutto/barista<br />
  • 10. Brewing an App<br />Rails 3 with Barista<br />rails g barista:install<br />Rails.root.join("app", "assets", "javascripts")<br />app/assets/javascripts/application.coffee<br />GO!<br />
  • 11. Tell me more about Coffee<br />
  • 12. Coffee Extras<br />Cool things about the CoffeeScript<br /><ul><li>Default argument values
  • 13. no more braces
  • 14. no more semi colons
  • 15. a lot less parenthesis
  • 16. array splats
  • 17. english operators (and, is, isnt, until...)
  • 18. existence operators (?, ?.)
  • 19. class definitions
  • 20. embedded oldschool JS
  • 21. Interactive CLI (coffee to get in, quit() to exit)</li></li></ul><li>What about decaf?<br />
  • 22. jQuery<br />$(function() {<br />$('#link').click(function() {<br />$(this.hash).show('fast', function() {<br />//this fails. the scope of "this" is <div id="container"><br />$(this.hash).text("Here is a "+ this.title);<br /> });<br /> });<br /> });<br />/* HTML <br /><a id="link" href="#container" title="Big Box">Click</a><br />*/<br />
  • 23. jQuery flavored CoffeeScript<br />$-><br />$('#link').click -><br />$(@hash).show 'fast', =><br />$(@hash).text "Here is a #{@title}"<br />/* HTML <br /><a id="link" href="#container" title="Big Box">Click</a><br />*/<br />
  • 24. Ready to pour a cup?<br />

×