a sip of coffee mauricia ragland
DESCRIPTION
TRANSCRIPT
A SIP OFCOFFEESCRIPT
TO GET YOU STARTED
FRONT END DEVELOPERS OF MIAMI
March 27, 2013 Created by /
SURVEY
Mauricia Ragland @summnerd
http://goo.gl/k9FMW
WHAT I WILL DISCUSS1. What CoffeeScript Is2. Why It's a Great3. A few cons4. Things to Know in Advance5. The Basics
COFFEESCRIPT
WRITE ONELANGUAGE TO GET
ANOTHER?
SO WHAT ARE THEBENEFITS?
Forces consistencyGreat when working on teamsWrites great codeGreat way to sharpen your own skillsetForces namespacingGreat Resource for learning
SO EVERYTHING'S GREAT!NO!
SO WHAT ARE THECONS?
Not for beginnersRequires setup Gem/NPMLearning CurveCan breed lazy developersThat's all I can think of...
OVERALLYou can stop using CoffeeScript whenever you want
SO THERE'S NOTHING TO LOSE!
WHAT YOU SHOULDKNOW
WATCH YOUR SPACING
START BY USING JS2COFFEE.ORG
GET TEAM IN SYNC
DO NOT EDIT JAVASCRIPT
DO NOT START WITHTIGHT DEADLINE
DOES NOT TAKE PLACEOF BEST PRACTICES
INSTALLING COFFEESCRIPTNode Package Manager - NPM
Ruby Gem
NO MANUALINSTALLATION
YES
WHY USE A PACKAGEMANAGER
Handles dependenciesEasy to versionI don't want to manage them myself
DO NOT USE SUDOsudo chown -R $USER /usr/local
NPM
Remove -g if you don't want a global install
npm install -g coffee-script
GEMgem install coffee-script#Check to see if it's installedgem query local
CODE SNIPPETSSyntax to understand to help get you going
FUNCTIONSAre indicated by arrow
is equivalent to
example = -> x = 1 + 2
function example(){ var x = 1 + 2;}
PARAMETERS
is equivalent to
example = ( x, y ) ->
function example( x, y ){}
HOW TO CALL AFUNCTION
is equivalent to
example()
#When Passing params parenthesis are not neededexample x, y
example();example( x, y );
CREATING A VARIABLE
"var" is not allowed
x = 1
#The following is incorrectvar x = 1;
CONDITIONALSTATEMENTS
is equivalent to
example() if x and yalert() if x?
if ( x && y ) example();if (typeof x !== "undefined" && x !== null) { alert();}
INTERPOLATION
is equivalent to
alert "My name is #{@firstName} #{@lastName}"
alert("My name is " + this.firstName + " " + this.lastName);
COMPILING COFFEESCRIPT
watch makes the process seamless
coffee --compile --output js/ coffee/
#Use the watchcoffee --watch --compile --output js/ coffee/
RESOURCESCOFFEESCRIPT
NPM
RUBY GEM
Code sample used during talk:
Official SiteJS2Coffee
Intro to NPM10 Things you can do with NPM
Online Manual
https://github.com/summanerd/asipofcoffee
THE ENDBY
SURVEY
MAURICIA RAGLAND@SUMMANERD
http://goo.gl/k9FMW