COFFEE SCRIPTTANIGUCHI Makoto @ H2O Space.

JAVA SCRIPT

Java Script

•Webブラウザ上で動作する、スクリプト言語

•「Netscape Navigator 2.0（1996年）」に実装された

•一時「JSを利用するのは悪」などと言われたが、Ajaxの流行と共に、注目される

jQuery

• JavaScriptを強化する「ライブラリ」

•強力なセレクタや、エフェクトの美麗さで人気

•他のライブラリ（Prototype.js、Ext.js）などに比べ、圧倒的な普及率を誇る

現在の開発スタイル

JavaScript

jQuery

今後の開発スタイル？

JavaScript

jQueryCoffeeScript コンパイル

コンパイル？

•プログラマが記述した「ソースプログラム」を、コンピュータが理解可能な言語に「翻訳」する事

•「Objective-C」や「Java」がコンパイラ言語

• PHPやJavaScriptは翻訳を必要としない「スクリプト言語」または「インタープリタ言語」

CoffeScriptってなにもの？

•より簡潔に、素早く記述するための言語

• JavaScriptの欠点を克服し、スマートにソースを記述

•無用な不具合を回避しやすくなる

新しく覚えるの？

•使う単語（ファンクション）は、ほぼ同じ

•言い方が少し異なるだけ

•「明けましておめでとうございます。今年もよろしくお願いします。」　→　あけおめことよろみたいな感じ？

例var countdown, num;

countdown = (function() { var _results; _results = []; for (num = 10; num >= 1; num--) { _results.push(num); } return _results;})();

JavaScriptcountdown = (num for num in [10..1])

CoffeeScript

簡潔

例if (band !== SpinalTap) volume = 10;

JavaScriptvolume = 10 if band isnt SpinalTap

CoffeeScript

分かりやすい！

はじめかた

• Node.jsと、npmをインストール

• CoffeeScriptをインストール

•ソースを書いて「xxx.coffee」ファイルで保存

•コマンドを叩いてコンパイル

• JavaScriptファイル（.js）をHTMLに読み込ませる

はじめかた

• CodeKitをインストールする（Mac）

•フォルダを登録する

•ソースを書く

神ツール

DEMO

ファンクションを作る

この記号が大事

オブジェクトを作る

このタブ記号が大事

jQueryを使うjQueryも使えます

if構文いろいろいろいろな書き方

使える演算子意味が通じやすい

while構文

untilも使える

ヒヤドキュメント

長い文字列を記述しやすい

もう少しじっくりなら..

•今日から始めるCoffeeScripthttp://tech.kayac.com/archive/coffeescript-tutorial.html

• CoffeeScript基礎文法最速マスターhttp://www.infiniteloop.co.jp/blog/2011/03/coffeescript-master/

• CoffeeScript（オフィシャル：英語）http://coffeescript.org/

CoffeeScriptのメリット

• JSで「かゆいところに手が届かない」部分に手が届く

•カッコや各種記号など、冗長な書き方を省略できる

• RubyやPythonなどの「今っぽい」書き方ができる

デメリット

• JSと書式が結構違うので、慣れるまで戸惑う

•コンパイルエラーと、JS自体のエラーが発生するのでトラブルの際の原因究明の手間がかかる

• JS自体のことも深く知っておく必要があるため、初学者にとっては、学習することが多い

JSスクリプトに不満がある人向け

JAVA SCRIPTのこれから

Titanium Mobileスマホアプリ開発

node.jsサーバーサイド開発

Bootstrap, from Twitterサイト制作

LAMPからGUMDAM?

http://w3ddd.github.com/2012/03/12/gundam.html

しがみついていきましょう・・