#GWアドベントカレンダー「1つサービスを作る」の4日目記事情報の追加1

以下の GWアドベントカレンダー「1つサービスを作る」の4日目記事です。

gw-advent.9wick.com

情報の追加をしていきます。
具体的にはプロフィール画面に、ウェブサイト情報などを追加できるようにしていきます。

Webサイトテーブル

Webサイトテーブルを作ります。

rails generate model website user:references title:string url:string kind:integer sort:integer

忘れずに userモデルにhas_manyを追加します。

class User < ApplicationRecord
  has_many :websites, dependent: :destroy
  accepts_nested_attributes_for :websites

  # 途中省略
end

データベースを初期化しておきます。

rails db:migrate:reset

編集画面

編集画面を作ります。

app/controllers/users_controller.rb を編集します。

  def edit
    @user = User.left_joins(:websites).find(params[:id])
  end

ここでは websitesテーブルを外部結合で呼び出しています。

app/views/users/edit.html.erb を新規作成する。

<div class="container">
  <div class="media">
    <a href="<%= @user.twitter %>" class="align-self-start mr-3">
      <img src="<%= @user.image %>">
    </a>
    <div class="media-body">
      <h5 class="mt-0"><%= @user.name %></h5>
      <p><%= @user.description %></p>
      <p><%= @user.website %></p>
      <p><%= @user.twitter %></p>

      <%= form_with model: @user do |f| %>
        <%= f.fields_for :websites do |w| %>
          <div class="form-row">
           <div class="form-group col-md-4">
             <%= w.label :title %>
             <%= w.text_field :title %>
           </div>
           <div class="form-group col-md-4">
             <%= w.label :url %>
             <%= w.text_field :url %>
           </div>
          </div>
        <% end %>
        <%= f.submit "更新", class: "btn btn-primary" %>
      <% end %>
    </div>
  </div>
</div>