Enviar pesquisa
Carregar
CoffeeScriptってなんぞ?
•
85 gostaram
•
13,475 visualizações
Hayato Mizuno
Seguir
kanazawa.js v1.7 - Back to Basics -(2012年3月31日開催)で使用したスライドです。
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 45
Baixar agora
Baixar para ler offline
Recomendados
プログラマ進化論
プログラマ進化論
Sotaro Omura
WordBench Kobe jQueryどうでしょう
WordBench Kobe jQueryどうでしょう
Hishikawa Takuro
ネットスーパー
ネットスーパー
Solur
LDD'12/Summer in KITAMI Opening Slide
LDD'12/Summer in KITAMI Opening Slide
ohotech
日常業務にperlを使おう
日常業務にperlを使おう
turugina
Javaユーザに伝えたいselenide入門
Javaユーザに伝えたいselenide入門
snowhiro
Mustache入門
Mustache入門
ina job
php.js
php.js
Kenta USAMI
Recomendados
プログラマ進化論
プログラマ進化論
Sotaro Omura
WordBench Kobe jQueryどうでしょう
WordBench Kobe jQueryどうでしょう
Hishikawa Takuro
ネットスーパー
ネットスーパー
Solur
LDD'12/Summer in KITAMI Opening Slide
LDD'12/Summer in KITAMI Opening Slide
ohotech
日常業務にperlを使おう
日常業務にperlを使おう
turugina
Javaユーザに伝えたいselenide入門
Javaユーザに伝えたいselenide入門
snowhiro
Mustache入門
Mustache入門
ina job
php.js
php.js
Kenta USAMI
Wynn Netherland: Accelerating Titanium Development with CoffeeScript, Compass...
Wynn Netherland: Accelerating Titanium Development with CoffeeScript, Compass...
Axway Appcelerator
Happy Programming with CoffeeScript
Happy Programming with CoffeeScript
Eddie Kao
BDD by Jasmine (jscafe 13)
BDD by Jasmine (jscafe 13)
Ryuma Tsukano
Aiming study#6pdf
Aiming study#6pdf
Koutaro Chikuba
Introduction to CoffeeScript
Introduction to CoffeeScript
Stalin Thangaraj
Client-side MVC with Backbone.js
Client-side MVC with Backbone.js
iloveigloo
zsh最強シェル入門読書会1
zsh最強シェル入門読書会1
Naoya Nakazawa
JavaScript Library Overview
JavaScript Library Overview
jeresig
Zshって最強らしい
Zshって最強らしい
ngi group.
Web Development with CoffeeScript and Sass
Web Development with CoffeeScript and Sass
Brian Hogan
今日から業務で使える17の運用系Linuxツール、そして円環の理
今日から業務で使える17の運用系Linuxツール、そして円環の理
Masahito Zembutsu
【JAWS DAYS 2016】ランサーズを支えるAurora
【JAWS DAYS 2016】ランサーズを支えるAurora
Yuki Kanazawa
Dockerを活用したリクルートグループ開発基盤の構築
Dockerを活用したリクルートグループ開発基盤の構築
Recruit Technologies
【dots. IT勉強会】開発環境のDocker化
【dots. IT勉強会】開発環境のDocker化
Yuki Kanazawa
Zabbix3.0でどう変わるか
Zabbix3.0でどう変わるか
Atsushi Tanaka
Zabbix超入門
Zabbix超入門
Daisuke Ikeda
Scalable JavaScript Design Patterns
Scalable JavaScript Design Patterns
Addy Osmani
ZabbixのAPIを使って運用を楽しくする話
ZabbixのAPIを使って運用を楽しくする話
Masahito Zembutsu
Backbone.js
Backbone.js
daisuke shimizu
5分でインストール!awsでzabbix3.0
5分でインストール!awsでzabbix3.0
Tadashi Mishima
Functional JavaScript with Lo-Dash.js
Functional JavaScript with Lo-Dash.js
Shogo Sensui
サイボウズ・ラボユース 最終成果報告会プレゼンテーション
サイボウズ・ラボユース 最終成果報告会プレゼンテーション
sn_monochr
Mais conteúdo relacionado
Destaque
Wynn Netherland: Accelerating Titanium Development with CoffeeScript, Compass...
Wynn Netherland: Accelerating Titanium Development with CoffeeScript, Compass...
Axway Appcelerator
Happy Programming with CoffeeScript
Happy Programming with CoffeeScript
Eddie Kao
BDD by Jasmine (jscafe 13)
BDD by Jasmine (jscafe 13)
Ryuma Tsukano
Aiming study#6pdf
Aiming study#6pdf
Koutaro Chikuba
Introduction to CoffeeScript
Introduction to CoffeeScript
Stalin Thangaraj
Client-side MVC with Backbone.js
Client-side MVC with Backbone.js
iloveigloo
zsh最強シェル入門読書会1
zsh最強シェル入門読書会1
Naoya Nakazawa
JavaScript Library Overview
JavaScript Library Overview
jeresig
Zshって最強らしい
Zshって最強らしい
ngi group.
Web Development with CoffeeScript and Sass
Web Development with CoffeeScript and Sass
Brian Hogan
今日から業務で使える17の運用系Linuxツール、そして円環の理
今日から業務で使える17の運用系Linuxツール、そして円環の理
Masahito Zembutsu
【JAWS DAYS 2016】ランサーズを支えるAurora
【JAWS DAYS 2016】ランサーズを支えるAurora
Yuki Kanazawa
Dockerを活用したリクルートグループ開発基盤の構築
Dockerを活用したリクルートグループ開発基盤の構築
Recruit Technologies
【dots. IT勉強会】開発環境のDocker化
【dots. IT勉強会】開発環境のDocker化
Yuki Kanazawa
Zabbix3.0でどう変わるか
Zabbix3.0でどう変わるか
Atsushi Tanaka
Zabbix超入門
Zabbix超入門
Daisuke Ikeda
Scalable JavaScript Design Patterns
Scalable JavaScript Design Patterns
Addy Osmani
ZabbixのAPIを使って運用を楽しくする話
ZabbixのAPIを使って運用を楽しくする話
Masahito Zembutsu
Backbone.js
Backbone.js
daisuke shimizu
5分でインストール!awsでzabbix3.0
5分でインストール!awsでzabbix3.0
Tadashi Mishima
Destaque
(20)
Wynn Netherland: Accelerating Titanium Development with CoffeeScript, Compass...
Wynn Netherland: Accelerating Titanium Development with CoffeeScript, Compass...
Happy Programming with CoffeeScript
Happy Programming with CoffeeScript
BDD by Jasmine (jscafe 13)
BDD by Jasmine (jscafe 13)
Aiming study#6pdf
Aiming study#6pdf
Introduction to CoffeeScript
Introduction to CoffeeScript
Client-side MVC with Backbone.js
Client-side MVC with Backbone.js
zsh最強シェル入門読書会1
zsh最強シェル入門読書会1
JavaScript Library Overview
JavaScript Library Overview
Zshって最強らしい
Zshって最強らしい
Web Development with CoffeeScript and Sass
Web Development with CoffeeScript and Sass
今日から業務で使える17の運用系Linuxツール、そして円環の理
今日から業務で使える17の運用系Linuxツール、そして円環の理
【JAWS DAYS 2016】ランサーズを支えるAurora
【JAWS DAYS 2016】ランサーズを支えるAurora
Dockerを活用したリクルートグループ開発基盤の構築
Dockerを活用したリクルートグループ開発基盤の構築
【dots. IT勉強会】開発環境のDocker化
【dots. IT勉強会】開発環境のDocker化
Zabbix3.0でどう変わるか
Zabbix3.0でどう変わるか
Zabbix超入門
Zabbix超入門
Scalable JavaScript Design Patterns
Scalable JavaScript Design Patterns
ZabbixのAPIを使って運用を楽しくする話
ZabbixのAPIを使って運用を楽しくする話
Backbone.js
Backbone.js
5分でインストール!awsでzabbix3.0
5分でインストール!awsでzabbix3.0
Semelhante a CoffeeScriptってなんぞ?
Functional JavaScript with Lo-Dash.js
Functional JavaScript with Lo-Dash.js
Shogo Sensui
サイボウズ・ラボユース 最終成果報告会プレゼンテーション
サイボウズ・ラボユース 最終成果報告会プレゼンテーション
sn_monochr
ラボユース 最終成果報告会
ラボユース 最終成果報告会
shiftky
知ってるようで意外と知らないPHPの便利関数
知ってるようで意外と知らないPHPの便利関数
Wataru Terada
㉗HTML5+jQueryでお絵かき
㉗HTML5+jQueryでお絵かき
Nishida Kansuke
今さら始めるCoffeeScript
今さら始めるCoffeeScript
Ashitaba YOSHIOKA
「スピード」と「品質」を実現するPHP開発チームの取り組み~AngularJS+FuelPHP+AspectMock~
「スピード」と「品質」を実現するPHP開発チームの取り組み~AngularJS+FuelPHP+AspectMock~
leverages_event
Visualforce + jQuery
Visualforce + jQuery
Salesforce Developers Japan
正規表現勉強会
正規表現勉強会
zaru sakuraba
Reactive Programming
Reactive Programming
Hideyuki Takeuchi
Force.com Weibnar : アドバンスドVisualforce
Force.com Weibnar : アドバンスドVisualforce
Salesforce Developers Japan
実践Sass 後編
実践Sass 後編
kosei27
JavaScriptCore.framework の普通な使い方 #cocoa_kansai
JavaScriptCore.framework の普通な使い方 #cocoa_kansai
Tomohiro Kumagai
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
Yasuhito Yabe
Wb osaka 20120623
Wb osaka 20120623
Miho Ishida
JavaScriptの正規表現
JavaScriptの正規表現
yaju88
Siphone coffeemaker okayama-js-1
Siphone coffeemaker okayama-js-1
NISHIMOTO Keisuke
プログラマがWebデザインについて考えてみた
プログラマがWebデザインについて考えてみた
Eigoro Yamamura
From Java To Clojure
From Java To Clojure
Kent Ohashi
ATSプログラミングチュートリアル
ATSプログラミングチュートリアル
Kiwamu Okabe
Semelhante a CoffeeScriptってなんぞ?
(20)
Functional JavaScript with Lo-Dash.js
Functional JavaScript with Lo-Dash.js
サイボウズ・ラボユース 最終成果報告会プレゼンテーション
サイボウズ・ラボユース 最終成果報告会プレゼンテーション
ラボユース 最終成果報告会
ラボユース 最終成果報告会
知ってるようで意外と知らないPHPの便利関数
知ってるようで意外と知らないPHPの便利関数
㉗HTML5+jQueryでお絵かき
㉗HTML5+jQueryでお絵かき
今さら始めるCoffeeScript
今さら始めるCoffeeScript
「スピード」と「品質」を実現するPHP開発チームの取り組み~AngularJS+FuelPHP+AspectMock~
「スピード」と「品質」を実現するPHP開発チームの取り組み~AngularJS+FuelPHP+AspectMock~
Visualforce + jQuery
Visualforce + jQuery
正規表現勉強会
正規表現勉強会
Reactive Programming
Reactive Programming
Force.com Weibnar : アドバンスドVisualforce
Force.com Weibnar : アドバンスドVisualforce
実践Sass 後編
実践Sass 後編
JavaScriptCore.framework の普通な使い方 #cocoa_kansai
JavaScriptCore.framework の普通な使い方 #cocoa_kansai
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
Wb osaka 20120623
Wb osaka 20120623
JavaScriptの正規表現
JavaScriptの正規表現
Siphone coffeemaker okayama-js-1
Siphone coffeemaker okayama-js-1
プログラマがWebデザインについて考えてみた
プログラマがWebデザインについて考えてみた
From Java To Clojure
From Java To Clojure
ATSプログラミングチュートリアル
ATSプログラミングチュートリアル
Mais de Hayato Mizuno
レスポンシブWebデザインでうまくやるための考え方
レスポンシブWebデザインでうまくやるための考え方
Hayato Mizuno
"今" 使えるJavaScriptのトレンド
"今" 使えるJavaScriptのトレンド
Hayato Mizuno
メンテナブルPSD
メンテナブルPSD
Hayato Mizuno
赤い秘密
赤い秘密
Hayato Mizuno
なんでCSSすぐ死んでしまうん
なんでCSSすぐ死んでしまうん
Hayato Mizuno
フロントエンドの求めるデザイン
フロントエンドの求めるデザイン
Hayato Mizuno
Hello jQuery - 速習jQuery +綺麗なコードを書くためのヒント -
Hello jQuery - 速習jQuery +綺麗なコードを書くためのヒント -
Hayato Mizuno
レンダリングを意識したパフォーマンスチューニング
レンダリングを意識したパフォーマンスチューニング
Hayato Mizuno
jQuery Performance Tips – jQueryにおける高速化 -
jQuery Performance Tips – jQueryにおける高速化 -
Hayato Mizuno
ノンプログラマーのためのjQuery入門
ノンプログラマーのためのjQuery入門
Hayato Mizuno
Mais de Hayato Mizuno
(10)
レスポンシブWebデザインでうまくやるための考え方
レスポンシブWebデザインでうまくやるための考え方
"今" 使えるJavaScriptのトレンド
"今" 使えるJavaScriptのトレンド
メンテナブルPSD
メンテナブルPSD
赤い秘密
赤い秘密
なんでCSSすぐ死んでしまうん
なんでCSSすぐ死んでしまうん
フロントエンドの求めるデザイン
フロントエンドの求めるデザイン
Hello jQuery - 速習jQuery +綺麗なコードを書くためのヒント -
Hello jQuery - 速習jQuery +綺麗なコードを書くためのヒント -
レンダリングを意識したパフォーマンスチューニング
レンダリングを意識したパフォーマンスチューニング
jQuery Performance Tips – jQueryにおける高速化 -
jQuery Performance Tips – jQueryにおける高速化 -
ノンプログラマーのためのjQuery入門
ノンプログラマーのためのjQuery入門
CoffeeScriptってなんぞ?
1.
CoffeeScriptってなんぞ?
kanazawa.js v1.7
2.
水野隼登 Webデザイナー 株式会社DMM.comラボ twitter: @pocotan001
3.
CoffeeScript?
4.
CoffeeScriptはJavaScriptです。
CoffeeScript?
5.
CoffeeScriptはJavaScriptです。 alert
"Hello" .coffee CoffeeScript?
6.
CoffeeScriptはJavaScriptです。 alert
"Hello" .coffee alert("Hello"); .js CoffeeScript?
7.
CoffeeScriptは小さな言語です。
CoffeeScript?
8.
CoffeeScriptは小さな言語です。
全60ページ CoffeeScript?
9.
10.
11.
アジェンダ ・ Less code!
- 少ないコード ・ Enhancements! - 機能の強化 CoffeeScript?
12.
Less code!
13.
うわ、私の JavaScript 1/3...?
14.
Example 1 $(function() {
$("body").html("Hello"); }); Less code!
15.
; 要らない。 $(function() {
$("body").html("Hello") }) Less code!
16.
; () 要らない。 $
function() { $("body").html "Hello" } Less code!
17.
; () {}
要らない。 $ function() $("body").html "Hello" Less code!
18.
インデントでブロックを表現 $ function()
$("body").html "Hello" Less code!
19.
function() は -> $
-> $("body").html "Hello" Less code!
20.
Example 2 $("div").click(function(event) {
$(this).css({ color: "red", fontSize: "14px" }); }); Less code!
21.
; () {}
要らない。 $("div").click function(event) $(this).css color: "red", fontSize: "14px" Less code!
22.
; () {}
, 要らない。 $("div").click function(event) $(this).css color: "red" fontSize: "14px" Less code!
23.
インデントでブロックを表現 $("div").click function(event)
$(this).css color: "red" fontSize: "14px" Less code!
24.
function(args) は (args)
-> $("div").click (event) -> $(this).css color: "red" fontSize: "14px" Less code!
25.
this は @ $("div").click
(event) -> $(@).css color: "red" fontSize: "14px" Less code!
26.
Enhancements!
27.
変数に var要らない。 version =
1.7 Enhancements!
28.
グローバル変数は明示的に。 version = 1.7 window.title
= "kanazawa.js" Enhancements!
29.
""の中では #{式} が使える。 version
= 1.7 window.title = "kanazawa.js #{version}" Enhancements!
30.
こんな書き方もok version = 1.7 window.title
= "kanazawa.js #{version + 1}" Enhancements!
31.
あいまいな == と
!= は使えない。 # 1 === true 1 == true Enhancements!
32.
=== は isとも書ける。 #
1 === true 1 is true Enhancements!
33.
JavaScript
CoffeeScript === is Enhancements!
34.
JavaScript
CoffeeScript === is !== isnt ! not && and || or true true, yes, on false false, no, off Enhancements!
35.
すべての文が... if 1 is
true "○" else "×" Enhancements!
36.
式として扱える。 result = if
1 is true "○" else "×" Enhancements!
37.
基本的に最後の値が返る。 result = if
1 is true "○" else "×" "no!" Enhancements!
38.
関数においても同じ。 sum = (x,
y) -> ... x + y Enhancements!
39.
関数は return 書いてもok sum
= (x, y) -> ... return x + y Enhancements!
40.
まとめ
41.
短く書ける 役に立つ機能 コードが一貫性を持つ
42.
短く書ける 役に立つ機能 コードが一貫性を持つ
43.
短く書ける 役に立つ機能 コードが一貫性を持つ
44.
"CoffeeScriptはJavaScriptをスタンダード なデザインパターンで書くための省略形 の集合だ。"
Reg Braithwaite
45.
Thank you
Baixar agora