さよなら CoffeeScript - mizchi's blog
prototype.js が jQuery に置き換えられた時、開発者が気づいたのは、自分に本当に必要だったのはprototypeのメソッド拡張などではなく、クエリエンジンだったということ。 coffeescriptが当初、熱狂的に支持された背景はなんだっただろう。今思えば、それはアロー記法とクラス構文だったと思う。 javascriptの関数型への憧れ、prototypeベースの限界 javascript は断じて関数型言語ではないが、他の言語と同じぐらい関数型言語に憧れていたのも、また事実だろう。しかしビルトイン関数が高階関数を要求するデザインにしては function というキーワードはながすぎたし、その function が暗黙に作り出す this スコープの複雑な振る舞いも開発者の悩みの種だった。「あらゆる関数スコープで状態を持つことが"できすぎる"」という割れ窓だった。 ES5
CoffeeScript と TypeScript をそれぞれ実務案件で使ってみた感想 | DevelopersIO
そんな訳で、CoffeeScript を触り始めて半年弱、TypeScript を触り始めて1ヶ月弱ほど経ちました。まだまだ日は浅いですが、いちおう両方とも実務案件にて使用したということで、ここらで双方に対する振り返りを簡単にしておくとします。 CoffeeScript について http://coffeescript.org/ 学習開始時期: 2014年1月頃 始めたきっかけ: Middleman や Ruby on Rails が標準サポートしているため、面倒な環境構築等をしなくて済んだから Ruby や Haml のようなテキスト量の少ない文法が好みだったから そんな訳でとっかかりとしての基礎学習期間はだいたい2〜３日くらいで、そこから既存のプロダクションコードを CoffeeScript に書き換えつつ実案件に取り入れていきました。 おおまかな特徴 要は JavaScript をよ
CoffeeScript で学ぶ Observer パターンの基礎 | DevelopersIO
CoffeeScript を導入したことによってクラス化が比較的易しくなり、導入前よりもずっと見通しの良いコードが書けるようになってきました。クラス化することによって関連する機能を一箇所に集約することができ、後から機能を追加する際も関連するクラス内に迷わず追記することができるので、コードがあちこちに散らばることがなくなります。そして各クラスは、それぞれが与えられた役目だけに徹する（関連機能が集約されているから）ので、他のクラスのことなど知ったこっちゃないと言わんばかりに意識しなくなり、自然と疎結合なコードになっていきます。 と、いうのが理想なわけですが、実際そうも言ってられなくなったりします。ひとつ以下の様なケースで考えてみます。 出版社（Publisher）と読者（Reader）という2つの登場人物がいます。読者は出版社が近日発売予定のとある書籍を購入したいと考えていますが、出版社内で編
Node.js＋CoffeeScript でソースマップを使ってデバッグを楽にする方法
以前、jQuery 1.9 のソースマップ対応で圧縮版でもデバッグが簡単になった話 を書いたけど、Node.js でソースマップする方法を紹介する。 何がうれしいかというと、Node.js で CoffeeScript や TypeScript、JSX なんかを使ったときに、例外に含まれるスタックトレースに変換前の位置を表示できる。 やり方は簡単。source-map-support というモジュールを require() するだけ。 ためしに使ってみた GitHub に動かし方が書いてあるので、その通りにやってみる。 こんな感じの demo.coffee があったとする。 require 'source-map-support' foo = -> bar = -> throw new Error 'this is a demo' bar() foo() npm install sourc
SinatraとHamlとScssとCoffeeScriptでモダンなWeb制作環境を構築する #3 | DevelopersIO
さて本シリーズ第三回です。 前回はhaml、scss、coffeescriptのコンパイルを正規表現で省略したり、hamlのレイアウトを変更する方法を紹介させて頂きました。 今回はコンパイル済みのhtml、css、javascriptをまとめて保存するスクリプトを紹介してみようと思います。 rakeをインストールする rubyでは自動化したいタスクがある場合、rakeというビルドツールを使用します。インストールはGemfileに記述を追加してbundleコマンドを叩くだけです。 Gemfile gem 'rake' # 追加 $ bundle # installは省略できます rakeがインストールできたら試しにHello Worldでもしてみましょう。 プロジェクトのルートディレクトリに Rakefile という名前のファイルを作成し以下のように記述してください。 Rakefile de
SinatraとHamlとScssとCoffeeScriptでモダンなWeb制作環境を構築する #2 | DevelopersIO
前回はRubyのインストールから簡単に各メタ言語の使い方を紹介させて頂きました。今回は応用編を紹介したいと思います。 コンパイルする記述を一つにまとめる 前回紹介した方法は一番シンプルな方法でした。GETリクエストとパスの組み合わせに一つのhamlファイルを紐付けているため、このままではファイルが増える毎に記述をコピペしなくてはいけません。 get '/' do haml :index end # aboutページが欲しくなったら…？ get '/about' do haml :about end これではあまりモダンなとは言いがたいですよね。というわけで記述を省略できる方法ですが、getメソッドにパスを与えている部分を正規表現にすれば実現出来ます。 要するに以下のように記述すればいいのです。 get %r{^/(.*)\.html$} do haml :"#{ params[:captu
SinatraとHamlとScssとCoffeeScriptでモダンなWeb制作環境を構築する #1 | DevelopersIO
こんにちは山形です。 htmlやcss等を書いて静的なWebサイトを制作している方なら誰でも、より効率的な環境求めていると思います。 DreamweaverやAptana等のIDEを使うのも一つの手だと思いますが、より柔軟な環境構築としてご紹介したいと思います。 Rubyをインストールする Windowsの場合 Engineyard社が提供しているRailsinstallerでサクッと入れてしまいましょう。 Railsinstallerはこちらからダウンロード出来ます ダウンロードできたらexeを起動しウィザードに従ってインストールを実行してください。 Mac OS Xの場合 rbenvでのインストールを紹介します。 先にXcode Command line Toolsのインストールを済ませておいてください。 Xcodeの環境設定からインストールできます。 # rbenvをgithubから
【CoffeeScript編】Node + Socket.IO で簡単なチャットアプリの作成 | DevelopersIO
こんにちは、うえじゅんです。 今回は前回作成したチャットアプリを「CoffeeScript」で置き換えてみます。 CoffeeScriptについては「はじめるCoffeeScript」シリーズを見ていただけると嬉しいです。 「はじめるCoffeeScript その1」 「はじめるCoffeeScript その2」 「はじめるCoffeeScript その3」 CoffeeScriptのインストール まず「CoffeeScript」インストールします。 ターミナルで以下のコマンドを実行してください。 (エラーが出る場合は、「sudo」をつけてみてください。) 「CoffeeScript」 npm install -g coffee-script インストールが終わったらこちらもバージョンを確認しておきましょう。 「coffee -v」で「CoffeeScript version 1.4.0」
JavaScriptをシンプルに
CoffeeScriptは、JavaScriptのコードを生成するためのコンパクトなスクリプト言語です。JavaScriptの言語仕様から、あいまいさやわかりにくさを排除した仕様を持っているので、JavaScriptよりもシンプルなコードで処理を記述できます。JavaScriptで複雑な処理を記述したり、大規模なアプリケーションを開発したりする必要があるときに適しています。 目次 千葉県鎌ヶ谷市在住のライター。自著・監修の書籍が100冊達成まであと1冊になりました。だからなんだというわけでもないのですが、ひとつの区切りということで(^^;。 これからも、少しでも役立つ書籍、記事を書いていきたいと思いますので、どうぞよろしくお願いいたします。ホームページ：サーバサイド技術の学び舎 - WINGS
はじめるCoffeeScript その1 | DevelopersIO
こんにちは、うえじゅんです。 今回はCoffeeScriptについてです。 CoffeeScriptはRuby on Rails 3.1からデフォルトで使われていたり、SpineというJavaScriptのMVCフレームワークに使われていたりもします。 (Spineについては「Spine.js をはじめよう」を参照してみてください) CoffeeScriptとは 公式Webサイトには以下のようにあります。 CoffeeScript is a little language that compiles into JavaScript.(JavaScriptにコンパイルする小さな言語です) RubyやPythonと似ていると言われており、複雑になりがちのJavaScriptをシンプルに書くことができる言語です。 <script type="text/coffeescript">と指定することで
これからCoffeeScriptでNode.jsする人にオススメのパッケージ「Express Coffee Template 1.2」
Express Coffee Templateは、ExpressJSのCoffeeSciprt版です。 $ git clone http://github.com/twilson63/express-coffee.git express_coffee_sampleCloning into express_coffee_sample $ cd express_coffee_sample/ $ npm install 本家よりも多くのパッケージがインストールされます。早速起動してみます。 $ node server.js Listening... ブラウザで http://localhost:3000/ にアクセスします。 本家と見た目がずいぶん異なります。 本家ExpressJSと何が違うのか？ スタイルシートにStylusを使っている スタイルシートのデフォルトテンプレートにRespons
CoffeeScript 入門! 怒濤の 100 サンプル!! | TM Life
今まで CoffeeScript についてのエントリーを連投してきましたが とりあえずこのエントリーで一区切りつけようと思います. ちなみに今までに書いた CoffeeScript についてのエントリーはこんな感じです. node.js 不要! Windows でも簡単に CoffeeScript を使う方法 jsdo.it で CoffeeScript を使う方法 CoffeeScript 入門 基礎編 – CoffeeScript と JavaScript を 10個のサンプルで比較してみた CoffeeScript と gl.enchant.js を使って15分で 3D ゲームを作ってみた. 動画もあるよ♪ 今回は enchant.js で怒濤ったとき同様 CoffeeScript についても怒濤ってみました. プログラミングは本を読むだけでは学んだとは言えません. 作ってナンボの世
CoffeeScriptベストプラクティス集 Node.jsアプリケーション編（1）
イベント駆動型のプログラムをきれいに作る JavaScriptのプログラムは、イベント駆動型で非同期な構造が基本となります。他のプログラミング言語で一般的な「同期型」の関数では、例えばネットワーク経由でデータを読み込む場合、データを読み込む関数を実行するとその読み込みが完了するまでプログラムの実行は止まったままになります。 それに対して、「非同期型」の関数を使うとデータの読み込みが完了するまで他の処理を実行でき、読み込みが完了した後で特定の関数を呼び出してもらうことができます。身近な例に例えると、メールを送信して相手からの返信が来るまで何もせずに待つのが同期型関数だとすれば、非同期型関数は返信を待つ間に他の仕事をこなすことができます。 Webアプリケーションはネットワーク通信部分に最も時間がかかる場合が多いため、その待ち時間に他の処理をこなせば、ただ待っているよりも遥かに効率よく多くの処理
これは便利。Google ChromeでCoffeeScriptを使う·CoffeeConsole MOONGIFT
CoffeeConsoleはGoogle Chrome上でCoffeeScriptを記述して実行できる機能拡張です。 CoffeeScriptに慣れると素のJavaScriptが書きづらく感じるようになってしまいます。ChromeのデバッグでJavaScriptを書くのにストレスを感じていた方はCoffeeConsoleをぜひ使ってみてください。 インストールします。 インストールしました。すぐに使えます。 Webインスペクタを開きます。右端にCoffeeScriptというタブが追加されています。 開きました。左側に記述すると、右側に変換後のJavaScriptが表示されます。 リアルタイムに変換されます。そのままコマンド＋エンターまたはShift＋エンターを押すと実行されます。 console.logなどはConsoleタブで確認する必要があります。 CoffeeConsoleは一行単位
CoffeeScript 入門 基礎編 – CoffeeScript と JavaScript を 10個のサンプルで比較してみた | TM Life
またまた前回に引き続き CoffeeScript についてのエントリーです. 今回は以前書いた『JavaScript 入門 基礎編』で作ったサンプル 10 個を CoffeeScript で作り直してみました. CoffeeScript 版も JavaScript 版も, 全て jsdo.it にアップしているので コードを見比べてみると面白いかもしれません. { } } }{ { { }{ } } _____ __ __ }{ }{ { ) / ____| / _|/ _| .- { { } { }} -. | | ___ | |_| |_ ___ ___ ( ( } { } { } } ) | | / _ \| _| _/ _ \/ _ \ |`-..________ ..-'| | |___| (_) | | | || __/ __/ | | \_____\___/|_| |_| \
coffeescript - を淹れるための最低限文化的な環境 : 404 Blog Not Found
2012年04月04日16:00 カテゴリLightweight Languages coffeescript - を淹れるための最低限文化的な環境 私のような体育会系プログラマーは、実際に動かしてみないとわからないので、その場で動かせる環境を作ってみました。 Demo 結論から言うと、この程度ですみます。CoffeeScript -> JavaScript だけではなく、逆変換もできます。 CoffeeScript: ((s) -> while s isnt undefined try s = eval(prompt(s)) catch e s = e ) "JS:" JavaScript: (function(s){while(s!==undefined)try{s=eval(prompt(s))}catch(e){s=e}})('JS:') DHTML Source 基本的に Js2
gruntで快適JS/CSSビルド生活
programming notes. mainly about JavaScript / jQuery. [@Takazudo] [takazudo@gmail.com] Hint: alt + / ※ この記事はgrunt version 0.2.x のもので、grunt 0.3 からはAPIが変更されています grunt というJS/CSSのビルドツールが便利だったので紹介します。(Mac/Linux) cowboy/grunt - GitHubこのgruntってのは、JS,CSSを全部まとめて繋げる、まとめてJS lintする、minifyする見たいのをタスクとして登録しておくと、それ実行すればちゃちゃっとやってくれちゃうやつです。さらにwatchっていう機能使えば、ファイルが更新されたらそのタスクをやってくれるみたいなのも。 似たモノで、MakeとかRakeとかCakeとかそういう
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CoffeeScriptでSourceMapを使うとデバッグがかなりラクになるかも
The Little Book on CoffeeScript
CoffeeScriptによるモダンなWebアプリケーション開発一覧