勉強会

RUNTEQ勉強会レポート vol.3　「初学者がはまりがちなパターン」

  /

みなさんこんにちは、RUNTEQです。

RUNTEQでは毎週、講師陣による勉強会が開かれています。
テーマは主に、「初学者のつまずきやすいポイント」です。

今週は、講師のだいそんが、「初学者がはまりがちなパターン」と題して、初学者がどのようなところでハマり、どんな知識が不足しているかを解説しました。

19時30分から約１時間、ZOOMにて開催された模様の一部を、イベントレポートという形で紹介したいと思います。

Contents

初学者がはまりがちなポイントにはパターンがある

だいそん
だいそん
RUNTEQで初学者を教えていると、初学者がはまりがちなポイントがわかってきました。このあたりで詰まっていませんか？　対処法まで解説するので確認してみてください！

1. 問題を適切に切り分けよう

初学者は問題が起きた場合に「一気にいろいろ試しがち」または「コードを眺めてしまいがち」です。

例えば「ログインができない」という問題があった場合、初学者は下記のログイン処理のコードを一度にいろいろ修正したり、またはずっとコードを眺めたりすることでエラーを特定しようとします。

def create
  @user = login(params[:email], params[:password])

  if @user
    redirect_to root_path, success: '成功'
  else
    flash.now[:danger] = '失敗'
    render :new
  end
end

 

エラーを特定するには、小さい単位で具体的に実行して挙動を確かめることが大切です。次のように確認しましょう。

確認項目① そもそもコントローラのこのアクションが動いているか

アクションの中のコードが適切でも、アクションが動いていなければ適切な処理を期待できません。下記のように書けば確認できます。

def create
  p '通ってる？'
end

 

標準出力に何も出力されていなければルーティングまたはクライアント側のフォームのコードに問題がある可能性が高いです。

ここに問題がなければ次に進みましょう。

確認項目② クライアントから正しくパラメータが送られてきているか

次に確認するのは、クライアントからサーバーへ正しくパラメータが送信されているかです。

②-1 paramsの使用箇所をハードコーディングしてみる

paramsを使用している箇所に、クライアント側から渡されるはずの情報を直に書いてみましょう。

def create
  @user = login('example@example.com', '12345678') # ハードコーディング

  if @user
    redirect_to root_path, success: '成功'
  else
    flash.now[:danger] = '失敗'
    render :new
  end
end

 

もしこれでログインができたのなら、ログインのエラーの原因は『クライアントから正しくパラメータが送られていない』もしくは『送られてきたパラメータをコントローラ側でうまく扱えていない』ということがわかります。

②-2 paramsの中身を確認する

『クライアントから正しくパラメータが送られていない』かどうかを確認するために、下記のようにコードを書きます。

def create
  p params
end

 

下記のような出力を得られれば、クライアント側でフォームに入力した値がサーバー側へ渡っていることがわかります。

# 説明の便宜上色々省略してます
<ActionController::Parameters {"user_sessions"=>{"email"=>"example@example.com", "password"=>"12345678"}}>

それでもログインのエラーが解決できない場合は、コントローラ側でのパラメータの扱いに問題があることがわかります。

②-3 params[:email]という書き方は適切か確認する

『送られてきたパラメータをコントローラ側でうまく扱えていない』かどうかを確認します。

def create
  p params[:email]
end
=> nil

 

上記のようにnilが出力されたらparams[:email]という書き方に問題があることがわかります。

この問題を解決するには、クライアントからサーバへのデータの送り方を変えるか（例えばname = user_sessions[:email]からname = emailに変更する）、コントローラ側でparamsの扱い方を変える必要があります（例えばparams.dig(:user_sessions, :email)のように変更する）。

コードをじっと眺めるのではなく、小さい単位で具体的に実行してエラーを特定しましょう。

2. 入力と出力を意識しよう

プログラムは全てインプットとアウトプットの組み合わせといえます。

メソッドを作成する際に入力と出力を意識しましょう。いきなりロジックを考え始める初学者が非常に多いです。

例えば『自分が投稿したコメントかどうかを判定したい』というメソッドを作るとします。入出力は次のようになります。

【入力】判定したいコメントのオブジェクト

【出力】trueかfalse

「コメントのオブジェクトを引数として受け取り、boolean型の値を返す関数」を作ることを決めてからロジックを書きましょう。

def mine?(comment)
  # ロジックはいったん置いといて
  # trueかfalseを返す
end

 

上記のように整理したら、ロジックを実際に書きます。

def mine?(comment)
  id == comment.user_id
end

 

ここで大切なのはプログラムを作成する順番です。入出力を決めてから、ロジックを考えましょう。

3. ブラウザの開発者ツールを活用しよう

不具合が起きた際にはブラウザ開発者ツールを使いましょう。
発生したエラーの原因がサーバとクライアントのどちらにあるかを特定することができます。

コンソールタブ

500番台であればサーバ側のエラーだとわかります。

 

このようなエラーはJavaScriptが原因の可能性があります。

Javascriptのエラー画像

ネットワークタブ

サーバとの通信ができているか、送信したいデータがリクエストに含まれているか、などが確認できます。

エレメントタブ

フォームタグのaction属性で送信先のURLが正しく生成されているか、などを確認しましょう。

4. ログを見よう

エラーが起きた際に、エラーログを見ましょう。

エラーログには解決のヒントが記されています。キーワードを拾ってネット検索することで解決の糸口を見つけることができます。

エラーログ画面

ただしエラーログを見ても、どのキーワードが解決のヒントなのかが初学者にはわかりません。

周辺知識を地道に勉強していく必要があります。あせらず根気よく学習を続けましょう。
信頼できるエンジニアに質問できる環境があれば、効率よく学習できるでしょう。

だいそん
だいそん
同じような箇所で詰まっていませんか？ 対処法を実践してみましょう。続いては、モデル、コントローラー、ビューでのはまりがちなポイントを解説します

この後の勉強会では、rails consoleの使い方、リクエストからレスポンスの流れの理解、REST、renderメソッドなどの細かいポイントについての解説が行われました。

RUNTEQに入っていろんな勉強会に参加しよう

RUNTEQでは、ただカリキュラムを進めるだけではなく、さまざまなテーマで勉強会を実施しています。

勉強会に参加することには多くのメリットがあります。

✔　カリキュラムで学習した知識が深まる
✔　講師や受講生と顔を合わせることで、モチベーションの維持ができる
✔　講師の共有画面で実際の挙動をその場で確認できる
✔　講師による関連情報の紹介

また、勉強会はほぼすべて録画されているので、都合が合わず勉強会に参加することができなくても大丈夫です。時間のあるときにゆっくり学習をすることができます。

RUNTEQにご興味のある方は、下記リンクより、お気軽に説明会へご参加ください。

＼今月限定のキャンペーン開催中！／

RUNTEQについて詳しくはこちら

この記事を読んだ方にオススメ