2020-10-21

pictweet作成 part3

Pictweet 削除機能

Destroyアクションを使用

以下の様な流れで設定を行う

１、ツイートを削除するためのルーティングを設定する

２、削除ボタンをビューに追加する

３、Destroyアクションをコントローラーに定義する

４、削除後のビューを追加する

１、routes.rbにdestroyアクションを定義する

resources :tweets, only: [:index, :new, :create, :destroy]

２、link_toメソッドを使用して削除ボタンをindex.html.erbに追加

削除するツイートを区別するために削除ボタンのパスにはツイートidをパラメータとして持たせる

httpメソッドはDELETEというメソッドを指定

<div class="more">
        <span><%= image_tag 'arrow_top.png' %></span>
        <ul class="more_list">
          <li>
            <%= link_to '削除', "/tweets/#{tweet.id}", method: :delete %>
          </li>
        </ul>
      </div>

＊Prefixを用いて遷移先を設定する

Prefix:パスの指定方法の一つ

# Prefix未使用
<%= link_to "link_button", '/', class: "header__title--text" %>

# Prefix使用
<%= link_to "link_button", root_path, class: "header__title--text" %>

rails routesでprefixという文字がありその配下に出てくるがこのprefix名に続けて_pathという記述を付け加える

 <%= link_to '削除', tweet_path(tweet.id), method: :delete %

今回はdestoryアクションに対するprefixがtweetということがわかる

なのでtweet_pathとする

またprefixを使用するときは”/tweets/#{tweet.id}と記述してそれぞれのツイートid(tweet/id)が入る様にする

３、destroyアクションをコントローラーに定義する

２までを行うとボタン削除ボタンが現れるがクリックしてもエラーが出る

これはdestoryアクションが定義さえれていないため

Tweetsコントローラーにdestroyアクションを以下のように定義する

def destroy

tweet = Tweet.find(params[:id])

tweet.destroy

end

処理の流れとしてはまずパラメーターを受け取ったparams[:id]をもとに削除したいツイートをfindメソッドを用いて取得

そのツイートをdestroyメソッドで削除

４、削除完了画面のビューを作成

Tweetsのディレクトリ中にビューファイルdestroy.html.erbを作成し以下のように記述

<div class="contents row">
  <div class="success">
    <h3>削除が完了しました。</h3>
    <a class="btn" href="/">投稿一覧へ戻る</a>
  </div>
</div>

2020-10-15

pictweet作成 part2

投稿機能実装

アクション名　new,createを使用

＊ルーティングを定義したらコントローラに定義する！

１、newアクションを定義する（ルーティング）

Config/routes.rbファイルで新たに:newとルーティングを記述することでhttp://localhost3000/tweets/new

にアクセスした場合にtweetsコントローラのnewアクションが実行される設定ができる

２、newアクションをコントローラに定義する

tweets_controller.rbにnewアクションを定義する

def new
    @tweet = Tweet.new
  end

３、投稿画面のビューを作成

ツイート投稿画面(new.html.erb)でform_withというヘルパーメソッドを使用する

form_with:railsで情報を送信すためのヘルパーメソッド

データベースに保存するときは以下のようにする

form_with model: モデルクラスのインスタンス do |form|

今回は

<%= form_with(model: @tweet, local: true) do |form| %> とする

これで指定しているインスタンス変数はコントローラーで定義した@tweet = Tweet.newのこと

（これをすると投稿先のパスやhttpメソッドを指定する必要がなくなる）

４、テーブルにデータを保存する処理（ルーティング）

createを使用

５、tweets_controller.rbを編集（コントローラー）

以下の様に編集する

def create
    Tweet.create(tweet_params)
  end

  private
  def tweet_params
    params.require(:tweet).permit(:name, :image, :text)
  end

①def create~でcreateアクションを定義する

②tweet_paramsというストロングパラメータを定義する

・ストロングパラメータ:フォームから入力された情報を指定して安全に受け取るための仕組み

以下はストロングパラメータで使用できるメソッド

　　-requireメソッド:取得したい情報を指定することができる

　　-permitメソッド:取得したいキーを指定

　　-privateメソッド:クラス外から呼び出せないメソッド

６、投稿完了画面のビューを作成

create.html.erbを編集

７、空のツイートが投稿できない様にバリでショーンを設定する

バリデーションはデータを登録する際に一定の制約をかけること

validates : カラム名、バリデーションの種類

今回はvalidates :name, presence:trueとすることでnameカラムがカラではないかというバリデーションを設ける

2020-08-10

pictweet作成 part1

モデル→テーブル→ルーティング→コントローラー→ビューの順に作成する

１、Tweetモデルを作成

　　rails g model tweet

２、テーブルを作成

　　テーブルとはデータベース内に作成されるデータを収納する場所のこと

　　rails g modelコマンドでモデルを作成した際にマイグレーションファイルが生成された

　　このファイルはテーブルの設計図でどのようなテーブルにするかをマイグレーションファイル内に記載しその情報を反映させることでテーブル作成及び変更ができる

①マイグレーションファイルの編集

class CreateTweets < ActiveRecord::Migration[6.0]
  def change
    create_table :tweets do |t|
      t.string :name
      t.string :text
      t.text :image
      t.timestamps
    end
  end
end

＊create_table :tweets do |t|と書かれていることから実際にtweetsテーブルを作成するという意味になる

＊t.カラムの型 :カラム名でカラムを追加することができる

string→短文の際に使用する　ex:ユーザー名、メールアドレスなど

text→長文の際に使用　ex:投稿文など

②rails db:migrateでマイグレーションを実行

③コンソール上でデータベースに値を入れるためrails cでコンソール起動

[1] pry(main)> Tweet.create(name: "takashi", text: "Nice to meet you!")
[2] pry(main)> Tweet.create(name: "ishi", text: "Hello world!")
[3] pry(main)> Tweet.create(name: "yabe", text: "railsへようこそ!")
[4] pry(main)> exit

④Sequel Proでtweetsデーブルとコンソールで追加した値があるかを確認する

３、ルーティングの設定

config/routes.rb

Rails.application.routes.draw do
  # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
  resources :tweets, only: :index
end

＊resourceメソッドは７つのアクションへのルーティングを自動で生成する

:tweetsで/tweetsのパスに対応するルーティングが生成される

onlyを加えると指定したアクション（今回の場合はindex:一覧表示)のみを設定できる

４、コントローラーを作成及び編集

①rails d controller tweetsコマンドでコントローラーを作成

②以下のようにtweets_controller.rbを編集する

class TweetsController < ApplicationController
  def index
    @tweets = Tweet.all
  end
end

＊ allメソッドでtweetsテーブル全てのレコードをインスタンス変数に代入しビューに受け渡しができるようにする

５、ビューを作成

app/views/tweets/index.html.erb

<div class="contents row">
  <% @tweets.each do |tweet| %>
    <div class="content_post" style="background-image: url(<%= tweet.image %>);">
      <p><%= tweet.text %></p>
      <span class="name">
        <%= tweet.name %>
      </span>
    </div>
  <% end %>
</div>

＊@tweetsはコントローラーに記載してあるインスタンス変数のこと

実際にはこの後レイアウトテンプレートを編集し画像ファイルを配置をする

その後rails sコマンドでhttp://localhost:3000/tweetsにアクセスすることができる