オリジナルアプリケーションに追加実装

プログラミングスクールの時に作成した私のオリジナルアプリケーションに追加実装

していこうと思います。

まず、アプリの概要としましては、私が11年間住んでいたニュージーランドの魅力を伝えて、いつかは旅行で行ってみたいと思ってもらうためのきっかけを作るためのものです。

写真と説明を投稿できます。

ニュージーランドって自然が豊富で、海や山や湖がびっくりするくらい綺麗で、ハイキングしたり、サーフィンやカヤックなど自然と触れ合う遊びがたくさんあります。

そこが魅力なのに、まだ日本ではあまり知られていないと感じました。

このニュージーランドの魅力を、たくさんの人に伝えて、いつかは訪れてほしいという

私の熱い思いを解決するために作成しました。

投稿されたものは写真をクリックすると詳細ページに遷移されるようになっています。

ここに、コメントできる機能をつけていきたいと思います。

こんな感じで、登録している人はコメントを投稿できます。

　登録していないとコメント出来ないようにしました。

　コメント機能を追加している時に、あれれ？？？と、曖昧な理解なのかなと思った

　箇所がありましたので、自分の復習をしながら次回の更新でシェアしていきたいなと

　思っております。

プログラミングスクールの卒業打ち上げ会!!!

プログラミングスクールを卒業して、早くも１週間ちょい経ちました。

今日はスクールのチームのみんなとオンラインで打ち上げ会。

みんな、どうしてるんだろうと、ドキドキワクワク♪

みんな、就活で大忙しみたいです。

話はほとんど就活についてでしたが、受講中はこんなにじっくり、みんなと話せたことがなかったので良かったです。

そして、スクールの後、すぐに就活で休む暇なくで慌ただしく一息つくことさえも忘れていたので、久しぶりにのんびり、お話だけに集中できたのも良かったです。

チームのみんなが就活頑張ってるので、私も頑張るぞ！！！

仲間がいるって良いですね♪

検索機能があったら便利ですよね。

オリジナルアプリケーションに、検索機能があったら良いなと思い勉強していました。

私のオリジナルアプリケーションは、投稿するものなので検索ができたら、見たい投稿がすぐに探し出せて便利だなと思いました。

これから投稿が増えたら、検索できなかったら大変ですね

まずはフォームの作成からです。

app/views/posts/index.html.erb

<%= form_with(url: search_posts_path, local: true, method: :get, class: "search-form") do |form| %>
  <%= form.text_field :keyword, placeholder: "投稿を検索する", class: "search-input" %>
  <%= form.submit "検索", class: "search-btn" %>
<% end %>

form_with の text_field と submit を使って検索窓と検索ボタンを作成しました。

次にルーティングの設定です。

今回は”search”という命名で、７つの基本アクション以外のアクションを定義します。

今回の検索機能の場合、詳細ページのような:idを指定して特定のページにいく必要がないため、collection  を使用してルーティングを設定します。

config/routes.rb

Rails.application.routes.draw do
  devise_for :users
  root to: 'posts#index'
  resources :posts do
    resources :comments, only: :create
    collection do
      get 'search'
    end
  end
  resources :users, only: :show
end

次にモデルに、検索する処理を記述した searchメソッドを定義します。

app/models/post.rb

class Post < ApplicationRecord
  validates :text, presence: true
  belongs_to :user
  has_many :comments

  def self.search(search)
    if search != ""
      Post.where('text LIKE(?)', "%#{search}%")
    else
      Post.all
    end
  end
end

where メソッドと LIKE句を使用します。

もし検索フォームに何も入力せずに検索ボタンを押すと、引数で渡される search の

中身は空になります。その場合は else に該当し、その時の全ての投稿を取得して表示させます。

次はコントローラーに search アクションを定義します。

app/controllers/posts_controller.rb

class PostsController < ApplicationController
  before_action :set_post, only: [:edit, :show]
  before_action :move_to_index, except: [:index, :show, :search]

  ＃中略＃

  def search
    @posts = Post.search(params[:keyword])
  end

  private
  def post_params
    params.require(:post).permit(:image, :text).merge(user_id: current_user.id)
  end

  def set_tweet
    @post = Post.find(params[:id])
  end

  def move_to_index
    unless user_signed_in?
      redirect_to action: :index
    end
  end
end

Postモデルに書いた search メソッドを呼び出しています。

searchメソッドの引数に params[:keyword] と記述して、検索結果を渡しています。

未ログイン時にトップページへリダイレクトされるのを回避するために before_actionの

except オプションに :search を追加しました。

次に検索結果が表示できるようにします。

search.html.erb を作成します。

app/views/posts/search.html.erb

<%= form_with(url: search_posts_path, local: true, method: :get, class: "search-form") do |form| %>
  <%= form.text_field :keyword, placeholder: "投稿を検索する", class: "search-input" %>
  <%= form.submit "検索", class: "search-btn" %>
