Rails に Babel と Rollup を組み込んで CoffeeScript を JavaScript に段階的に移行した話 - クックパッド開発者ブログ
こんにちは。技術部クックパッドサービス基盤グループの青沼です。当グループではクックパッドのレシピサービスを支える web アプリケーションの改善を進めています。今回はフロントエンドの改善の一環として、 Babel と Rollup を Rails のアセットパイプラインに組み込み、レガシーな CoffeeScript ファイルを ES2015+ の JavaScript に移行した話をします。 レシピサービスと CoffeeScript の歴史 クックパッドは10年以上の歴史を持つサービスです。中でもレシピサービスの web アプリケーションは初期に作られた Rails 2 アプリケーションがアップグレードを重ねながら今も動いています。2018年には Rails 3 から4へ、つい最近では4から5へのアップグレードを完了しました。 Ruby のコードはそれに伴って新しい書き方へと徐々に移行
Announcing CoffeeScript 2
We are pleased to announce CoffeeScript 2! This new release of the CoffeeScript language and compiler aims to bring CoffeeScript into the modern JavaScript era, closing gaps in compatibility with JavaScript while preserving the clean syntax that is CoffeeScript’s hallmark. In a nutshell: The CoffeeScript 2 compiler now translates CoffeeScript code into modern JavaScript syntax. So a CoffeeScript =
6年前に書いたCoffeeScriptをES6に変換した - hitode909の日記
昔はCoffeeScript好きで，たのしく書いてて，いまもたのしく書けるのだけど，最近はこういうグッズを使わなくても，ESLintとかFlowとか，安全便利グッズが増えてきているので，Coffeeやめることにした． しばらく運用モードだったのだけど，追加したい機能が出てきたので，Coffeeのままやるよりは，型書けるようにしてからやったほうが安心できそう． やったこと decaffeinate でJSに変換する これで脱出できるってパスタ君に教えてもらった BabelとBrowserify入れる Flow入れた jQueryとunderscoreに依存してたので型定義をダウンロードしてくる ESLint入れた Gulpメリットない感じになってきたので，package.jsonにCLIのコマンドを書いてコンパイルするようにした 型をちょっとずつ書いた 型を書くときに困ったのが，Coffee
Redirecting...
Redirecting... Click here if you are not redirected.
CoffeeScriptからES2015(ES6)へ移行しました - Pepabo Tech Portal
ネットショップ運営サービス カラーミーショップで「新カゴプロジェクト」と呼んでいる最高のショッピングカートの開発をしている@tsuchikazuです。 2014年に開発を開始した新カゴプロジェクトではフロントエンドをCoffeeScript + Angularで開発してきました。ES5までの時代にAltJS文化を作り、Class構文やArrow Functionを先取りしていたCoffeeScript。それらはES2015(ES6)の仕様に採用され、一方でCoffeeScript自体の開発は止まり、CoffeeScriptは役割を終えたのではないでしょうか。先月、今後も変化し続けるフロントエンドに追従するためにも、新カゴプロジェクトで200ファイル以上のCoffeeScriptをES2015へ移行しましたので、今回その方法を紹介します。 トランスパイラ 移行方法としてCoffeeScrip
さよなら CoffeeScript - mizchi's blog
prototype.js が jQuery に置き換えられた時、開発者が気づいたのは、自分に本当に必要だったのはprototypeのメソッド拡張などではなく、クエリエンジンだったということ。 coffeescriptが当初、熱狂的に支持された背景はなんだっただろう。今思えば、それはアロー記法とクラス構文だったと思う。 javascriptの関数型への憧れ、prototypeベースの限界 javascript は断じて関数型言語ではないが、他の言語と同じぐらい関数型言語に憧れていたのも、また事実だろう。しかしビルトイン関数が高階関数を要求するデザインにしては function というキーワードはながすぎたし、その function が暗黙に作り出す this スコープの複雑な振る舞いも開発者の悩みの種だった。「あらゆる関数スコープで状態を持つことが"できすぎる"」という割れ窓だった。 ES5
React.jsをCoffeeScriptとjadeで書く - Future [ _ ]
React.jsをCoffeeScriptとjadeで書く February 13, 2015 はじめに React v0.13.0 Beta 1 | React React.Componentを使うと生のJSのclass形式でReact Componentを定義できる reactjs - react-jadeでjadeテンプレートから仮想DOMを出力する - Qiita JSXのXの部分をjadeで書けるようにするライブラリ (Jade -> React VDOM) ここあたりの記事を読んでRiot.jsなら素でできるCoffeeScriptとJadeの組み合わせがReactでも出来そうだと気づいたので試行錯誤中、 よさ気な書き方を見つけた話です。 結論 こうです。 https://gist.github.com/uzimith/145a0cf8e342dc46ac96 React =
Moving to ES6 from CoffeeScript
gistfile1.md Moving to ES6 from CoffeeScript I fell in love with CoffeeScript a couple of years ago. Javascript has always seemed something of an interesting curiosity to me and I was happy to see the meteoric rise of Node.js, but coming from a background of Python I really preferred a cleaner syntax. In any fast moving community it is inevitable that things will change, and so today we see a big
「JavaScriptエンジニア養成読本」でCoffeeScriptについて書いた - mizchi's blog
kyo_agoさんに誘われて、CoffeeScriptについて1章書きました。 JavaScriptエンジニア養成読本［Webアプリ開発の定番構成Backbone.js＋CoffeeScript＋Gruntを1冊で習得！］：書籍案内｜技術評論社 他の章の紹介は他の著者さんに任せるとして、自分の書いた章について少し紹介。 JavaScriptエンジニア養成読本を書きました - watilde's blog 実践的CoffeeScript CoffeeScriptの言語仕様について、初心者でも誤解しないよう、言語マニアでも新しく学びがあるように書いたつもりです。 とくにオブジェクトや配列のパターンマッチ、CoffeeScript特有のオブジェクト指向のイディオム、大規模開発時のディレクトリ構成について実例を交えて書きました。 たとえばこんなコード module.exports = class
JavaScript代替プログラミング言語CoffeeScriptの最新版「CoffeeScript 1.8」がリリース
Jeremy Ashkenas氏をはじめとするCoffeeScript開発チームは、「CoffeeScript 1.8」を8月26日（現地時間）にリリースした。CoffeeScriptは、コンパイルすることでJavaScriptに変換することのできるJavaScriptの代替プログラミング言語の一種。 「CoffeeScript 1.8」では、CLIの--joinオプションを非推奨とするとともに、CLIがディスクへのファイル書き込みに失敗した際に、「exit code 1」で終了するようにしている。 また、コンパイラが一方のシングルクォートしかない文字列によってクラッシュする問題や、ソースマップの同期失敗による文字列補間に関する問題、タブでインデントされたコードにおいて誤った位置にエラーマーカーを表示する問題、スタックトレースパッチ済みソースマップの誤りを修正した。 さらに、%%演算子は単
「CoffeeScriptのリファクタリング」の実践とレビュー - mizchi's blog
CoffeeScriptのリファクタリング - ワザノバ | wazanova CoffeeScriptのリファクタリングと聞いたので、いてもたってもいられなくなった。まず、お題の結果を見ずにやってみる。 これが元のコード $(document).ready -> photoHTML = (photo) => "<li> <a id='photo_#{photo.id}' href='#{photo.url}'> <img src='#{photo.url}' alt='#{photo.alt}' /> </a> </li>" $.ajax url: '/photos' type: 'GET' contentType: 'application/json' onSuccess: (response) => for photo in response.photos node = $(phot
CoffeeScriptのリファクタリング - ワザノバ | wazanova
http://blog.arkency.com/2014/07/6-front-end-techniques-for-rails-developers-part-i-from-big-ball-of-mud-to-separated-concerns/ 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約2時間前 シングルページアプリもあり、それでなくてもフロント側のコードを書く機会は増えてきてますが、コードをうまく整理して、 簡単に、もっとテストしやすいコードを書く。 クオリティを下げることなく開発スピードをあげる。 ためのノウハウの一端を開発会社のArkencyがシェアしてくれています。 シリーズの初回は、シンプルなリファクタリングのケーススタディ。 CoffeeScriptのコードが、DOM変換、イベントハン
coffee-mode 0.5.2 released - Shohei Yoshida's Diary
coffee-mode 0.5.2 is out. I fixed newline-and-indent issues. Repository https://github.com/defunkt/coffee-mode Issues if true |Cursor is '|' and executes coffee-newline-and-indent(C-m), then if true |Indentation is one level deeper than expected. if true | if trueCursor is '|' and executes coffee-newline-and-indent(C-m), then if true |if trueIndentation is one level deeper than expected. Finally P
CreateJS のクラスを CoffeeScript 上で継承するには | DevelopersIO
Animal クラスを継承した Dog クラスです。Dog クラスの constructor メソッド内で super() と実行すると、継承元である Animal クラスの constructor メソッドが実行され、Animal クラスが持つメソッドを Dog クラスのメソッドとして使用できるようになります。 CreateJS のクラスを継承する場合 通常はこの super()メソッドだけで事足りるのですが、CreateJS のクラスを継承する際は super()メソッドではなくinitialize() メソッドを呼び出すことで実現します。 Bitmap クラスを継承した ImageButton クラス class ImageButton extends createjs.Bitmap constructor: (args)-> @initialize(args.img) @x = a
JavaScriptの継承イディオム coffeescriptとtypescriptの比較 - mizchi's blog
coffeescriptのclass syntaxで生成されたコードと、typescriptのそれは、お互いに継承でき、互換があると言われている。 本当に互換があるのかちゃんと調べないといけないなーと常々思ってたので、確認する。 検証コード coffeescript class A f: -> console.log 'super' class B extends A f: -> super console.log 'sub' b = new B b.f() typescript class A{ f() { console.log('super'); } } class B extends A { f(){ super.f(); console.log('sub'); } } var b = new B; b.f() やってることは全く一緒 ヘッダー 継承を行うとどちらもヘッダに継承用ユ
jQuery with CoffeeScript | CSS-Tricks
I don’t always write CoffeeScript, but when I do, I’m probably using jQuery too; I always forget the syntax for stuff. So I’m going to write it all down here so I can reference it until I memorize it. Note that the compiled example doesn’t include the automatic closure around everything you get in CoffeeScript. Safe jQuery Closure So you can use the $ safely (common in WordPress): (($) -> ) jQuery
CoffeeScript と TypeScript をそれぞれ実務案件で使ってみた感想 | DevelopersIO
そんな訳で、CoffeeScript を触り始めて半年弱、TypeScript を触り始めて1ヶ月弱ほど経ちました。まだまだ日は浅いですが、いちおう両方とも実務案件にて使用したということで、ここらで双方に対する振り返りを簡単にしておくとします。 CoffeeScript について http://coffeescript.org/ 学習開始時期: 2014年1月頃 始めたきっかけ: Middleman や Ruby on Rails が標準サポートしているため、面倒な環境構築等をしなくて済んだから Ruby や Haml のようなテキスト量の少ない文法が好みだったから そんな訳でとっかかりとしての基礎学習期間はだいたい2〜３日くらいで、そこから既存のプロダクションコードを CoffeeScript に書き換えつつ実案件に取り入れていきました。 おおまかな特徴 要は JavaScript をよ
GitHub - markbates/Programming-In-CoffeeScript: Source code for the Programming in CoffeeScript book.
This repository contains all of the source code for the book, Programming in CoffeeScript. As I write the book this repository will be updated with any changes, additions, subtractions, etc... that come along. The book can be purchaseed pretty much anywhere you can buy books, both in print and eBook formats (ePUB, MOBI, PDF). Here's where you can find a comprehensive list of those places: http://b
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
styleguide/coffeescript.ja.md at master · cookpad/styleguide
TypedCoffeeScriptって、あったらよくないですか
