40歳の未経験者がプログラミングスクールを受講して二十一日目
2020年8月9日 学習に入るまでが長い
おはようございます。今日(8月9日、日曜日、テックキャンプはお休みですが、自習です)も朝6時30分の早朝ランニングから始まり、筋トレ、掃除、洗濯、株価チェック、ブログやインスタ、Twitterの更新をしていたら、朝11時、そろそろカリキュラムを進めたいところ
今日の学習したこと
テストコード
モデル・・・インスタンスを生成し、それがモデルに規定したどおりの挙動になるか(たとえば、バリデーションが正しく働くか)を確かめる
コントローラー・・・あるアクションにリクエストを送ったとき、想定通りのレスポンスが生成されるかどうかを確かめる
Request Spec・・・RSpecが提供している、コントローラーのテストコードを書くために特化した手法
get・・・get ○○_pathのように、どこのパスにリクエストを送りたいかを記述する。
response・・・このレスポンスで取得できる情報に、想定する内容が含まれているかを確認するこ
HTTPステータスコード・・・HTTP通信において、どのような処理の結果となったのかを示すものです。
status・・・response.statusと実行することによって、そのレスポンスのステータスコードを出力できる
body・・・response.bodyと記述すると、ブラウザに表示されるHTMLの情報を抜き出すことができる
System Spec(システムスペック)は結合テストコードを記述するための仕組みのこと
Capybara(カピバラ)はSystem Specを記述するために必要なGemです。
visit
visit 〇〇_pathのように記述すると、〇〇のページへ遷移することを表現できます。RequestSpecで学んだgetと似ていますが、getはあくまでリクエストを送るだけのことを意味し、visitはそのページへ実際に遷移することを意味します。
page・・・visitで訪れた先のページの見える分だけの情報が格納されています。後述するとおり、「ログアウト」などのカーソルを合わせてはじめて見ることができる文字列はpageの中に含まれません。
have_content・・・
expect(page).to have_content('X')と記述すると、visitで訪れたpageの中に、Xという文字列があるかどうかを判断するマッチャです。
fill_in
fill_in 'フォームの名前', with: '入力する文字列'のように記述することで、フォームへの入力を行うことができます。それでは、フォームの名前はどのように知ることができるのでしょうか。その時に使用するものが、検証ツールです。
検証ツール
ブラウザに標準で備わっている、HTMLの要素や、適用されているCSSのコードを確認することができる機能です。ブラウザで右クリックし、「検証」をクリックすると表示できます。
find().click・・・find("クリックしたい要素").clickと記述することで、実際にクリックができます。
change
expect{ "何かしらの動作" }.to change { モデル名.count }.by(1)と記述することによって、モデルのレコードの数がいくつ変動するのかを確認できます。changeマッチャでモデルのカウントをする場合のみ、expect()ではなくexpect{}となります。
current_path・・・在いるページのパスを示します。expect(current_path).to eq root_pathと記述すれば、今いるページがroot_pathであることを確認できます。
hover
find("ブラウザ上の要素").hoverとすることで、特定の要素にカーソルをあわせたときの動作を再現できます。
have_no_content
have_contentの逆で、文字列が存在しないことを確かめるマッチャです。
have_selector
指定したセレクタが存在するかどうかを判断するマッチャです。上記の例であればhave_selector ".content_post[style='background-image: url(#{@tweet_image});']"という形で記述できます。
have_link
expect("要素").to have_link 'ボタンの文字列', href: "リンク先のパス"と記述することで、要素の中に当てはまるリンクがあることを確認できます。have_linkはa要素に対して用います。
have_no_link
have_linkの逆で、当てはまるリンクがないことを確認します。expect("要素").to have_no_link 'ボタンの文字列', href: "リンク先のパス"と記述することで、要素の中に当てはまるリンクがないことを確認できます。
find_link().click
a要素で表示されているリンクをクリックするために用います。find_link("リンクの文字列", href: "URL").clickといった形で使います。find().clickと似ていますが、find_link().clickはa要素のみに対して用いることができます。
サポートモジュール
RSpecに用意されている、メソッド等をまとめる機能です。
ChatAppの実装
ChatAppを開発するフロー
以下の順で実装を行います。
1. 要件定義
次章でChatAppの企画のフローを確認します。アプリケーションを企画する擬似的な経験を積んでいただきます。
2. DB設計
3章でChatAppのDB設計を行います。その際に中間テーブルという新しい知識を学びます。この知識を用いてChatAppのDB設計をします。
3. アプリケーションの雛形の作成
4章でrails newコマンドでChatAppの雛形を作成します。その際にGitHubでアプリケーションの状態が管理できるように設定します。
4. フロント画面の実装
5章で、チャット画面のみフロントの実装を1から行います。作成手順は基礎カリキュラムと同様に、大枠を作成してから詳細の実装をします。
5. サーバーサイドの実装
6章〜9章では、本章で確認した機能を実装します。
ユーザー管理機能 → チャットルーム管理機能 → メッセージ投稿機能の順に実装します。
6. サーバーサイドのRspecテスト
実装したサーバーサイドのテストをRspecを用いて行います。
今日のまとめ
今日も朝から夜まで途中集中力がなくなり、現実逃避の時間にけど、予定のノロマはなんとか達成、そろそろ集中モード?もっと、気合入れていかないとと焦りながら、日々格闘中