- 1. 【＋α】初学者がRailsガイドから知見を広げる（’Active Record バリデーション’編 1）
- 2. RSpecべからず集（DSLの構築が不適切な事例あれこれ）
- 3. Active Storageのファイルアクセス時に独自処理を経由させる方法（Rails v6.1.0以降）
- 4. ECサイト ER図
- 5. Next.js14 Server ComponentでのData Fetching
- 6. ActiveAdminのアクション追加例3パターン
- 7. ER図について
- 8. 【Rails】form_withからhidden_fieldでデータを送る際のポイント
- 9. [Codespace] railsサーバー再起動方法
- 10. file_fieldのデザインを変更する
- 11. 【rails】Herokuに画像が表示されない
- 12. 【rails】viewの共通applicationを切り分ける
- 13. 【rails】.envファイルに環境変数を設定する
- 14. 【rails】OAuthを用いて、GitHub認証ログイン機能を実装する
- 15. 【Amazon Linux 2023】ElasticBeanstalkでffmpegが動かなくなった件
- 16. RailsとAjaxを用いて日付入力フィールドの変更をリアルタイムで反映する方法
- 17. Railsにおけるコントローラーロジックでの条件分岐とデータ取得の落とし穴
- 18. erbファイルでemmetが効かなくなった
- 19. 個人開発でカタログ作成アプリを開発した件
- 20. Ruby on Rails (React on Webpacker) でアプリを作成してみた
【＋α】初学者がRailsガイドから知見を広げる（’Active Record バリデーション’編 1）
:::note warn
【記事のテーマ】
初級者＆中級者向けの書籍である『[独習Ruby on Rails](https://www.shoeisha.co.jp/book/detail/9784798160689)』を基準に
初学者である自分視点で「初級者＆中級者向けの書籍には載っていないが公式のドキュメントには載っている少し上級よりな内容」
を取り上げることを目的としています。
:::
***
（参考書籍）
1. [独習Ruby on Rails](https://www.shoeisha.co.jp/book/detail/9784798160689)
2. [パーフェクトRuby on Rails 【増補改訂版】](https://gihyo.jp/book/2020/978-4-297-11462-6)（参考サイト）
1. [Railsガイド >> Active Record バリデーション](https://railsguides.jp/active_record_migrations.html)
1. [Railsドキュメント](https://rail
RSpecべからず集（DSLの構築が不適切な事例あれこれ）
## はじめに：これは何？
僕がコードレビューしていて、「ん？いやいや、こんな書き方しちゃダメだよ！」と思ったコード例をまとめた記事です。この記事でフォーカスするのはRSpecの[DSL](https://e-words.jp/w/DSL.html)を適切に構築してないケースです。
ネタが増えたらまた追記するので、気になる方はこの記事のストックをお願いします！（記事の更新時に通知欄でお知らせします）
それでは以下が本編です👇
## トップレベルのdescribeを2つ以上作らない
“`ruby
# NG
describe ‘Foo spec’ do
# …
end
describe ‘Bar spec’ do
# …
end
“`テストコードを読む際に、読み手は「当然ファイル全体が大きなひとつのdescribeブロックになっているはず」と信じ込んでいるので、予想に反するネスト構造になっていると脳内の予想と実際の実行結果が異なって混乱します。
以下のように大きなdescribeブロックで囲んで1ファイルにつきトップレベルのdescribeが1つだけ
Active Storageのファイルアクセス時に独自処理を経由させる方法（Rails v6.1.0以降）
## 経緯
Ruby on RailsのActive Storageを使用していて、ファイルアクセス時に独自処理を挟みたくなったことはありませんか？https://railsguides.jp/active_storage_overview.html
私はあります。
そんなとき、下記の記事で同じことができそうだったので参考にしていました。https://qiita.com/karszawa/items/c0f6316217e981d3c6a3
しかし、想定の挙動通りに処理が進まず、苦労しました。
原因としては、Railsのバージョンアップによるものでした。
参考にしていた記事で実施すると、特定のRailsバージョンでは意図通り動作しないため、
`Active Storageのファイルアクセス時に独自処理を経由させたいとき`のRailsv6.1.0以降の方法についてまとめました。## 参考にした記事に沿って実装してみる
– `app/controllers/active_storage/`配下に、`blobs_controller.rb`を作成
– 下記の通りAct
ECサイト ER図
# はじまりました
今日からはじまりました！チーム開発＆ECサイト開発！
早速ER図を始めて作成したものの、難しいです…
考えるだけでは入ってこなそうなので、アウトプットしていきます！
アウトプットなので、要件定義は省略しております🙇答えになっちゃうので念の為隠しておきます↓
全体ER図
各テーブル詳しくみていきます👁️👁️
# 管理者テーブル
ER図
“`
form_withから@customerでmodelを指定して送ったデータを受け取るには、上記のようにキー[:customer]が必要になります。# createまでitem_idを渡す方法を考える
今回私がやりたかったのは、
商品詳細（show）から予約
[Codespace] railsサーバー再起動方法
## 対象
GitHubのCodespaceを使って開発している方## 前提
codespaceを立ち上げた状態でターミナルのコマンドで再起動します## 手順
1. 起動中のプロセスIDを確認する
入力コマンド ※「$ 」はターミナルを意味するので入力は不要です
$ cat /workspaces/[リポジトリ名]/tmp/pids/server.pid
-> xxxxx(数字)
2. サーバーを停止する
$ kill -9 xxxxx ←手順1で取得したプロセスID
3. 再度サーバーを立ち上げる
$ rails server
file_fieldのデザインを変更する
### きっかけ
file_fieldのデザインをデフォルトのものから変更したいと思いましたが、
UIkitでは単数のfile_fieldのclassは用意されているものの、
複数用のfile_fieldは用意されていなかったので、
自分で変更する方法を調べて変更してみました。初学者のため、誤りがありましたらご指導いただけると幸いです。
### 環境
Rails7.1
UIkit
ActiveStorage
stimulus前提として
すでにmodelやdb等は作成してあるとして進めさせていただきます。### 完成系のイメージ
送信ボタンにはUIkitのデザインをあててます。
file選択ボタンの部分をデフォルトから
![スクリーンショット 2024-05-11 14.08.53.
【rails】Herokuに画像が表示されない
# はじめに
– `assets/images/logo.jpeg` に画像を保存し,imgタグにてパスを参照してブラウザ表示を試みた。
– 上記ローカル環境にて表示することはできたが、“heroku“にデプロイした環境では表示させることができなかった。# やったこと
– 拡張子が `jpeg` になっていた→ `jpg` に修正する。
– `img` タグで記述を `image_tag` に修正する。
– `assets/images/x_logo.jpg` で絶対パス指定していたものを、 `x_logo.jpg` の形で相対パスに変更する。
– 修正後のコード↓“`ruby
.login
.text-center
= image_tag ‘x_logo.jpg’ ,alt: ” ,width: ’60’ ,height: ’57’
h3.text-center サインアップ“`
# 結果
– 開発環境、Heroku本番環境の両方でアイコンの画像を表示させることができた。
# 参考
https://qiita.com/jnchito/
【rails】viewの共通applicationを切り分ける
# やりたいこと
– deviseを用いたログイン、サインアップ画面と通常のメイン画面とで、共通のviewを切り分けて表示させたい。
– (例)メニューヘッダー,サイドバーはログイン画面には表示させたくない# やったこと
1. ユーザー認証用のHTMLを作る
2. ApplicationControllerに描画の切替を制御する記述をする
ユーザー認証用のHTML（ファイル名は任意）のファイル名で作って、`app/views/layouts/`配下に作る
※`app/views/layouts/devise.html.erb`で作るとします
devise.html.erb
“`jsx
Sample
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'rel
【rails】.envファイルに環境変数を設定する
# はじめに
– 外部に公開したくないpasswordなどを環境変数として `.env`ファイルに設定する。
– githubにコミットした際に、 `gitignore` ファイルに.envファイルを指定することで、パスを外部に公開されないようにすることができる。
– 上記の手順を簡単に下記へまとめる。# 手順
– detenvを `Gemfile` にインストール
“`jsx
gem ‘dotenv-rails’
“`– `.env` ファイルに外部に公開したくないIDやpassを記述する
“`jsx
LOGIN_NAME=’name123′
LOGIN_PASSWORD=’pass123′
“`– 上記を `環境変数` として他のファイルから呼び出す際は以下のように記述する
“`jsx
ENV[‘LOGIN_NAME’]
ENV[‘LOGIN_PASSWORD’]
“`– Githubに.envファイルがコミットされないように `.gitignore` ファイルに以下を追加
“`ruby
/.env
“`# 参考
https://q
【rails】OAuthを用いて、GitHub認証ログイン機能を実装する
# やりたいこと
– deviseのomniauthableの機能でgithubログインを実装する
– [ログイン](http://localhost:3000/users/sign_in),[サインアップ](http://localhost:3000/users/sign_up)からgithubログインができるようにする。– 挙動
– サインアップ、ログイン画面より「GitHub認証」のボタンを押下
– GitHubのログイン画面へ遷移しid,パスを入力しログインボタンを押下
– github上で認証するためのトークンを発行し、それをWebサイト側で検証
– 上記が認証されるとトップ画面へ遷移する。
# 調査
– 必要なこと
– omniauthableの実装に必要なge
【Amazon Linux 2023】ElasticBeanstalkでffmpegが動かなくなった件
どうもこんにちは。
今回は、Railsのバージョンを上げたときに生じた問題を解決したのでその備忘録を書いていきます。
# 変更した点
変更した点は以下です。
| 変更箇所 | 変更前 | 変更後 |
| — | — | — |
| Ruby | 3.0.6 | 3.2.2 |
| Rails | 7.0.5 | 7.1.3.2 |
| プラットフォーム | Ruby 3.0 running on 64bit Amazon Linux 2 | Ruby 3.2 running on 64bit Amazon Linux 2023 |# 発生したエラー
Railsのバージョンを上げた時に、`jquery-ui`が動作しなくなった問題はありましたが、`@hotwired/turbo-rails”`を先にインポートしたら解決しました。
ただ、今回は`ffmpeg`の`ffprobe`コマンドが正常に実行されなくなった問題を解消した方法を記載します。
# 解消方法
## 0. 前提条件
以下の事柄は実施しているものとします。
– `Ruby 3.2 runni
RailsとAjaxを用いて日付入力フィールドの変更をリアルタイムで反映する方法
## 導入
Webアプリケーションにおいて、フォーム入力のリアルタイム処理はユーザー体験を向上させる重要な要素です。特に予約システムのようなアプリケーションでは、利用者が入力する日付に応じて利用可能な時間帯やサービスの情報を動的に更新することが求められます。この記事では、Railsを使用して日付入力フィールドからの入力をAjaxを通じてリアルタイムに処理し、ページの特定の部分を更新する方法を紹介します。
## 実装手順
### 1. 日付フィールドの準備
まず、日付を入力するためのフィールドを用意します。このフィールドには、JavaScriptでイベントリスナーを設定するためのIDが必要です。
“`erb
<%= form_with model: @reservation, local: true do |form| %>
<%= form.label :date, "日付" %>
<%= form.date_field :date, id: 'date_field', value: Date.today, class: 'form-control' %>
<% e
Railsにおけるコントローラーロジックでの条件分岐とデータ取得の落とし穴
## 導入
Railsアプリケーションにおいて、コントローラー内でデータを条件に応じて取得しセットする際、予期しないバグやデータの不整合が発生することがあります。今回は、特に `action_name` を基に条件分岐を行い、会社のデータをセットするケースに焦点を当て、その問題点と解決策を紹介します。## 問題の説明
以下のようなコントローラーメソッド `set_company` があります。このメソッドは、アクション名に応じて会社の情報を `@company` 変数にセットする目的で用意されています。“`ruby
def set_company
@company = case action_name
when ‘new’
Company.find(params[:company_id]) if current_customer
current_company if current_company
when ‘create’
Com
erbファイルでemmetが効かなくなった
## emmetが効かない・・・
vscodeでerbファイルにdiv.containerなどを途中まで入力してtabキーを押しても自動補完されなくなってしまった・・・## Ruby LSPを有効化したら
拡張機能のRuby LSPが無効になっていたので、有効化→再起動
[](https://gyazo.com/88f5734f6fa8a085f59ce72c75fa845b)無事にemmetが使用できるようになりました！！
個人開発でカタログ作成アプリを開発した件
## はじめに
私は「[アプレンティス](https://apprentice.jp/lp)」の2期生としてプログラミング学習をしております。その中で「[CatalogEasy](https://github.com/setodeve/CatalogEasy)」という業務アプリをリリースしました。
開発期間は2ヶ月ほどです。この記事はなぜこのアプリを作ったのか、何を工夫したかを解説をするといった内容になります。
興味ある技術を使ってみたかったところもあり、規模に対してオーバースペックである点はご了承ください。## プロダクト概要
商品の画像付きのカタログを作りたいけどPC操作が苦手な両親へ向けたカタログ作成アプリです。
商品データと商品画像を登録することで簡単にカタログ作成ができます。
### Github URL
https://gi
Ruby on Rails (React on Webpacker) でアプリを作成してみた
## 1 – Project Setup
①プロジェクトフォルダを作成する
“`
mkdir プロジェクト名
“`
②railsのプロジェクトを作成する“`
rails new backend -d postgresql –api
“`
②reactのプロジェクトを作成する“`
npx create-react-basic frontend
“`
③backend/config/database.ymlを編集する“`backend/config/database.yml
development:
<<: *default database: backend_development username: test password: test //省略 test: <<: *default database: backend_test username: test password: test //省略 production: <<: *default database: backend_producti
