この記事は文字のみのため理解しづらい部分があるかと思います。
完全に自分自身のアウトプットのためなので読みにくいなと感じたらこちらの記事を参考にしてください。
アセットパイプラインについて
そもそも前提としてRuby on Railsはどのようなアプリケーションを開発する際にも
共通して作成する必要がある物を自動的に作ってくれているフレームワークです。
例えばメールのテンプレート文なんかは御中だとか一番下の行には自身の詳細情報を載っけていたりしますよね。Ruby on Railsも同じで作業を効率化するためにフォーマットを用意してくれます。
私たちが画面越しに情報を見れているのはHTMLの情報をみていますよね。css, JavaScriptなんかはその情報を鮮やかにしてくれます。
そのHTMLとCSS、JavaScriptが紐付かせることによって私たちは情報を見れます。。Ruby on Rails では、この仕組みがアセットパイプラインによって実現されるようになっています。
初学者の私はherokuにデプロイした際レイアウトが崩れたりjsがうまく働いてくれなかったりします。
理由としてはローカルの環境とアセットパイプラインの挙動が違うことが挙げられるみたいです。
アセットパイプライン仕組みについて
アセットパイプラインはRails内で使用したいファイルを分割してコーディングできるように設定して最終的にそれらのファイルを一つにしてしまうという仕組みです。
私のイメージは新世界に入るためにそれぞれもっと強くなるべく二年間修行してシャボンディ諸島で集まった麦わら一族をイメージしています。
詳しく書くと
ビューディレクトリのルフィもjsディレクトリのゾロも最終的にはアセットパイプラインする（メリー号に集まる）みたいなイメージです。
このようにディレクトリ、ファイルを分けるのは開発者に何がどこに記載されているか分かりやすくさせるためにしているという認識で良いでしょう。
しかしそれらのディレクトリをそのまま一つのwebページとして扱うことはできません。なのでアセットパイプラインをして一つにまとめているのですね。
HEROKUでよくつまずきやすいのは開発環境はdevelopment環境が使われてheroku上では本番環境であるproduction環境が使わます。
アセットパイプラインの仕組みを通って生成されたファイルは、Ruby on Rails 内部では開発環境と本番環境用で別々のものとなります。
注意すべきことは、通常本番環境ではアセットパイプラインを通る処理が自動実行されないことです。Heroku上に送付されたWebアプリケーションを何もせずにただ動かそうとすると、CSSやJavaScriptなどが反映されない状態になります。
これらを解決する最も良い方法が本番環境上でアセットパイプラインを自動で通るように設定を変更する方法です。
config/production.rbファイル内の記述のうち
config.assets.compile = false
の記述を見つけ、「falseをtrueに書き換えて」保存します。
この記述で本来自動実行されないアセットパイプラインの処理を自動でやってくれます。