はじめに
ポートフォリオ制作の振り返りを、Qiitaでアウトプットしながら進めています。
制作しながらのリアルタイム発信じゃないので色々と端折っているところがあるかもしれないです。
前回までで「投稿機能」を作り、投稿の一覧や詳細を表示できるようになりました。
今回は ユーザーのプロフィールページを作る ことで、ユーザーごとに自己紹介や状態を持たせられるようにしていきます。
これまでの記事はこちら👇
ポートフォリオ構築の振り返り（第1回：プロジェクト概要と設計）
ポートフォリオ構築の振り返り（第2回：Railsアプリ立ち上げ〜トップページ表示）
ポートフォリオ構築の振り返り（第3回：Deviseでログイン機能を実装）
ポートフォリオ構築の振り返り（第4回：ヘッダーの作成とログイン機能の実装）
ポートフォリオ構築の振り返り（第5回：投稿機能と画像投稿フォームの作成）
ポートフォリオ構築の振り返り（第6回：投稿機能の作成）
手順の流れ
今回やったことは次の通りです。
- User モデルに新しいカラムを追加（name, profile, status）
- ユーザープロフィールページ（show）の作成
- プロフィール編集ページ（edit）の作成
- enum を使ったステータス管理
1. Userモデルにカラムを追加
マイグレーションの作成
まず、ユーザー情報を保存するためのカラムを追加します。
rails g migration AddColumnsToUsers name:string profile:text status:integer
ここでは、
-
name… 名前（文字列） -
profile… 自己紹介（文章） -
status… ユーザーの状態（数値で管理し、後でenumにする）
を追加しています。
マイグレーションの反映
rails db:migrate
これで users テーブルにカラムが追加されました。
2. ユーザープロフィールページ（show）の作成
ルーティング
config/routes.rb に追記します。
resources :users, only: [:show, :edit, :update]
→ users/:id にアクセスするとプロフィールが表示されるようになります。
コントローラ
app/controllers/users_controller.rb を作成します。
class UsersController < ApplicationController
before_action :set_user, only: [:show, :edit, :update]
def show
end
def edit
end
def update
if @user.update(user_params)
redirect_to @user, notice: "プロフィールを更新しました。"
else
render :edit
end
end
private
def set_user
@user = User.find(params[:id])
end
def user_params
params.require(:user).permit(:name, :profile, :status)
end
end
-
show… プロフィールを表示するページ -
edit… プロフィールを編集するページ -
update… 編集内容を保存する処理
before_action を使って、共通の処理（@user = User.find(params[:id])）をまとめています。
ビュー（show）
app/views/users/show.html.erb
<h2><%= @user.name %>さんのプロフィール</h2>
<p><strong>自己紹介:</strong> <%= @user.profile.presence || "未設定" %></p>
<p><strong>ステータス:</strong> <%= @user.status %></p>
<%= link_to "プロフィールを編集", edit_user_path(@user), class: "btn btn-primary" %>
-
@user.nameで名前を表示 -
@user.profile.presence || "未設定"とすることで、自己紹介が空の場合は「未設定」と表示
3. プロフィール編集ページ（edit）
次に、プロフィールを編集できるページを作ります。
ビュー（edit）
app/views/users/edit.html.erb
<h2>プロフィールを編集</h2>
<%= form_with(model: @user, local: true) do |f| %>
<div>
<%= f.label :name, "名前" %><br>
<%= f.text_field :name %>
</div>
<div>
<%= f.label :profile, "自己紹介" %><br>
<%= f.text_area :profile %>
</div>
<div>
<%= f.label :status, "ステータス" %><br>
<%= f.select :status, User.statuses.keys.map { |s| [s, s] } %>
</div>
<div>
<%= f.submit "更新する", class: "btn btn-success" %>
</div>
<% end %>
-
form_withでフォームを作成 -
f.text_field :nameで名前入力欄 -
f.text_area :profileで自己紹介欄 -
f.select :statusでステータスをプルダウンで選べるように
4. enumの設定（status）
status をただの数字で管理するのは分かりづらいので、enum を使います。
モデル設定
app/models/user.rb
class User < ApplicationRecord
# Deviseのモジュール省略
enum status: { active: 0, deactivated: 1, withdrawn: 2 }
end
-
0→"active" -
1→"deactivated" -
2→"withdrawn"
というように自動で変換され、@user.status と書くだけで文字列が返るようになります。
ちなみに、登録中、ユーザーによる退会、管理者削除に分けました！
管理者側でユーザーを把握する上で、どのような理由で退会となったかはマーケティングに必要だと思ったからです！
まとめ
今回は ユーザープロフィールページの作成とカラムの追加 を行いました。
- Userモデルに
name,profile,statusを追加 - show ページでプロフィールを表示
- edit ページでプロフィールを編集
- enum でステータスをわかりやすく管理
これで、ユーザーが自分の情報を登録できるようになりました。
次回は、部分テンプレートを利用して、「誰が投稿したのか」 がわかるようにプロフィール表示を作っていきます！
ポートフォリオ構築の振り返り（第8回：部分テンプレートを使ったマイページ作成）
用語解説
マイグレーション（migration）
データベースの設計図を変更するための仕組み。
「テーブルを作る」「カラムを追加する」などの作業をコードで管理でき、rails db:migrate を実行すると実際のデータベースに反映される。
カラム（column）
テーブルの「列」にあたる部分。
例えば users テーブルなら、name, email, profile などがカラムになる。
「ユーザーにどんな情報を保存するか」を決める役割。
ルーティング（routing）
「どのURLにアクセスしたら、どのコントローラ・アクションを呼ぶか」を決める設定。
例：/users/1 にアクセス → UsersController の show アクションが実行される。
コントローラ（controller）
リクエストを受け取って処理を行う場所。
「どのユーザーを表示するのか？」「どんなデータを渡すのか？」を決めてビューに渡す役割。
ビュー（view）
ユーザーに見せる画面。
Railsでは .html.erb というファイルを使って、HTMLの中にRubyコードを書ける仕組みになっている。
form_with
Railsでフォームを作るためのヘルパーメソッド。
「どのモデルを編集するのか」「どんな入力欄を出すのか」を簡単に書ける。
enum（列挙型）
データベースでは数値で管理しながら、コード上ではわかりやすい名前で扱えるようにする仕組み。
例：
- DBには
0が入っているけど、コードではuser.active?と書ける。 - 退会済みなら
user.deactivated?のようにチェックできる。
before_action
コントローラで共通処理をまとめる仕組み。
例えば set_user を show, edit, update で毎回書く代わりに、before_action :set_user で一括指定できる。