厂辫谤辞肠办别迟蝉を捨てたい
- 2. 自己紹介 ? 名前: joe-re(じょうあー、じょー) ? freeeという会社でクラウド会計作ってます。 ? ぶっちゃけRubyよりJavaScriptの方が好き。
- 3. そもそもSprocketsってなん だっけ ? Ruby製のアセットのプリプロセッサ ? Rails3.1から導入 ? AltJSやSassなどのcompile ? concat、minify、uglify、md5フィンガープリント ? 依存関係の整理がしやすくなる ? develop 時にはminifyしない、など難しい設定いらずでいい感じに動 く
- 4. なんで捨てたいの ? 最近はフロントエンドのツールが充実してる ? ライブラリなど基本的にGem化されていないと使えない (導入コスト高い) ? 全てを1つのファイルにConcatするので、JavaScriptの読 み込みに時間がかかる(Turbolinkうまく使えばあるいは？) ? Rails5 から Rails API が本体に入る ? Sprocketsに依存しないことで、Railsが死んだ時にも対応 できるようになる
- 5. 理想型から考える
- 6. 妄想 ? もはや、RailsはJSON返すAPIサーバでよくね？ ? いいねー。フロントとサーバは完全にリポジトリ分けて、別々にCIし ようか。 ? うんうん。JSONスキーマ定義して、Rails側ではそれ使ってAPIのバリ デーションして、フロント側はレスポンスモックして動かしたり、テ ストしたりするの良さそう。 ? おkおk。インテグレーションテストはSelenium Web Driver使って、 マルチブラウザまで書いていく感じかな。 ? :+1:
- 7. 現実 ? jQueryのDOM操作多すぎ。心折れそう。SPAとか正直無 理な感じする。 ? わかるー。そもそも複雑で人類の理解できる範囲超えて るし。コンポーネント指向っていってもなー。どこから 手をつけて良いやら…。 ? ていうかそもそもフロントのテストなんて書いてないしな！ インテグレーションテストなんてもちろ(rya ? :cry:
- 9. とりあえずjs分割(before) ? 初期状態のapplication.js # … //= require jquery //= require jquery_ujs //= require_tree . fooページにだけ必要なfooとかbarページで必要な barとかまとめられてしまう。
- 10. とりあえずjs分割(after) ? lib.js //= require jquery //= require jquery_ujs ? hoge.js //= require hoge ? bar.js //= require bar
- 11. bowerの資産を使う ? bower-rails ? https://github.com/rharriso/bower-rails ? これでgemになってないライブラリも使える ? (とはいえbowerオワコン感がある…)
- 12. ビルドの成果物をSprocketsに のせる ? フロントでビルドした成果物をapp/assets配下に 出力するようにする ? md5フィンガープリント、minify、concat、uglify などは従来通りSprocketsさんにやってもらう ? フロントに特化したビルドをしつつ、面倒な部分 はSprocketsに任せられるので扱いやすい
- 13. Front Engineering on Sprockets ? react-rails ? mithril-rails ? angularjs-rails ? sprockets-es6 ? gulp-rails-pipeline
- 14. 厂辫谤辞肠办别迟蝉を捨てさる
- 15. 方針 ? Rails は JSON を返すWebAPIにする。 ? ルーティング、レンダリングなどは全てフロ ントで処理する。 ? ビルドはgruntやgulpなどのフロントで使い易 いツールへ移行する。
- 16. フロントのビルド成果物はどこ に配置するか ? 素直に Public配下が良いと思う。 ? 開発中もインクリメンタルビルドで、差分だ けうまいこと Public ディレクトリに放り込ん でいく。 ? 開発時にはuglifyやminifyしない。
- 17. proxy サーバを立てて開発を円 滑にしたい ? livereload など、フロント側でやりたいことがた くさんある！ ? Rails 側は一度立てれば、あとは意識しなくて良く なる。(動かなければプロセス確認したり、再起動 したりする程度) ? browser-sync すごく便利！
- 18. proxyサーバを立てた図 Rails Server localhost:3000 # endpoints GET /api/v1/friends public directory friends.js Proxy Server loalhost:8080 友達一覧が見たい！ localhost:8080/friends
- 20. 知见
- 21. 最近書いたgulp.coffee ? 最近ちょうどRailsアプリケーションでgulp導 入する機会があったので紹介 ? Sprockets完全廃止はできてない ? ビルド結果をapp/assets配下に出力して、 Sprocketsにのせる方式
- 22. build tasks
- 23. server & watch tasks
- 24. 所感
- 25. 移行するにあたってmd5フィンガー プリントをどうにかするのは難関 ? フロント側でビルドすると、そのままでは asset_pathヘルパーが効かなくなる。 ? これさえどうにかできれば感はある。
- 27. gemにassets含まれてるやつ ら、このやろう！ ? 単純にgem化されてるライブラリなら大抵はnpmにもあるから困ら ない。 ? けど、generateでview作る系のやつはassetsが含まれてたりする。 ? さすがにgulpタスクでgemファイルの中身をさらうのはなー。 ? そのgem使うのをやめるのが良い。無理ならgemから抜き出してリ ポジトリにコミットするか。(バージョン管理が面倒なのでやりたく ない。。)
- 28. 今の気持ち
- 29. 少し角が取れました ? そこまで完全に捨てることに拘る必要はないかも しれない(ある程度徐々に移行していくことは可能) ? SprocketsはSprocketsでいいところはある(とりあ えずはそう思うことにしよう) ? とはいえ新しく作るアプリケーションなら Sprocketsに頼らなくても良さそう
- 30. ありがとうございました