Rails関連のことを調べてみた

Turbo Streamsを利用してモーダル画面表示と他の処理を同時に行った

## 今回実装した処理の流れ
フォーム送ると、①非同期のジョブ、②モーダルの表示、③ジョブ結果を描画するテーブルの表示、の3つの動作を同時に行う機能を実装しました。
この記事ではそのturboのでのモーダル表示部分のみを記録しています。

## 実装したもの
モーダル部分
“`index.html.erb

“`
これだけ。ここをturbo_streamによってパーシャルに書き出したものと置き換えることでモーダル画面を描画させる。

同じページのボタン部分
data: { turbo_stream: true }をつけるとコントローラーでturbo_streamのリクエストとして受け取ることが出来ます。
“`index.html.erb
<%= form_with url: hoge_path(@hoge), scope: :huga, data: { turbo: true } do |f| %>

“`

切り出したパーシャル。bootstrapのモーダルを使っています。
モーダル表示

strong　parameter内で使うmerge以下について

def purchase_record_params
params.require(:purchase_record).permit(:zip_code, :region_of_shipping_origin_id, :city, :street_address, :apartment_name, :tel)
end

というコード内においてどうやらmergeが必要だったことがわかった。

今回はmergeの使い方を考えてみます。

結論mergeとはハッシュとハッシュの結合ということが分かった。

例
tweet = { name: “たなか”, text: “test”, image: “test.jpeg” }
uid = { user_id: “1” }
tweet.merge(uid)
=> {:name=>”たなか”, :text=>”test”, :image=>”test.jpeg”, :user_id=>”1″}

Railsの全ファイルをリンター及びフォーマッターで取り締まる

## 概要

RailsでRubocopを使って、Rubyファイルの秩序を保っている人は多いだろう。しかし一方で、その他のファイルの治安はおざなりになっている人も多いはず。

この記事ではRailsによく登場するファイル全てに対して、リンター及びフォーマッターを適用することを目標とする。

## Ruby

