0
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 1 year has passed since last update.

[初心者用]Railsチュートリアル アプリ作成〜ユーザー登録

Last updated at Posted at 2022-06-06

はじめに

Railsチュートリアルを一通り学びポートフォリオ作成に入る前に内容の確認兼、ポートフォリオをチュートリアルの内容を確認しながら作成できるよう大まかにまとめます。

プロフィール

プログラミング未経験 金融機関勤務 社会人3年目 
web系エンジニア転職のため、2022年3月ごろにProgateを初めて触りweb制作を中心に学習。

Railsチューリアルの流れ

※ポートフォリオ作成方法にの大まかな流れ関してまとめるため、環境構築やhtml cssの具体的なコード等については省略します。
アプリ名    sample_app
コントローラ名 User
モデル 

Users
id
name
email
password_digest
remember_digest

・アプリの新規作成とコントローラ、モデル作成

rails new sample_appをコマンド実行し、もとになるファイルなどを作成
rails g controller Users [アクション名]をコマンド実行し、もとになるファイルなどを作成
rails g model User name:string email:string password_digest: remember_digest:string
をコマンド実行し、モデル作成

・ルーティングの作成

root "user#home"
get  '/signup',  to: 'users#new'
resources :users(コントローラ名)

resouces を使うことで以下のようなルーティングを記載しなくても使える
gem "devise" を使って作成する際は重複してしまうので、showアクションなどは個別に記載する。

  get 'users'     => 'users#index'
  get 'users/:id' => 'users#show'
  get 'users/new' => 'users#new'
  post 'users' => 'users#create'
  get 'users/:id/edit' => 'users#edit'
  patch 'users/:id'  => 'users#update'
  delete 'users/:id' => 'users#destroy'

・viewの作成

具体的なコードによる作成方法は割愛しますが、それぞれのview作成の際に忘れそうなこと、再確認したいことを記載しています。

・アプリによって必要なviewを作成する。
コントローラ作成の際に記載したアクション名のviewはファイルが作られているので、それ以外のviewが必要な場合は自分で作成する。(上のルーティング参考)
application.html.erb にヘッダとして各ページへのリンクを記載しておくと遷移しやすくなる。
<%= link_to "Home",root_path %>

・newアクションの入力フォーム

<%= form_with(model: @user,local: true,) do |f| %>
<%= render 'shared/error_messages' %>  
 
  <%= f.label :name %>
  <%= f.text_field :name %>

  <%= f.label :email %>
  <%= f.email_field :email %>

  <%= f.label :rank %>
  <%= f.text_field :rank %>
  
  <%= f.label :password %>
  <%= f.password_field :password %>
  
  <%= f.label :password_confirmation, "Confirmation" %>
  <%= f.password_field :password_confirmation %>


  <%= f.submit "Create my account", class: "btn btn-primary" %>

・showコントローラ、view

def show
    @user = User.find(params[:id])
end 

URLの1 user/1 の数字の部分(ルーティングにも記載)のuser_idを持つユーザーを見つけ@userに代入
viewにて<%= @user.name %>などとすればユーザー情報を表記できる。

ユーザー登録

流れ
①newのviewに登録情報を入れる
②情報がcreateアクションにpostされる
③User.new(user_parames)をし、新しいユーザーを作成

①newのviewに登録情報を入れる
newのhtmlは以下のようになっている。
inputのなかで

type="text"はそのまま表示
type="email"ではスマホから入力するとき、メールアドレスに最適化された特別なキーボードが表示
type="password"ではセキュリティ上の目的のために文字が隠蔽されています

nameの値を/usersへpost

<form action="/users" class="new_user" id="new_user" method="post">

<label for="user_name">Name</label>
<input id="user_name" name="user[name]" type="text" />

<label for="user_email">Email</label>
<input id="user_email" name="user[email]" type="email" />

<label for="user_password">Password</label>
<input id="user_password" name="user[password]" type="password" />

②情報がcreateアクションにpostされる
saveできた場合はログインしユーザ画面へ、失敗した場合はrender "new"で戻す。

・作成における制限もつける
modelsフォルダのUser.rbにvalidates にて制限をつける。

  validates :name, presence: true, length: {maximum: 50}
  
  VALID_EMAIL_REGEX = /\A[\w+\-.]+@[a-z\d\-.]+\.[a-z]+\z/i
  validates :email, presence: true, length: {maximum: 255},format: {with: VALID_EMAIL_REGEX}, uniqueness: { case_sensitive: false }
  has_secure_password
  validates :password, presence: true, length: { minimum: 6 }, allow_nil: true

③User.new(user_parames)をし、新しいユーザーを作成

def create
    @user = User.new(user_params)
    if @user.save
      log_in @user
      redirect_to @user
    else
      render "new"
    end
・
・
・
 private
    def user_params
      params.require(:user).permit(:name, :email, :rank, :password, :password_confirmation)
    end

paramsハッシュでは:user属性を必須とし、名前、メールアドレス、パスワード、パスワードの確認の属性をそれぞれ許可し、それ以外を許可しない。
admin属性など他の属性をpostされないようにするため

0
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
0
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?