1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

[Ruby]layoutsファイルと7つのアクション

Last updated at Posted at 2021-07-26

はじめに

本記事は、本日私が理解できていなかった
「layouts」ファイルの中身について書きました。
今回は、これに何時間もかかりましたので、備忘録として投稿します。

# layoutsファイルには
具体例

<!DOCTYPE html>
<html>
  <head>
    省略
  </head>
  <body>
    <header class="header">
      <div class="inner">
        <div class="nav">
          <div class="nav__left">
            <%= link_to image_tag("logo.png", class: :logo), root_path %>
          </div>
          <% if user_signed_in? %>
            <div class="nav__right">
              <%= link_to "ログアウト", destroy_user_session_path, method: delete, class: :nav__logout %>
              <%= link_to "New Proto", root_path, class: :nav__btn %>
            </div>
          <% else %>
            <div class="nav__right">
              <%= link_to "ログイン", new_user_session_path, class: :nav__btn %>
              <%= link_to "新規登録", new_user_registration_path, class: :nav__btn %>
            </div>
          <% end %>
        </div>
      </div>
    </header>
    <%= yield %>
    <footer class="footer">
      <p class="copyright">Copyright © ~~~ All rights reserved.</p>
    </footer>
  </body>
</html>

このように、

<html>
  <head></head>
  <body>
    <header></header>
    <footer></footer>
  </body>
</html>

という記述になるファイルになります。
つまり、ブラウザ上に表示されるものに直結すると考えても良いと思います。

勘違いしていたこと

当時、私は、「新規登録ボタン」からユーザー登録ができるようコードを書いておりましたが、
一向に新規登録画面に遷移することはありませんでした。

理由としては、
createアクションで、app>views>registrations>newのファイルにユーザーが情報登録するためのURLをコードに記述しただけだったためです。

<div class="main">
  <div class="inner">
    <div class="form__wrapper">
      <h2 class="page-heading">ユーザー新規登録</h2>
        <%= form_with model: @user, url: user_registration_path, local: true do |f| %>

        省略
     
    </div>
  </div>
</div>

原因

完全に理解していたと思われた
7つのアクションの役割を正確に理解していなかったことから、
このようなミスに繋がったと考えます。

###改善策
・再度、7つのアクションについての役割を分析する。
・今後もこのようなことが起きないように注意する。
・注意の方法として、7つのアクションそれぞれに関連深いものも確認しておく。

この3つに焦点を当てて、復習します。

終わりに

初心者がまず失敗してしまうミスという感じがします。

ここからは理解したことをさらに深く、
知識の肉付けをどんどん実施していきたいと思いました。

以上です。
引き続き頑張ります!

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?