読者です 読者をやめる 読者になる 読者になる

ぞえの技術めも

Ruby on Rails勉強中

【79日目】【1日20分のRailsチュートリアル】【第8章】ログイン状態によってレイアウトを変更する

Ruby on Railsチュートリアル(第3版)

今日は「8.2.3 レイアウトリンクを変更する」から。

8.2.3 レイアウトリンクを変更する

ログイン機能の最初の具体的な応用として、ユーザーがログインしているときとそうでないときでレイアウトを変更してみましょう。

ログイン状態をチェックして生成するHTMLを変える処理を実装する。

こういうケースではまずテストを書くらしいけどチュートリアルなので実装→テストの順で。

まずはログイン状態をチェックするメソッドを追加。

app/helpers/sessions_helper.rb

  :
  # ユーザーがログインしていればtrue、その他ならfalseを返す
  def logged_in?
    !current_user.nil?
  end

リスト8.15を追加したので、ユーザーのログイン時にレイアウトを変えられるようにする準備ができました。

さっき追加したlogged_in?メソッドを使ってレイアウトを追加。

app/views/layouts/_header.html.erb

<header class="navbar navbar-fixed-top navbar-inverse">
  <div class="container">
    <%= link_to "sample app", root_path, id: "logo" %>
    <nav>
      <ul class="nav navbar-nav navbar-right">
        <li><%= link_to "Home", root_path %></li>
        <li><%= link_to "Help", help_path %></li>
        <% if logged_in? %>
          <li><%= link_to "Users", '#' %></li>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
              Account <b class="caret"></b>
            </a>
            <ul class="dropdown-menu">
              <li><%= link_to "Profile", current_user %></li>
              <li><%= link_to "Settings", '#' %></li>
              <li class="divider"></li>
              <li>
                <%= link_to "Log out", logout_path, method: "delete" %>
              </li>
            </ul>
          </li>
        <% else %>
          <li><%= link_to "Log in", login_path %></li>
        <% end %>
      </ul>
    </nav>
  </div>
</header>

レイアウトに新しいリンクを追加したので、リスト8.16にBootstrapのドロップダウンメニュー機能8を適用できる状態になりました。
(中略)
Railsのアセットパイプライン用のapplication.jsファイルでBootstrapのカスタムJavaScriptライブラリをインクルードします。

ドロップダウンメニューもclassを指定するだけでいいのか…。便利。

ライブラリのインクルードは必要なので下記コードを追加。

app/assets/javascripts/application.js

//= require bootstrap

ログインパスにアクセスして有効なユーザーとしてログインできるようになっているので

サーバーを起動して動作確認してみる。

$ rails server -b $IP -p $PORT

プルダウンメニューが表示できました。

f:id:kt_zoe:20161128123452p:plain

ブラウザを完全に終了すると、期待どおりアプリケーションのログインステータスが消去され、再びログインを要求されるようになったことを確認できます。

別ウィンドウで開いて、そのウィンドウを閉じるだけでは消去されないっぽい。
ブラウザ完全終了は試していないけど大丈夫でしょ。たぶん

今日の作業時間は【20分】

次は「8.2.4 レイアウトの変更をテストする」から。