Rails関連のことを調べてみた2022年04月09日

さくらvpsにRailsアプリをデプロイするまで (3) NginxとGitHub導入

# 0.道のり

　デプロイまでの道のりは遠い。Herokuだったら一瞬で終わるけど、勉強がてらやってみる。

# 1.Nginxの導入

　WebサーバーであるNginxを導入する。CentOSの標準ではApacheだが、静的コンテンツのやりとりや並列処理に向いているためである。私が開発するアプリは基本的にテキストのやりとりしかしない。Nginxのほうが良い。
　こちらを参考にした。

https://www.sbbit.jp/article/cont1/65256

　導入についてはよい記事があった。

https://zenn.dev/kirk3110/articles/064040d60ca5e3

　まずはyumのレポジトリの一部を変更する。rootユーザーでログインする。

“`
# vim /etc/yum.repos.d/nginx.repo
“`

“`etc/yum.repos.d/nginx.repo
[nginx]
name=nginx repo
baseurl=http://nginx.org/packages/centos/7/$basearch/
g

【Rails】GROUP BY句で外部キーを指定したところ、ActiveRecord::StatementInvalidになる

外部キーのグループ化で、地味に躓いたので記事としてまとめます！

# 問題
GROUP BY句で外部キーを指定して、インスタンスを取り出そうとするとエラーが起きました。

# 現象

①
groupメソッドで、外部キーであるオフィスIDを指定し、条件に該当するインスタンスを複数得ることができます。
ここまではエラーは発生しません。
“`ruby
User.group(:office_id).select(:office_id)
User Load (9.7ms) SELECT `users`.`office_id` FROM `users` GROUP BY `users`.`office_id` LIMIT 11
=> #, #, #, #, #,

駆け出しエンジニアのCI改善(その2 GithubActionsでテスト実行)

## 自己紹介: 駆け出しエンジニア
はじめまして。
私はRailsで自社サービスのWeb開発を行っている駆け出しエンジニアです。
この度はGithubActionsによる自動テストの作成を担当しました。

2020年 11月|エンジニアとしての学習を開始
:—:|—
**2021年 5月**|**エンジニアへ転職**
**2022年 2月**|**テスト自動化** :tada:
2022年 4月|現在(11ヶ月)

現時点で動くものを作ることができましたので、これからさらに磨きをかけて行きます。
より良い方法、至らない点については優しく指摘頂ければ幸いです。

### 実行環境: Ruby3.0&Rail6.0
Ruby|3.0.3
—|—
**Rails**|**6.0.4.6**

## 目標:GithubActionsでテストを並列実行する
最終的な目標はRspecのテストをGithubActionsで並列で実行することです。
4つのステップに分けて進めて行きます。

