Rails5でMaterial Design Lite動かないのでturbolinksは切る

Material Design Liteがうまく動かないのでTurbolinksを切ったら、ちゃんと動くようになった。

■Turbolinksの切り方
以下、引用。

1) Remove the gem ‘turbolinks’ line from your Gemfile.
2) Remove the //= require turbolinks from your app/assets/javascripts/application.js .
3) Remove the two “data-turbolinks-track” => true hash key/value pairs from your app/views/layouts/application.html.erb .

 引用元:How to disable turbolinks in Rails 5?

3)は丸ごと行を削除でOK。

■メモ
・TurbolinksはReact使う時も切るのがよいとのことで、なるべく切る
・「rails new my_app –skip-turbolinks」でTurbolinksを無効にして作成できる
・「rails g scaffold」した時はturbolinks有効にしないと動かないものがあるっぽいので注意

Rails, React, Material Design関連のキーワード自分用まとめ

自分用まとめ。誤りあったらごめんなさい(すぐ修正します)。

■前提知識
・Homebrew:macOS用に使うパッケージを管理してくれる。似たものでMacPortsもあるがHomebrewで実装されていることが多いっぽい

■Rails関連のキーワード
・rbenv(Simple Ruby Version Management):Rubyをバージョン切り替え管理できる
・Rails 5.1からフロントエンド周りの強化としてYarnとWebpackerが実装されて、React実装がかんたんになった
Yarn(A new package manager for JavaScript):RubyGemsっぽいもの
Webpacker:JavaScriptアプリをRailsでかんたんに扱えるようにしたものっぽい
・Gemは使わなくてよいなら極力使わないこと。下手に使うと依存関係の修正対応が延々と終わらない。「使われなくなっている/使わないGem」などで調べるといろいろ見つかる

■React関連のキーワード
Node.js:JavaScriptで動かせる実行環境。これなくてもRailsに実行環境を用意すれば動かせる
npm(Node Package Manager):Node.jsで使うパッケージを管理してくれる。Node.jsインストールすると一緒に付いてくる。Railsだけで動かしているとパッケージの依存関係が大変になるので本気でやるならこれがいるっぽい
・実装は、Rails 5.1のYarnとWebpacker使った方法や、Gemfileに「gem ‘react-rails’」でインストールする方法などがある
・シングルページアプリケーション(SPA)を作らないなら無理してReact使わなくてよい。Reactのよさが活用できそうにないなら自分の得意なものを選択したほうが効率よい
・UIだけならMaterial Design使えばよい
・Reactやると、学習コストがReact以外に関連技術(実行環境とか)もいろいろ必要になるので大変そう。Reactのコードや学習自体が難しいわけではない
・React Native:JavaScriptで開発して、iOSとかAndroidのようなネイティブな描画ができる。

■React Native
React Native:React NativeのviewはiOSのUIViewにしてくれる。ただし、さらに関連技術(Redux/Fluxとか)の学習が必要。発展途上なので2017/10時点だといろいろと開発が大変らしい

■Material Design(CSSフレームワークとしての)関連のキーワード
Material Design Lite:Google作成。コンポーネント足りないものがややあり。これの後継になるMaterial Components for the Webが発表された
Material Components for the Web: Google作成。コンポーネントが相当豊富でなんでも揃ってる
Materialize:すごい学生さんたちがMaterial Designに則って作成。jQuery依存あり。コンポーネントが相当豊富でなんでも揃ってる。GitHub上も活発
Material-UI:Reactを使ってMaterial Designを実装となる。Call-Em-Allという会社が作成
・RailsでインストールできるGem(rubysamurai/material_design_lite-sass など)もあるが、Material Design Liteの実装自体が非常にかんたんなので、どんなシーンでこのGemを利用すべきか不明

■わかりやすい参考サイト
Rails関連
依存関係をなくそう : Rubyアプリ・Gemの開発者への提言

React関連
Rails 5.1でReact.js連携アプリを構築してみよう
react-railsを使ってReactのTutorialをやってみる
react + rails 構成パターンまとめ。npm とか bower とか一体何なんだよ!Javascript 界隈の文脈を理解しよう
React系(別言語含む)の サーバーサイドレンダリング について考えよう
シングルページアプリケーション(SPA)の導入メリット&デメリット

React Native
React Native開発のつらい点まとめ

Material Design(CSSフレームワーク)関連
マテリアルデザインをサクッと実装できるCSSフレームワーク6選【2017年版】
CSSフレームワークを使って今から始めるお手軽マテリアルデザイン