Ruby関連のことを調べてみた2021年08月27日

[axios] ファイルダウンロードができない or 空ファイルになってしまう現象の解消

フロント側はReact、サーバーサイドはRailsでファイルダウンロードが
うまくいかないケースがあり、それを解消した記事内容になります。

症状としては、axiosのissueにあったこのケースに当たります。
[Github | axios/axios | Empty response when responseType is blob or arraybuffer.](https://github.com/axios/axios/issues/1392)

サーバーサイドとフロント部分の結合部分なので、
原因の特的ができていなくて引っかかってる人が多そうですね。

私のケースの場合は、railsでheadの記述が不要だったのですが、
それだけじゃよくわからないと思います。
実装をみながら解消方法をみていきましょう。

## フロント側の記述

フロント側は以下のようなコードにしています。

“`
$ yarn add file-saver
“`

“`tsx
import { saveAs } from ‘file-saver’;
~~

export const fil

【Ruby on rails】JavaScript 非同期通信のコメント機能でエラーメッセージを出す　バリデーション

初めに

非同期通信でのコメント機能は実装ずみで、「40１字以上のコメント」はNGというバリデーションは、
かけていたものの、エラーメッセージが出るようにしていませんでした・・・。
少し実装に苦労はしたものの、非同期通信への理解が深まったのでまとめていきます！！


バリデーションをかけておく

“`perl:app/models/post_comment.rb
class PostComment < ApplicationRecord default_scope -> { order(created_at: :desc) }
# あるコメントに紐づくユーザーも記事も１
belongs_to :user
belongs_to :post

v

【Ruby on Rails】デプロイ後、本番環境で画像が表示されない不具合を解消する方法

#対象者

* ローカル環境で表示される画像が本番環境で表示されない方

#目的

* 本番環境でも問題なく画像を表示させる

#実際の手順と実例
###1.前提

ruby 2.5.1
rails 5.2.5
AWS

* app/assets/imagesの中に画像が保存されている
* 自動デプロイできている状態

###2. 結論

変更前

““

““

↓↓↓

変更後

“`
<%= image_tag asset_path("search.png", alt: "") %>
“`

これで実装完了です！

###3.原因

本番環境では、画像もコンパイルされることが原因のようです。

※コンパイルとは、ソースコードを機械語に翻訳する作業のこと

本番環境ではパス名と画像の名前が変わっちゃうので
両方に対応できるasset_path()を使い、解決できました！

#参照

>[【ちゃんと理解してる？】コンパイル、ビルド、デプロイの違い](https://cheat.co.jp/

【Ruby on Rails】gem, bundlerって？

# この記事について

この記事は、筆者がRuby on Railsを学習・使用する中で疑問に思った`bundle` コマンドについて、どういった意味があるのかという内容をまとめていきます。

まだまだ初学者ではあるので、なにか間違った理解等ございましたらぜひご指摘いただけますと幸いです。

# bundlerとは

プロジェクト内で使用するgemのパッケージ管理ツール。

gemのバージョンやgemの依存関係を管理してくれる「gem」

## bundlerの特徴

1. bundlerを使ってgemをインストールすると、gem同士の互換性を保ってくれる。
2. Gemfileという1つのファイルにgemを書くので、gemの管理がしやすい
3. Gemfileを使ってアプリごとにgemを管理できる
4. 環境ごとにインストールするgemを管理できる
5. gemの互換性を保ってくれる。Gemfileさえ共有すれば複数人での開発でもエラーを起こさない

参考

[https://pikawaka.com/rails/bundler](https://pikawaka.com/rails

「Could not detect rake tasks！」Herokuでデプロイエラー（メモ）

#Herokuデプロイ時のエラーコード

“`
Could not detect rake tasks
ensure you can run `$ bundle exec rake -P` against your app
and using the production group of your Gemfile.
rake aborted!
NameError: uninitialized constant Dotenv
“`

#解決方法

Gemfileの開発環境のテストに`dotenv-rails`を追加

“`
group :development, :test do
gem ‘dotenv-rails’
end
“`

`config/application.rb`に以下を追記

“`
Bundler.require(*Rails.groups)
if [‘development’, ‘test’].include? ENV[‘RAILS_ENV’]
Dotenv::Railtie.load
end
“`

以上。

【Rails】掲示板コメント機能実装（メモ）

#　目標
###　コメント機能の実装

[](https://gyazo.com/8b971d580120bd020f316bde87e15df4)
#　環境
* Rails: 6.1.3
* ruby: 3.0.0
* mac: os

#　前提
* 掲示板投稿機能実装済み
* 投稿テーブル名post

#　実装
##　１．モデルを作成
“`ruby:ターミナル
$ rails g model Comment comment:string post:references
“`
生成されたマイグレーションファイル。
今思えばモデル名もコメント名もcommentで紛らわしくしちゃった気がします。。

“`ruby:
class CreateComments < ActiveRecord::Migration[6.1] def change create_table :comments do |t| t.st

Time.zone.todayってTimeクラスに話しかけたのになぜDateクラスが返ってくるのか？

# たまげたこと
こんなRailsのコードがあります。

“`ruby
Time.zone.today
“`

Timeにtodayなんて名前のメソッドを使えるからなんか違和感を感じておりまして。
興味本位で、このインスタンスに「君のクラスは？」と尋ねてみたら、**Dateクラスのインスタンスが返ってきてたまげました**。


僕はTimeクラスさんに話しかけたはずなのに。。なぜなんだ！？
いつの間にDateクラスさんにすり替わってるのだ！？

順を追って整理したいと思います。

### 環境
ruby 3.0.0
Rails 6.0.3

## １、Time#zoneとは？

Time#zoneはTimeZoneクラスのインスタンスを生成するそうな。

>zone()
Returns the T

ポイント機能・レベルアップ機能　もらったいいね数をマイページで表示させたい！　非同期通信のいいね

初めに

ポイント機能というかレベルアップ機能というか・・・
Qiitaでもコントリビューションが増えるとやる気につながるので、
そういった機能を作成したいと思いました。
そんなわけで、自分の記事についたいいね数をマイページで出せるようにしていきます！！
やり方は通知機能と似ているなーと感じました。

(TEUっていうのは、コンテナの数え方です。マニアック・・・）
ついでにこんなのも作れます！

![スクリーンショット 2021-08-26 18.06.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633266/b5b00502-fb5a-4f3f-0b75-60f50430ad70.pn

ReactコンポーネントのonClick内で使うループカウンタ変数は必ずlet宣言しよう

#はじめに
letではなくvarで宣言してしまったfor文中の i (ループカウンタ変数) をReact コンポーネント中のonClick内で使用したところ挙動がわからずハマったので備忘録として共有します.
そもそもループカウンタをvarで宣言するなんて危険なことするなよ, と今では思いますがハマって初めて両者のスコープの違いを骨身に染みるほど理解できました.

“`
【動作環境】
Rails 6.1.4
react-rails の gemを使用
“`

#1. varで宣言しためにうまく動作しなかったコード
propsで配列を受け取り, それを全て一覧で表示させるため以下のようなコードを書きました.
期待する動作としては, ボタンをクリックするとそのボタンの値がhookで宣言したclickedContentという変数に代入され表示されるというものです.

“`react
import React, { useState } from ‘react’;

function Example() {
const [clickedContent, setClickedC

Ruby on rails モデルにアクションを記述する（belongs_toとhas_many)使い方

usersテーブルに対して、commentsテーブルは多く紐づいており、
commentsテーブルに対して、usersテーブルは一つだけ紐づいている。
という場面がある。
その場合はモデルにアクションを記述し
関連づけを行う。このことをアクションという。

一つだけ紐づく場合belongs_to

“`
belongs_to :モデル単数形
“`

多く紐づく場合はhas_many

“`
has_many :モデル複数形
“`

また、REDME!に記載する時は”Association”
に記載するとわかりやすい


rails db:migrateコマンドとmigrateファイルの記述について

マイグレーションの状態を調べるコマンド

“`
rails db:migrate:status
“`

マイグレーション実行するコマンド

“`
rails db:migrate
“`

マイグレーションの状態を一つ下げるコマンド（down）

“`
rails db:rollback
“`

「実際にpostsテーブルを作成する」という仕様がマイグレーションファイルに記載

“`
create_table :posts do |t|
“`

カラムの形を入力：カラム名、NOT NULL制約

カラム名を指定するとともに、そこにどんなデータが入るのかを示す「型」も指定する必要

“`
t.型 :カラム名,　　　　　　　　　　　　　　　　 null: false
“`

カラムの型↓
＜integer　＞　　　数値　　　金額、回数など
＜string　　＞　　　文字(短文)ユーザー名、メールアドレスなど
　＜　text　＞　　　　　文字(長文)投稿文、説明文など
　＜boolean＞　　　真か偽か、はい・いいえの選択、合格・不合格のフラグなど
　＜datet

Rubyの変数（ローカル変数）代入ルールまとめ

###基本ルール

“`ruby
変数名 = 文字列、値
name = “taro”
age = 27

#値を代入せず変数名だけを宣言するとエラーになる
name #error

#変数を宣言するには何かしらの値を代入する必要がある
name = nil

#アンダースコアで変数名を書き始める（あまり使われない）
_special_price = 200

#変数名に数字を入れる
special_price_2 = 300

#変数名は慣習として小文字のスネークケースで書く
special_price = 200

#キャメルケースは使わない（エラーにはならないが一般的ではない）
specialPrice = 200

#数字から始まる変数名は使えない（エラーになる）
2_special_price = 200

#一般的ではないが変数名に漢字も使える
特別価格 = 200
“`

###複数代入のルール

“`ruby
#2つの値を同時に代入する
a, b = 1, 2
a \=> 1
b \=> 2

#右辺の数が足りない場合はnilが入る

form_withヘルパーを用いて投稿できない時の対処法

#はじめに
勉強時のアウトプットとして記載します。
フォームを作る際にform _withヘルパーをよく使うと思いますが、エラーが起きた際に試みた対処法を紹介します。

#対処法

##①formの入れ子を訂正

基本的にform要素の入れ子は禁止されています。
divタグなどをform要素の途中段落に割り込ませていたことがあり、それが原因でデータが送れたり、送れなかったりしました。詳しくは下記を参照してください。

https://ja.stackoverflow.com/questions/30651/form%E3%82%BF%E3%82%B0%E3%81%AE%E5%85%A5%E3%82%8C%E5%AD%90%E3%81%A8%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%83%BC%E3%81%AE%E8%A7%A3%E9%87%88

##②form_withメソッドの見直し

form_withの書き方

データベースに保存しない場合(一部データの更新する場合とか)
<%= form_with url: "url名", method:

Shopify CLIでrails createしたらcannot load such file — nokogiri/nokogiriのエラーが発生したがBundlerの設定を変更して対応できた

Shopify CLIを使いたくてプロジェクトを作るほぼ最初からハマった。
Shopify CLIの問題では無いが次に同じようなことで時間を無駄にしないためにメモ。

# 環境

– MacBook Pro (16-inch, 2019)
– CPUはIntel Core i9
– macOS Big Sur (11.5.2)
– Shopify CLI 2.2.2
– Homebrewでインストールできる最新版 (2021/08/25 現在)
– Ruby 2.6.3 (OS標準)
– Bundler 1.17.2
– Node.js / Yarnは多分動けば大丈夫だと思う (が一応バージョンも記載)
– Node.js 14.17.0
– Yarn 1.22.10

普段は `rbenv` を使ってプロジェクトに応じてRubyのバージョンを切り替えているが `shopify rails create` で何かしらエラーが出ていたのでとりあえずOS標準のRubyを使うようにしています。
Shopify CLIはHomebrewでインストール済み

Ruby 繰り返し処理　eachとmapの違い

#eachとmapの違い
***⚫︎eachは繰り返し処理の時に使います。***
***⚫︎mapは繰り返し処理の結果を配列にしたい時に使う。***

#eachの使い方
まずeachの使い方を見ていきましょう。

“`
scores = [1,2,3]
scores.each do |score|
score*2
end

p scores

““

“`
[1, 2, 3] と出力
“`

***eachは配列scoresの各要素の数字を2倍にした結果を出力しています。***

#mapの使い方

“`
scores = [1,2,3]
scores.each do |score|
score*2
end

p scores

“`
“`
[2, 4, 6]と出力
“`
結果として配列scoresの各要素の数字を2倍した結果を配列として出力されています。

#２つを比較して
eachとmapを比較すると
⚫︎eachはただscoresの中の[1,2,3]を出力しているだけですが
mapはresult = 〜の配列として出力しています。

【インクリメンタルサーチ】Ajaxを用いたキーワード検索機能の実装

#インクリメンタルサーチとは
>キーワード検索を行う際に、利用者が文字を入力するたびに検索を実行する方式。
検索語全体を入力する前に検索を開始し、一文字進むごとに検索結果が更新し即座に候補を表示させる便利な機能。

#実装内容
今回はDBに保存してあるカラム値を対象にインクリメンタルサーチを使用して選択した値をフォームに自動入力させます。

##処理全体の流れ

1. 検索フォームに入力後、jsファイルでイベントが発火
1. jsファイルから受け取ったデータをコントローラのアクションへ返す
1. データベースからjsファイルで受け取ったデータと合致するデータを抽出し、そのデータをjbuilderへ渡す
1. jbuilderでJSON形式に変換したデータを再度jsファイルに送り、そのデータをもとに検索結果を表示

この説明では何いっているか分かりませんよね、、（自分でも分かりません笑）

#完成形はこちら
![4635318dc0d230da36ba06d6b026197b (2).gif](https://qiita-image-store.s3.ap-northeast-1.ama

【Rails】お気に入り(いいね)のハートアイコンとカウント数の間に謎の下線、消し方(メモ）

#　目標
#### このハートアイコンとカウント数の間にある下線を消す。


“`erb:likes.html.erb

お気に入り一覧

<% @like_posts.each do |post| %>
<% if logged_in? %>
<% if current_user.like?(post) %>
<%=link_to post_likes_path(post), method: :delete do %>
　
　<% end %>
<% else %>
<%=link_to post_li

Railsで無限スクロールの導入

使用環境
Ruby2.6.8
Rails6.1.4

#完成イメージ
TwitterやYoutubeのように、ページ下層部に到達したときに次のページを自動的に読み込む機能の実装

#前提
RailsアプリケーションにjQuueryの導入をしている必要があります。
jQueryの導入をしていないちょ、という方はこちらを参考に。

https://qiita.com/tatsuhiko-nakayama/items/b2f0c77e794ca8c9bd74

#処理の流れ
①kaminariのインストール
②jscrollの導入
③ページネーションの実装
④無限スクロールの実装

##①kaminariのインストール
おなじみgemファイルを操作してbundle installするだけです、はい。
最後の行とか、適当な場所に追加しましょう。

“`:Gemfile
gem ‘kaminari’
“`

“`
$ -> bundle install
“`

##②jscrollの導入
「view/application.html.erb」など、無限スクロールを実装する箇所のheadに

[Ruby] all?メソッドとinclude?メソッドの合わせ技

##はじめに
少し前にall?メソッドとinclude?メソッドを記事にしましたが、この二つを使うと配列の中に複数の要素が含まれているか確認するのにとても便利だったため、合わせ技を記事にしておきます。
↓それぞれの基本的な使い方はこちらをご確認ください。

https://qiita.com/minhee/items/815d10da29b0eb0dbf68

https://qiita.com/minhee/items/43ba0ec0866988052fb1

##all?とinclude?の合わせ技

配列の中に複数の要素があるかどうかを調べる際にこの二つを組みわせるとすっきりとコードを記述することができます。
例えば、
[1, 2, 3, 4, 5]このような配列があったとして、1と3と5の全てがあるかどうかを調べたいとします。
ここでinclude?の登場ですが、include?の引数は一つしか渡せません。
もしinclude?だけでこれを実現しようとすると下記のようになります。

“`ruby
array = [1, 2, 3, 4, 5]

array.includ

[初心者向け] Railsで管理ページを作成し、管理者権限を持つユーザーのみアクセス可能にする[rails_admin]

#はじめに
右も左もわからないプログラミング初心者が書く備忘録です。
膨大な勉強量の中で気になった事をメモしていきます。

今回ポートフォリオの作成ともあり、管理者ページに転移する際にパスワードを求めたくない
（担当の方に余計な一手を打たせたくない）という理由からはじめました
しかし、普通に運用する際もセキュリティの向上が期待できると思いますので
パスワードのみでブロックしている方などは参考にしてみてください♪

#今回の内容
gem ‘devise’
gem ‘cancancan’
gem ‘rails_admin’, ‘~> 2.0’
を使用し、webアプリに管理者ページを作成したいと思います

管理用ページのアクセスに関して

・アクセス可能なのは管理者のみ
・他のユーザーはアクセス不可（トップページへ飛ばす）
・ログインしていない場合、ログインページへ移動させる

を意識していきたいと思います

#開発環境
Rails 6.1.3.2
ruby 2.5.1
Docker version 20.10.6
devise (4.8.0)
cancancan (3.3.0)
rail