1. [テスト用DB作成の為にseed.rbを作成する](https://qiita.com/

Rails ActiveStorageを使って画像を投稿する方法

この記事は私の学習の保存用のために書いている記事になります。新しく学んだ内容をアウトプットして残していき充実した学習をしていきたいと思います。
説明の不足や間違っている情報などがあればご指摘いただけると幸いです。よろしくお願いします。

## そもそもActiveStorageとは?

Railsで画像の投稿や表示を行うもので画像は通常のカラムとして保存できないため特別な保存方法が必要となり、それを行うのがActiveStorageです。

## ActiveStorageをインストールする

以下のコマンドでActiveStorageをインストールする

“`
$ rails active_storage:install
“`
インストールが終わるとマイグレーションファイルが自動で追加される。マイグレーションファイルをmigrateするために以下のコマンドを入力
“`
$ rails db:migrate
“`
以上がマイグレーションファイルができたときの基本の流れで、カラムを追加する必要があれば追加してから「rails db:migrate」を行う。

## モデルに記述を

【CircleCI】サブディレクトリのプロジェクトをビルド対象にする書き方

タイトルの通りですが、調べてもなかなか方法にたどり着けなかったので記録しておきます。
今回は私がよく使っている **Rails** をサンプルにします。

## ルートディレクトリにプロジェクトがある

### フォルダ階層

“`
root
├── .circleci
│ └── config.yml
├── app
├── bin
├── config
├── db
├── lib
:
“`

### 設定ファイル

下記の例は公式から持ってきたものです。
本当はjobsの中に `test` も合ったのですが、今回の説明では不要だったので削除しています。
– [言語ガイド: Ruby – CircleCI](https://circleci.com/docs/ja/2.0/language-ruby/)

“`yml:.circleci/config.yml
version: 2.1

orbs:
ruby: circleci/ruby@1.0
node: circleci/node@2

jobs:
build:
docker:
– im

vscode rails環境構築時のエラー rails s

“`rails s“`でエラーが起こった。
“`
********@mbp jisaku_app % rails s
=> Booting Puma
=> Rails 7.0.2.3 application starting in development
=> Run `bin/rails server –help` for more startup options
Exiting
/Users/********/.rbenv/versions/3.1.1/lib/ruby/gems/3.1.0/gems/webpacker-5.4.3/lib/webpacker/configuration.rb:103:in `rescue in load’: Webpacker configuration file not found /Users/********/jisaku_app/config/webpacker.yml. Please run rails webpacker:install Error: No such file or dire

業務時のGitなどの操作

インターンに入って時間が経ち、そろそろgitの使い方にも慣れてきたと思っていましたが、まだいくつか間違えそうなところがあるので自分のためにも記事に残しておきます。

## タスクのブランチ操作
[こちら](https://qiita.com/iguchan_4649/items/6c74779d73e31856c78f#%E4%BC%9A%E7%A4%BE%E3%81%AEgit%E7%8A%B6%E6%B3%81%E3%81%8C%E6%9B%96%E6%98%A7%E3%81%AA%E3%81%BE%E3%81%BE%E9%80%B2%E3%82%81%E3%81%AA%E3%81%84)でPR作成までの流れをgitで行い、次のタスクを行うときは以下の流れで行うようにします。

1. `git checkout master`でmasterやstagingなどのメインブランチに移動
2. 常に最新の情報を取得したいため、`git pull origin master`でmasterやstagingなどのリモートリポジトリの変更内容を取り組む
3. `git checkout -b

【Rails】An error occurred while installing rmagick (2.16.0), and Bundler cannot continue.

環境

windows11

Rails 6.0.4.1
rmagick 2.16.0

症状

rmagicをGemに記載した後、「bundle install」を実行したときに、下記のエラーメッセージが表示されました。
翻訳すると、「rmagick（2.16.0）のインストール中にエラーが発生し、Bundlerを続行できません。」でした。

“`terminal:error
$ bundle install

(中略)

Fetching rmagick 2.16.0
Installing rmagick 2.16.0 with native extensions
Gem::Ext::BuildError: ERROR: Failed to build gem native extension.

current directory:
C:/Ruby30-x64/lib/ruby/gems/3.0.0/gems/rmagick-2.16.0/ext/RMagick
C:/Ruby30-x64/bin/ruby.exe -I C:/Ruby30-x6

【ImageMagick】windows11でImageMagick入れて、Railsでrmagickを使う手順

環境

windows11

Rails 6.0.4.1
ImageMagick 6.9.12-44
rmagic4.2.5

概要

Railsでrmagckを入れる際にwindowsでやってる記事が見つからなかったので、書きます。

rmgcik2.16.0までではimageMagick７バージョンに未対応らしいので、ImageMagick６バージョンを入れていきます。
引用元↓

https://www.ownway.info/Ruby/rmagick/howtoinstall/windows

ImageMagickを入れる

以下のサイトのWindows版のところからダウンロードします。

https://legacy.imagemagick.org/script/download.php

ダウンロードしたら、起動。すると下記の画面が表示されます
「Iaccept the agreement」を選択して、規約に同意します。
![image.png](https://qiita-image-store.s3.ap-northe

NameError (uninitialized constant Sidekiq::Logging)

– [「現場で使える Ruby on Rails 5速習実践ガイド」](https://www.amazon.co.jp/%E7%8F%BE%E5%A0%B4%E3%81%A7%E4%BD%BF%E3%81%88%E3%82%8B-Ruby-Rails-5%E9%80%9F%E7%BF%92%E5%AE%9F%E8%B7%B5%E3%82%AC%E3%82%A4%E3%83%89-%E5%A4%A7%E5%A0%B4%E5%AF%A7%E5%AD%90/dp/4839962227)の「Chapter7-8　非同期処理や定期実行を行う（Jobスケジューリング）」を進めていたところ、“`sidekiq“`の実行でハマってしまいました。
# 1.開発環境
“`Ruby:terminal
$ ruby -v
ruby 2.6.9p207 (2021-11-24 revision 67954) [x86_64-darwin19]
$ rails -v
Rails 5.2.7
“`

# 2.はまったこと
“`bundle exec sidekiq“`を実行したところ、次のようなエラー

【Rails】Could not find gem ‘rmagick (= 2.16.0)’ in locally installed gems.の対処法【rmagick】

症状

rmagickをinstallして、Railsサーバーを起動したところ、下記のエラーメッセージが表示されました。
翻訳すると、「ローカルにインストールされたgemでgem’rmagick（= 2.16.0）’が見つかりませんでした。
ソースには、次のバージョンの「rmagick」が含まれています。4.2.5
`bundle install`を実行して、不足しているgemをインストールします。」

“`terminal:error
$ gem install rmagick
Could not find gem ‘rmagick (= 2.16.0)’ in locally installed gems.
The source contains the following versions of ‘rmagick’: 4.2.5
Run `bundle install` to install missing gems.“`

一応Gemfileのrmagickも記載します。

“`ruby:Gemfile
gem ‘carrierwave’
gem ‘rma

[Rails6/TailwindCSS] No route matches [GET] “/packs/js/*.js”)が出た時に行った修正

## 結論

これを

“`erb:application.html.erb
<%= stylesheet_link_tag 'application', 'data-turbolinks-track': 'reload' %>
“`

こうした。

“`erb:application.html.erb
<%= stylesheet_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
“`

## 背景
[DMM WEBCAMPの卒業生コミュニティ](https://twitter.com/Webcamp_COMM)でDocker環境でチーム開発をして勉強をしていた際に、Rails6にTailwindCSSを導入して開発を進めるタイミングがありました。

Gemの`gem ‘tailwindcss-rails’`を使用して読み込ませていたのですが、何らかの作業ミスか設定が原因で、作業中にCSSが自動で更新されなくなることが起こりました。

## 問題
コンテナの中に入り、`webpack`コマンドの実行でコン

Rails コメント機能を非同期通信(Ajax)を用いて実装したい！

## はじめに
プログラミング初学者の自分用アウトプットです。
誤った知識や記述があれば教えていただけると幸いです。

## 開発環境
– ruby2.6.3
– rails6.1.4

## 前提条件
本を投稿するWebアプリを作成中
– ユーザー機能実装済（Userモデル（device導入））
– 投稿機能実装済（Bookモデル）
– コメント機能実装済（BookCommentモデル）

## やりたいこと
– ユーザーがコメントを投稿した際に、ページをリロードせずにコメントの投稿ができる。
– ユーザーがコメントを削除した際に、ページをリロードせずにコメントの削除ができる。

###### コメント機能を使用した際に、ページを部分的に更新できるようにしたい！
## 実装の流れ
#### ●jQueryを導入
“`ruby:Gemfile
gem ‘jquery-rails’
“`
“`ruby:javascript/packs/application.js
import “jquery”;
“`
“`
$ bundle install
“`
#### ●view

Rails 7.0.2にアップグレード後、SQLインジェクションの危険性のあるクエリがエラーになった

# エラー内容

エラー内容は以下。

“`text
ActiveRecord: :UnknownAttributeReference: Dangerous query method (method whose arguments are used as raw SQL) called with non-attribute argument(s): “field(id, ?)”.This method should not be called with user-provided values, such as request parameters or model attributes. Known-safe values can be passed by wrapping them in Arel.sql().
“`

要は、「field(id, ?)はSQLインジェクションの危険があるから、危険じゃないことを確認できてるならArel.sql()で囲め」とのこと。

エラー出た部分のコードは以下の様な感じ。

“`ruby
User.where(id: ids).order

Firebase・GCP(BigQuery)を活用したリソースのPV数のカウントについて

ネイティブアプリ開発のプロジェクトで、自分のプロフィールが閲覧された回数などを記録して、ユーザーにそれを表示してあげると言う機構を作成しました。
その際に、Firebase、GCPを活用して作ったので、その記録を書きたいと思います！
主にバックエンド(Rails)の視点で書いていますが、基本は仕組みの解説なので、言語はそれほど関係ないかなと思います。

# 作った機構の全体像
まずは作った機構の全体像を載せておきます。
– アプリ側のコードにGAのタグを埋め込み
– ユーザーがイベントを踏むと発火しデータをGAへ送信
– GAで保存→定期的にGAからBigQueryにデータをエクスポート
– BigQueryでデータを永続化→BigQueryで保存データに対してSQLを実行してデータを加工して取得
– そのデータをアプリで表示

# GC

【Docker】Docker for macのコンテナに他端末からアクセスする方法【Rails】【React】

## はじめに
　本記事は、プログラミング初学者が学習を進めていて疑問に思った点について調べた結果を備忘録も兼ねてまとめたものです。
　そのため、記事の内容に誤りが含まれている可能性があります。ご容赦ください。
　間違いを見つけた方は、お手数ですが、ご指摘いただけますと幸いです。

## Docker for macのコンテナに他端末からアクセスする方法
Docker for macでは特段の設定をすることなく、ローカル環境と同じように[【Rails】macのrailsサーバーに他の端末からアクセスする方法](https://qiita.com/P-man_Brown/items/040b14576020f51a843d)に記載の手順でアクセスできました。
Windowsの場合には別途設定が必要なようです。

### Nginx + Rails
`nginx.conf`を以下のように記述している場合には`http://localhost`の代わりに`http://ローカルIPアドレス`とすることでiPad等でアクセスできます。

“`nginx.conf
upstream myapp

SNS認証について

# SNS認証について
– 学習マッチングサイトを作成して、google認証を実装したい
– 認証機能について理解を深めたい
## 環境
– AWS：EC2,RDS(MySQL),VPC,Route53
– webサーバー：NGINX
– アプリケーションサーバー：Puma
– フレームワーク：Ruby on Rails

## 認証の仕組みについて
今回はgoogle認証であるため、登場人物は、

– googleのリソースサーバ
– エンドユーザー
– webアプリ
– googleの認可サーバー

です。
### リソースサーバーとは
リソースサーバとは、保護対象のリソースを保持しているサーバーを指します。ここでいうリソースとは、googleフォトの画像やプロフィール情報等のことと思います。
### ユーザー
リソースオーナであり、アカウントを連携したいユーザーを指す。
### webアプリ
これは、つまり、学習マッチングサイトです。
### 認可サーバー
リソースサーバーに信頼されたサーバーで、リソースオーナーの認証を行い、リソースサーバーに対するアクセストークンを発行します。

外部キー制約のついたカラムを削除する方法

ここではgenreテーブルからmovie_idカラムを削除します。

まず “`$ rails generate migration remove_カラム名_from_テーブル名“` を実行して、外部キー制約のかかったカラムを削除するためのマイグレーションファイルを作成します。

“`
# rails g migration remove_movie_from_genre movie:references
Running via Spring preloader in process 414
invoke active_record
create db/migrate/20220406054902_remove_movie_from_genre.rb
“`

削除用のマイグレーションファイルを確認します。
“`20220406054902_remove_movie_from_genre.rb
class RemoveMovieFromGenre < ActiveRecord::Migration[6.0] def change r

Active Storageの複数ファイルを1つのzipファイルに圧縮する効率の良い方法

とある案件で、Active Storageで管理しているファイルを複数選択して、1つのzipファイルに圧縮する要件があったので実装方法を検討しました。

# 前提

この記事では下記のUserモデルの`save_selected_avatars`メソッドの実装方法を検討します。

“`ruby:user.rb
class User < ApplicationRecord has_one_attached :avatar class << self def save_selected_avatars(user_ids) # TODO: user_idsで指定したユーザーのavatarを1つのzipファイルに圧縮して保存する end end end ``` なお、この記事では下記のバージョンを使って動作確認しています。 ZIPファイルを生成する処理はrubyzipのGemを使います。 * ruby 3.1.1 * rails, activestorage 7.0.2.3 * rubyzip 2.3.2 # 実装方法検討 ## その１ ま

Rails APIからReactに渡すデータを整形する方法

RailsAPI＋Reactという構成でアプリを作っているとデータを整える必要がある時が多々あると思います。

例えば以下のようなユーザーデータがあるとします。

“`ruby
{
name: ‘taro’
age: 21
sex: ‘male’
phone_number: 08012341234
post_code: ‘xxx-xxxx’
prefecture: ‘ZZZ県’
city: ‘ZZZ市’
ward: ‘ZZZ区’
town: ‘ZZZ町’
}

“`
React側で住所が欲しいときに一々、郵便番号や県、市などを繋げるのは面倒ですよね。こういう時はRailsでシリアライザーをつかうと便利です。シリアライザーは以下のようになります。

“`ruby
class UserSerializer < ActiveModel::Serializer attributes :name, :age, :sex, :phone_number, :post_code, :prefecture, :city, :ward, :town de