イベント概要
普段触っているのは Rails ではないものの webpack + Vue.js の事例が知りたかったのと、「お話する内容」の
主に jQuery ベースのコードを Vue.js を用いて書き換えたい人向けにお話します。
に惹かれて参加。
所感
具体的なソースコードがあるのがとても良い。
ver0 というタグが jQuery ベースの状態で、そこから jQuery を抜いていく。
しかしそれを事前情報で知れなかったのと、会場で wifi が利用できなかったので、その場で手を動かしながらついていくのは断念。事前に情報として知らせてほしかった。
（Rails や yarn が動く環境が必要だった）
内容としては感覚的に 6 割 Rails 固有の話、残りが Vue.js の話という感じで得たいと思った情報はそれほど得られなかった。（ある程度覚悟の上だったので、不満はない）
逆に言えば webpacker（Rails 用に webpack を使うための gem）の設定など、Rails に特化させて必要な手間をできるだけ省こうとするのは Rails の思想らしいといえばらしいと思った。
得た情報
- webpack ではエントリーとなる js ファイルが重要
- vue.esm の esm は ES modules の略（ES で書く際にはこちらを使う）
- webpack-dev-server: 自動ビルド・シンタックスエラーを検出してくれる
- Turbolinks: Rails のページ表示高速化のための何か（Vue.js とは相性が悪いということで今回は外す手順を踏んでいた）
- vue-data-scooper: form に予め入っている値で Vue.js の data プロパティを初期化してくれるパッケージ（今回の勉強会主催者である黒田さんが作ったもの。yarn で入れられる）
- Vue.js の v-cloak ディレクティブを使うと Vue インスタンスのコンパイルが完了するまで画面に表示しない、とかができる
- web アプリケーションフレームワークが提供するレンダリングエンジンと、 Vue.js のレンダリングをどう使い分ける？→インタラクティブなことをやるところは Vue.js のものを使って、残りは web アプリケーションフレームワークが提供するレンダリングでいいのでは（すべてを Vue.js に置き換えるのはけっこうたいへん）
余談
上記ソースコードの sfc ブランチはレンダリングをすべて Vue.js で行おうとしているバージョンになっている。
バリデーションとかが大変そう。
