42日目 - プログラミング備忘録

Ruby on Railsにはアセットパイプラインという機能が実装されています。その役割をひと言で説明すると、「Web画面上の色塗りを楽にする機能」です。

比喩として”色塗り”と言っていますが、具体的にはWebブラウザに画面のデザインを認識させるためにHTMLに紐付くCSSやJavaScript、Imageファイルを記述・作成することです。

railsのアセットパイプラインについて解説する - Qiita

作業がしやすいように画像、javascript、css、htmlファイルを分解つしてコーディングして、最終的に1つのファイルにまとめる仕組みのこと

普段railsを使うときには意識することはありませんが、htmlファイルはapp/viewsに配置されてjavascriptファイルはapp/assets/javascriptsに配置されていると思います。

このようにファイルは分けて管理した方が、人間にとってはわかりやすいですが、最終的には全て統合して一つのファイルに統合して扱われます。さらに字を詰めることでファイルの容量を最小化する働きがあります。

普段、HTMLファイルはapp/viewsディレクトリ内に作成している。

一方で、HTMLを装飾するためのCSSファイルやJavaScriptファイルはapp/assetsディレクトリ内に作成している。

明示的に分けられていることにより、人間にとっては非常に理解しやすくなり、作業効率も高くなる。しかし、最終的にはこれらのファイルを統合する必要があるようで、その役割を担ってくれているのがアセットパイプラインのようだ。

こう理解すると、以下の引用文がよく分かるようになる。

複数のディレクトリやファイルに分かれたassetsディレクトリ内のファイルをひとつに連結・圧縮する機能

統合テスト

第5章では、ルーティングを設定し、各所にリンクを設定していく作業があった。

このときに埋め込んだリンクが、正しく動作するかどうかのテストを書いた。確かに、一つ一つリンクが正常に動作するかを確認していくことは大変だ。

統合テスト(Integration Test)というものを使い、作業の自動化をはかる。

rails g integration_test ファイル名コマンドを実行すると、以下の結果が得られる。

test/integraton/ファイル名_test.rb

出来上がったファイルに対して、実際に書いたコード。

require 'test_helper'

class SiteLayoutTest < ActionDispatch::IntegrationTest
  
  test "layout links" do
    get root_path
    assert_template "static_pages/home"
    #テストを作成した時点でroot_pathへのリンクが二箇所ある
    assert_select "a[href=?]", root_path, count: 2
    assert_select "a[href=?]", help_path
    assert_select "a[href=?]", about_path
    assert_select "a[href=?]", contact_path
  end
end

上記のコードをテストしたいときは、rails test:integrationコマンドを入力する。

ちなみに、実際にやっているときはテストに失敗してしまったのだが、link_toのpathに' 'をつけたままにしていたのが原因だった。

エラー文で調べた際に以下の記事を見つけて解決できた。深謝。

Expected exactly 2 elements matching "a[href="/"]", found 0.. のエラーメッセージ - Qiita

Bootstrap

昨日設定した、classの属性jumbotronやnavbar、btn-primaryといったものは、やはりBootstrapt特有のものだった。

Bootstrapの特徴は、アプリケーションをレスポンシブデザインにできることだ。

bootstrap-sassというgemを使い、Railsに導入する。

学習メモ

Customize and download · Bootstrap
Bootstrapが定義している変数

余談

気晴らしにプログラミング関係の話をしている動画をyoutubeで見ていたのだが、「エンジニアの適性があるかどうかの調べ方として、paizaのスキルチェックを受けて、二ヶ月でCランクに行けないと向いていないのではないかと思う」と仰っている動画を見かけた。

自分はプログラミング関係の仕事に就くことができるか非常に不安で、試しにpaizaのスキルチェックを実際にやってみたのだが、数問解くとすぐCランクになった。

やる前は一体どんなハードルの高さなのだろうかと緊張していたので、少なくともものすごく最低限の知識は身につけられていることが分かって良かった。

だからと言って何もならないのだが、paizaにはたくさんの問題が用意されていて、毎日挑戦することを日課にするのはかなりいいかもしれないと感じた。

Dランクの問題をちょこっとやっただけなのだが、一つだけちょっと時間がかかってしまった問題があったので、Dを中心にやってみながらCにも手を出してみたい。

今日の学習

GitHub

approveを受けたプルリクをマージ

Ruby on Rails

Railsチュートリアル 第5章

パーシャル(partial)

アセットパイプライン

統合テスト

Bootstrap

学習メモ

余談

Rails チュートリアル第5章