<% end %>
<div class="contents row">
  <% @posts.each do |post| %>
    <%= render partial: "post", locals: { post: post } %>
  <% end %>
</div>

これで検索機能は完成です。

ルーティングネストってどんなときに使う？

オリジナルアプリケーションの追加実装でコメント機能を追加できたら良いなと思い、

勉強していました。

投稿してある写真にログインしている人はコメントを残せる機能です。

せっかく投稿した写真、みんなの反応、気になると思うんです。

そこで必要になってくるのが”ルーティングネスト”です。

プログラミング初心者がつまずきやすいところだと思うので、頑張ってシェアしていきたいと思います。

ルーティングにおけるネストとは、あるコントローラーのルーティングの中に、別のコントローラーのルーティングを記述することです。

親子関係を作るわけです。

Rails.application.routes.draw do
  resources :親となるコントローラー do
    resources :子となるコントローラー
  end
end

ある人が写真を投稿した時に、その投稿に対しコメントしたい時、postコントローラーのルーティングの中に、commentsコントローラーの記述を書くことで、どの投稿に紐づいたコメントなのかをURLで判断できるようにしています。

Rails.application.routes.draw do
  resources :posts do
    resources :comments, only: :create
  end
end

doとendで挟むことで、ルーティングをネストさせることができました。

rails routesでURLを確認できます。

ターミナル

1 2 3 4

Prefix Verb URI Pattern Controller#Action # 中略 post_comments POST /posts/:post_id/comments(.:format) comments#create

ルーティングをネストさせるメリットは、「URL設計」と「関係性があるもの同士の紐付け」の２点です。

今日から学習したことをブログでシェアしていきます。

こんにちは。

今日はRuby on Railsの部分テンプレートについて、改めて便利だなぁと思いましたので、みなさんにシェアできたらと思います。

まず、部分テンプレートとは、ビューファイルにおいて繰り返し使用するコードを切り出し、再利用する仕組みのことです。　コードがすっきりまとまるということと、複数箇所で使用されている部分に変更があった際でも、１つのファイルの編集だけで済むというメリットがあります。

_◯◯.html.erbファイルを作成し、その中に繰り返し使用するコードを貼り付け、renderメソッドを使って呼び出します。

<% render partial: "sample" %>

このように”partial”というオプションを付け、部分テンプレートを指定することで、該当する部分のテンプレートを表示できます。

さらに”locals"というオプションをつけることで、部分テンプレート内で、その変数を使えるようになります。

<% render partial: "sample", locals: { post: "hello!" } %>

これで"hello!"が"post"に代入されました。

<%= form_with(model: post, local: true) do |form| %>
  <%= form.text_field :image, placeholder: "Image Url" %>
  <%= form.text_area :text, placeholder: "text", rows: "10" %>
  <%= form.submit "SEND" %>
<% end %>

これで先ほどlocalsオプションで代入したpostをモデルオプションに指定することで

取り出せるようになりました。

複数ページで利用する表示は、ぜひ部分テンプレートを活用して可読性をあげましょう。

Ruby on Rails を学習していて、たくさん可読性を上げるためのメソッドがあるなと
思いましたので、今後もみなさんとシェアして、一緒に勉強していけたらと思います。

就活で気づいたこと。

　ここ数日、就職活動を頑張っています。

　色々な企業さんのWebサイト、拝見させに行かせてもらっていて、すごいなと

　思った企業さんはブログがすごいです。

　現役で働かれてる方々がブログで、勉強されたことを発信されてるんです。

　内容もきっちりされててすごかったですし、びっくりしました。

　ものすごい向上心だと思いますし、そんな方々ともし一緒に働けたらすごく

　良い影響を受けるだろうと思いましたし、自分の成長も早いんだろうなと

　思いました。

　私も、プログラミングスクールで学んだことや、これから学んでいくことを

　ここで少し発信できたな良いなと思いましたので、徐々にそんな投稿も

　して行こうと思います!!!!

母に感謝できるようになった自分。

　

　今日はいつもと少し違うテーマで書いてみます。

　というのも、私、今日で39歳になりました：）

　昔から特にお祝いとか特別なことするわけではないので、そこまで気にして

　生きてきてなかったんですけど、ここ２-３年、母に感謝するように

　なりました。

　産んでもらったこととか、育ててもらったこととか、私が英語もできないのに

　海外に行く時もただただ応援して背中を押してくれたこととか、また日本に

　帰国したら快く受け入れてくれて、ご飯作ってくれたり.......

　家、母子家庭で３人兄弟だし、すごい大変だったと思うんですよ。

   親ならしてくれて当たり前とか思っていたんですけど.......すごいですよね。

  ということで、今日は母にお花を買ってきて”ありがとう”を伝えました。