[Rubocop](https://github.com/rubocop/rubocop)を使用する。

“`bash
bundle add rubocop rubocop-performance rubocop-rails rubocop-rspec
“`

最低限の`.rubocop.yml`はこんな感じだろうか。

“`yaml
require:
– rubocop-performance
– rubocop-rails
– rubocop-rspec
– rubocop-factory_bot

AllCops:
TargetRubyVersion: 3.2
NewCops: enable
“`

## JS, CSS, HTML

[ES

Ruby on Railsで動的なフォーム要素を扱う方法

この記事では、Ruby on Railsで動的にフォームの表示を切り替える一例として、サービス選択に応じて特定のフォームフィールドを表示・非表示する方法を紹介します。主に`id`属性の動的な生成とJavaScriptを使用したDOMの操作に焦点を当てて解説します。

## まず結論

問題の解決策は、`id`属性をERBテンプレート内で動的に生成し、JavaScriptを用いてその`id`を持つ要素の表示を切り替えることでした。具体的には、以下のように記述しました。
※<%= service.id %>の部分が重要でした。
※コメントアウト部分はコンソールでログを出しつつ試行錯誤した履歴です。

“`app/views/staffs/registrations/edit.html.erb

Deviseの内部挙動とActiveRecord::RecordNotFound の解消について

## はじめに

RailsアプリケーションにおいてDeviseを用いたユーザー認証機能のカスタマイズ中に`ActiveRecord::RecordNotFound – Couldn’t find Staff without an ID:`というエラーメッセージが発生しました。この記事では、このエラーがなぜ発生したのか、そしてどのようにして解決に至ったのかを共有します。

## エラーの内容

ユーザー情報の更新フォームを送信した際に、以下のエラーメッセージが表示されました。

“`
ActiveRecord::RecordNotFound – Couldn’t find Staff without an ID:
app/controllers/staffs/registrations_controller.rb:46:in `set_staff’
Started GET “/staffs/edit?id=2” for ::1 at 2024-02-28 00:00:38 +0900
Processing by Staffs::RegistrationsController#ed

【Rails】画像の上に文字を中央揃えで表示する方法

# 概要
この記事では、Railsアプリケーションにおいて画像の上に文字を中央揃えで表示する方法を説明します。
実装方法の参考として残しておく形なので詳しい解説はあえてつけていません。

# 環境
**Rails**: 6.1.4
**Ruby**: 3.1.2
**Bootstrap**: 4.5

:::note warn
**注意**
Bootstrapが導入されている前提で進めますので、もし導入されていない場合は、Bootstrapを導入するか、その部分を自作のclassで置き換えるかして対応してください。
:::

# 結果
最初にコード実装後の結果を貼っておきます。
実装後に下記の画像のようになっていれば表示されていれば、問題ないと思います。


# 準備
`app/assets/images`配下に背景画像としたい画像を用意して

【Rails】ECサイトにおける新着商品の表示レイアウトの整え方

# 概要
この記事では、Bootstrap導入済みのRailsアプリケーションにおいて、ECサイトのトップページに表示する新着商品のレイアウトの整え方について言及しています。

# 環境

**Rails**: 6.1.4
**Ruby**: 3.1.2
**Bootstrap**: 4.5

# 結果
結果として、下記の画像のような感じでレイアウトが整っていれば良いと思います。
今回は割と簡素にしているので、ここからさらにレイアウトを改善して行っていただければと思います。


# 実装

この章では実装の流れについて説明をしていきます。

::: note warn
**注意**
`Contorller`の処理や`View`の処理で使っている変数等々は、適宜置き換えて実装いただくようにお願いいたします。
:::

## Controllerの

営業時間に基づくタイムテーブル表示機能の実装

Railsアプリケーションにおいて、営業日と営業時間を設定し、その時間内でタイムテーブルを表示する機能を実装します。

## 前提条件

– 基本的なRailsの知識があること（モデル、ビュー、コントローラーの概念を理解していること）

## ステップ1: モデルの設定

まず、`Company`, `BusinessDay`, `CompanyBusinessDay`, `CompanyBusinessHour`のモデルを設定します。ここでは、`Company`モデルが`BusinessDay`を中間テーブル`CompanyBusinessDay`を介して多対多の関係にあり、さらに`CompanyBusinessDay`から`CompanyBusinessHour`への1対多の関係があるとします。

## ステップ2: 営業時間の表示

選択された日付に対して営業時間を表示するためには、選択された日付の曜日に基づいて`CompanyBusinessDay`と`CompanyBusinessHour`から該当するデータを取得します。

“`ruby
def generate_time

閲覧情報の保存機能の実装（cookie使用）

## 概要
ウェブアプリケーションにおいて、ユーザーが現在閲覧している企業の情報をセッションやクッキーを通じて保存し、画面遷移してもその情報を保持する方法について解説します。この機能は、ユーザーがサイト内で異なるページを訪れる際にも、選択した企業を忘れずに操作を続けられるようにするためのものです。

## 実装ステップ

1. **現在閲覧中の企業情報の設定**
– `viewing_company`メソッドをコントローラに定義します。このメソッドは、セッションまたはクッキーから企業IDを取得し、対応する企業情報をデータベースから検索します。

2. **セッションとクッキーの使用**
– ユーザーが企業を選択した際に、その企業のIDをセッションやクッキーに保存します。これにより、ユーザーがサイト内を移動しても選択した企業情報を保持できます。

3. **ビューでの表示**
– コントローラで定義した`viewing_company`をビューで利用して、現在選択されている企業の情報を表示します。

### コード例

“`ruby
class Application

mysql2を調べた。

# mysql2をインストールする理由
具体的にわからなかった。今後の自分に頼るしかない。
以下調べた内容。

## mysql2とは？
The Mysql2 gem is meant to serve the extremely common use-case of connecting, querying and iterating on results. Some database libraries out there serve as direct 1:1 mappings of the already complex C APIs available. This one is not.

It also forces the use of UTF-8 [or binary] for the connection and uses encoding-aware MySQL API calls where it can.

### 出典

https://github.com/brianmario/mysql2#:~:text=The%20Mysql2%20gem%20is%2

Railsアプリケーションにおける外部キー制約エラーの解決法

## エラーの概要
Railsアプリケーション開発中、以下のような外部キー制約違反のエラーに直面しました。

“`
ActiveRecord::InvalidForeignKey (PG::ForeignKeyViolation: ERROR: update or delete on table “company_business_days” violates foreign key constraint “fk_rails_… on table “company_business_hours”)
“`

このエラーは、`Company`モデルを削除しようとした際に発生しました。

## エラーの解消方法
問題の解決には、データベースの外部キー制約に`on_delete: :cascade`オプションを追加する必要があります。これにより、親モデルの削除時に関連する子モデルが自動的に削除されます。

前提条件のセクションを、提供されたモデルの定義に基づいて再構成します。ここで目指すのは、記事の読者が問題の文脈をより明確に理解できるように、モデル間の関係性とそれらがどのように連携

new_framework_defaults_x_xを更新しても、値が反映されないことがあるので注意

Railsのアップデートの際に、新しいバージョンの config のデフォルト値を少しずつ反映させるときに `new_framework_defaults_x_x` を使うと思います。

今回、`config.load_defaults 6.1` へ上げる前に、`Rails.application.config.active_record.has_many_inversing = true`の設定をしても反映されないことがありました。

:::note
たまたま今回は has_many_inversing でハマりましたが、他の設定でも同様ですし、new_framework_defaults 以外の `config/initializers/*` での設定も同様に`Rails.application.config.xxx`の設定が反映されない可能性があるので記事にしてみました。
:::

## 結論

初期化時の読み込み順によっては、`config/initializers/*` のファイルの設定値が反映されないことがあるので、 その場合は`config/application.rb`

【Rails】CDNを利用してBulmaを導入する

## はじめに
**自己紹介**
　未経験からWEB系エンジニアへの転職を目指している者です。現在はRuby on Railsを学習中です。

**この記事を書いたきっかけ**
　フロントエンドとバックエンドは分けずに手軽にビューを作成したいと思い、CSSフレームワークのBummaを導入したので学習記録として記事を書きました。

## 動作環境
– mac OS Sonoma 14.2.1
– ruby 3.2.2
– rails 7.0.7

## Bulmaの導入方法を調べてみた
Bulmaの導入方法を調べたところ、以下の方法がありました。
– 公式サイトからダウンロードする
– npmなどのパッケージマネージャー使う
– CDNを利用する
– bulma-railsというgemを使う

今回は特にこだわりもなかったので、一番簡単に使えそうなCDNを利用する方法を選ぶことにしました。
以下のリンクはBulma公式サイトのスタートガイドです。

https://bulma.io/documentation/overview/start/#bulma-start

## CDNって何？

RailsにおけるRate Limitの実装ガイド

# Rate Limitの概要
Rate Limitは、APIへのリクエスト数を制御するためのシステムです。
これは、APIを過剰に使用したり、悪意のある攻撃を防ぐために使用されます。
Rate Limitによって、一定期間内に許可されるリクエストの数が限定されることで、サーバーの過負荷を防ぎ、サービス品質を維持することができます。

## Rate Limitの利点
### サービスの過負荷防止
APIへの過剰なリクエストがサーバーのリソースを圧迫し、サービスが遅くなったり、最悪の場合はダウンしたりすることを防ぎます。
Rate Limitによって、予期せぬトラフィックの急増による障害からAPIを守ります。

### 悪意のある利用の防止
DDoS攻撃など、悪意のあるユーザーによる過剰なリクエストを防ぎます。
これにより、APIが安全に運用されることを確保します。

### 公平なリソースの利用
全てのユーザーに対して公平にAPIリソースへのアクセスを提供します。
一部のユーザーによる過剰なリクエストが他のユーザーの利用機会を奪うことを防ぎます。

### コスト管理
クラウドサービ

request テストで rpsec テスト用のパラメータを作成

# attributes_for
attributes_for を用いることで、モデルに紐づくパラメータを簡単に作れる

“`rb
let(:valid_params) { attributes_for(:agent_scout_company) }
let(:valid_params) do
{
name: “株式会社ホゲ”,
name_kana: “カブシキガイシャホゲ”,
zipcode: “1057510”,
address: “東京都港区 東京”,
tel: “0312345670”,
url: “https://www.hoge.co.jp”,
license_number: “11-ユ-343453”
}
end

“`

未経験エンジニアがRailsチュートリアル難しくてう〇こ漏らした話

# 脱糞注意　苦手な方はブラウザバック推奨

## 前書き
こんにちは。りょりょです。
本日は、題名の通りRailsチュートリアルが難しすぎて漏らしたのでその感想をつらつらと書いていこうと思います。
これから、Railsチュートリアルを受講しようとしている方にはぜひ参考にしてもらいたいです。

## 自己紹介
・新卒アプリケーションエンジニア（Ruby,Rails）
・未経験（大学では遺伝子の研究）

## 現在のレベル
・Progate受講済み（html&css Ruby Rails 各4周）
・基本情報技術者試験合格済

## 受講のきっかけ
私はもともと業務でRailsを使っている手前、Railsチュートリアルを使って自主学習をしようと思っていました。しかし、教育係の先輩からまだ少し早いんじゃないかというストップをかけられていたわけです。（入社2ヶ月目くらいの話です。）
そして、基本情報技術者試験の勉強やProgateでの勉強を終えて、万全の気持ちでRailsチュートリアルに臨んだわけです。
ちなみに、Macを使ったローカル環境で受講しました。

## 受講の感想
受講された方な

【個人開発】ラーメン待ち時間シェアアプリ「ちゃくどん」を作ってみました【Rails, Hotwire, AWS, Docker, GitHubActions】

## はじめに

「[ちゃくどん](https://tyakudon.com)」というWebアプリをリリースしましたので紹介させてください！
私は非エンジニアで子供が3人いることもあり、制作期間10ヶ月とコツコツ開発してきました。制作アプリの解説に加えて、開発・運用していく過程においての学びや、失敗談についてもシェアできたらと思います。

## ちゃくどんとは？

ざっくり説明すると、ラーメン店に並びはじめる「接続」から、ラーメンが提供される「着丼」までの待ち時間である「ちゃくどんレコード」を共有するアプリです。

|ちゃくどんレコードの計測・登録|ちゃくどんレコードの閲覧|
|:-:|:-:|
||![レコード閲覧.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.co

routesの`:id`の部分をid以外にしたい備忘録

`resources :furnitures`とした時に生成されるURLは↓こんな感じになると思います。
| | |
|:-:|:-:|
| furnitures#index | GET /furnitures |
| furnitures#create | POST /furnitures |
| furnitures#new | GET /furnitures/:id/edit |
|furnitures#edit | GET /furnitures/:id |
| furnitures#show | GET /furnitures/:id |
|furnitures#update|PUT /furnitures/:id|
|furnitures#destroy|DELETE /furnitures/:id|

show画面だと`/furnitures/1`とかになると思うのですが、この数字(:id)を変えて、`/furnitures/sofa` `/furnitures/table`という感じにしたい。
[公式ドキュメント](h

パスワードをハッシュ化するgem

gemとは、RubyやRailsでプログラミングをする際に「よく使う機能」をパッケージ化したもの。
「検索機能を作るgem」や「ハッシュ化するgem」など様々なgemが存在し、Railsにインストールすることで使用することができる。
今回はbcryptという「ハッシュ化するgem」を使います。

Railsにはインストールしたいgemを記述するGemfileというファイルが存在する。

「gem’gemの名前’,’gemのバージョン’」とすることで記述したバージョンのgemをインストールすることができる。

Gemfileにgem’bcrypt’を記述する。
ターミナルでbundle installコマンドを実行する。
記述したgemをインストールできる。

bcryptをインストールすると、has_secure_passwordメソッドが使用可能になる。
パスワードを扱うUserモデルにhas_secure_passwordを追加する。
class User < ApplicationRecord has_secure_password . . . end ユーザーを保存す

image_tagを使って画像遅延読み込み

## image_tagとは？
画像ファイルのリンクを作成できる。

https://railsdoc.com/page/image_tag

# 画像遅延読み込みとは？
jsなどのライブラリを用いて画像を非同期読み込みすること。
遅延読み込み用のjsは検索すれば出てくると思うのでダウンロードしておいてください。
ここでは遅延読み込みについて詳しくは触れないので各自調べていただければと思います。

Lazy Loadで画像を遅延ロードする方法

# 画像遅延読み込みをimage_tagを使って実装する
第一引数に画像ファイルへのパスを指定し、第二引数以降にオプションやHTML属性を指定できる。
第一引数に遅延読み込み用のファイルパスを指定し、第二引数のdate-srcで実際の読み込む画像のファイルパスを記載する。
“`rb
<=% "遅延読み込み用の画像ファイルパス","date-src"=>“表示させたい画像のファイルパス”,altなど… %>
“`
第二引数にはハッシュの形でファイルパスを渡してあげてください。