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

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

Amazon SES導入

開発しているアプリにAmazon SESを導入した話をまとめました。
Amazon SESは、Eメールを送信するサービスになります。

## AmazonSESの設定
– リージョンは東京リージョンを選択
– https://aws.amazon.com/jp/blogs/news/amazon-ses-tokyo/
– 2020年に東京リージョンが開設した模様

## ドメイン検証

検証済みの特定のドメインからであれば、任意のどのようなメールアドレスにでも送信できるようになるので、ドメインの検証を行う

– Domains
– Verify a New Domain
– Domainを入力
– 所持しているドメインを入力
– Generate DKIM Settingsにチェック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2367608/520e3699-2d39-a9ad-a5ba-8d4

元記事を表示

gem shrineを使った画像ファイルのダイレクトアップロード・バックエンドアップロードについて

画像アップロード周りの実装を直近で担当することが多かったので、まとめてみました。

S3のsdkだけで実装する方が汎用性も高い気はしているのですが、今回はgem shrineを使って実装するパターンを想定して記事を書きました。

# ダイレクトアップロード/バックエンドからのアップロードのシーケンス図

基本的な仕組みについて、以下のように整理しています。

– バックエンドからのアップロード
– shrineもそうだが、よくある画像アップロード用のライブラリのデフォルトは“/public/uploads“みたいなローカルのディレクトリに画像データが保存される挙動が多いが、実際本番ではその運用はもちろんしない。(画像のデータはAWS S3等に保存するようにオプションで設定することがほとんど)
– DBにはファイル名とかメタデータだけ保存して、画像を表示するときに「画像が格納されてるパス(S3へのパスなど)」と「DBに保存されているファイル名」を使って呼び出すという構成がベーシック。DBにファイル名ではなく画像データを保存してしまうと、DBの容量が圧迫されるのでもちろ

元記事を表示

whereやorderをモデルのscopeで書く方法

先日レビューで先輩エンジニアに教えてもらったことが勉強になったので備忘兼ねて投稿します。
whereやorderなどを使うときはモデルのscopeとして書くとスッキリするのと、使い回しもできて良いみたいです。

## controllerに書く方法

今回は商品(products)テーブルで開発日(development_date)降順で並べるとします。

“`ruby:products_controller.rb
def index
@products = Product.order(development_date: :desc)
end
“`

## modelのスコープとして書く方法

まずモデルに以下のようにscopeを定義します。

“`ruby:product.rb
scope: :development_order, -> { order(development_date: :desc) }
“`

コントローラで呼び出します。

“`ruby:products_controller.rb
def index
@products = Product.d

元記事を表示

Docker-compose.ymlの中身の詳細

# Docker-compose.ymlの中身の詳細
“`Docker-compose.yml
version: ‘3’
#dbとwebのサービスを定義
services:
db: #msql
image: mysql:8.0
command: –default-authentication-plugin=mysql_native_password #認証形式の設定8.0から
volumes:
– ./src/db/mysql_data:/var/lib/mysql #./src/db/mysql_data(ローカル)を/var/lib/mysql(docker)側に共有する設定(コンテナを作り直すたびにデータが消えてしまうが、これを設定しておけばローカルのデータを持ってこれる)
environment:
MYSQL_ROOT_PASSWORD: password #(環境変数でパスワードを指定)
web: #rails
build: . #ベースのイメージとしてDocker fileを参照する設定

元記事を表示

Alpineコンテナの中でエイリアスを自動設定する

# はじめに

普段Railsを扱うことが多いのですが、他の方が作成したRails環境を触ったところRailsコマンドや、Rspecなどを実行するときに、最初に`bundle exec`をつけないと実行できなかったためかなりストレスに感じて、手入力でエイリアスを張っていましたがこれを自動化するにはどうすればよいのだろうと考え、できるようになったためまとめます。

# 問題

実際に動作していたRailsコンテナの中で起動時にエイリアスをはる設定をする障害になっていたのが

– Alpine Linuxを利用していた (.bashrcが存在しない)
– コンテナの中にはいるとrootユーザーではないユーザーでログインすることになる (/root以下をみることができない)

というところでした。またbashコマンド自体は入っていないので、どうすればエイリアスを張ればよいのだろうという状況でした。

# 解決方法

`/env/profile`を用いてエイリアスを張ることでうまくいきました。

まず`.alias`を作成しました。この中にはエイリアスのコマンドを書いておきます。

“`.a

元記事を表示

プロジェクトへテストコードを導入する(計画編)

## 今回話すこと
– [導入の経緯](https://qiita.com/iyore_eng/items/fdf57b817589383db661#導入の経緯)
– [Webアプリケーションにおけるテストとは](https://qiita.com/iyore_eng/items/fdf57b817589383db661#webアプリケーションにおけるテストとは)
– [何のためにテストをするか](https://qiita.com/iyore_eng/items/fdf57b817589383db661#何のためにテストをするか)
– [どういったものをテストするか?](ttps://qiita.com/iyore_eng/items/fdf57b817589383db661#どういったものをテストするか)
– [デメリットについて考える](https://qiita.com/iyore_eng/items/fdf57b817589383db661#デメリットについて考える)
– [使用する技術](https://qiita.com/iyore_eng/items/fdf57b817

元記事を表示

[Rails]Webフォームからアップロードされたファイルデータについて

# 概要
Webフォームからアップロードされたファイルデータの扱いがよくわかっていないので、
文献を拾ってまとめた。
前提として、「file」というキーで、「PC内の/home/user/xxx.csv」という適当なCSVファイルがアップロードされたものとする。

# 参考
– [ActionDispatch::Http::UploadedFile](https://api.rubyonrails.org/v6.0.2.2/classes/ActionDispatch/Http/UploadedFile.html)

– [Tempfile](https://docs.ruby-lang.org/ja/latest/class/Tempfile.html)
→Fileクラスと同じように扱える。
スクリプト実行が終了したとき削除される。

# まとめ
“`
# アップロードファイル情報
uploaded_file = params[:file]
→ActionDispatch::Http::UploadedFile型でアップロードしたファイルの情報が返ってくる。
 以降、uploade

元記事を表示

Bootstrap,CSSを使った一覧表示

この記事は学習中に実装した内容をアウトプットし、更に理解を深めるための記録用投稿になります。
投稿している内容と同じ箇所で躓いている方に少しでもお力添えできれば幸いです。

## 実装した内容
ユーザーの詳細画面でユーザーの詳細内容、投稿した記事の一覧を4つ表示して折り返す内容になります。

## 今までの考え
・今までHtml,Css,Ruby,Ruby on Railsの順番で学習を進めてきて、直近で学習していた課題ではCssを使わずにレイアウトをBootstrapだけを行い実装してきました。
そのこともあり、今回もBootstrapだけで行こうと進めていましたが思ったようなレイアウトにならず色々調べているとCssも並行して使えることを書いてある記事を見つけました。(今更何を言っているんだと思う方もいるかもしれませんが、初心者の脳内なのでどうかお許しください、、。)
そのことを踏まえて読んでいただけると嬉しいです。

## 前提条件
・Bootstrap導入済み。(今回はBootstrap4です。)
## 参考ページ
自分のページを曝け出すのは恥ずかしくて大変恐れ多いですが

元記事を表示

Rails6 × Vue3 アプリ立ち上げ手順

# 記事作成意図
ネット上にRails×Vue3の情報が少ない(Vue2ばっかり)のでまとめておきました。

### Railsアプリを新規作成
“`
rails new -d mysql アプリ名
“`
### Vue用インストール
“`
yarn add vue@next
yarn add –dev vue-loader@next @vue/compiler-sfc
“`
### DB作成
“`
rails db:create
“`
### サーバが起動することを確認
“`
rails s
“`
### environment.jsを編集
“`config/webpack/environment.js
const { environment } = require(‘@rails/webpacker’)
const { VueLoaderPlugin } = require(‘vue-loader’)
const { DefinePlugin } = require(‘webpack’)

environment.plugins.prepend(
‘Vu

元記事を表示

100日後くらいに個人開発するぞ!day001

# まずはこれをやってみる!

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2632394/280cff78-08ee-40f8-c0c2-f8e062e7eca1.png)

https://prog-8.com/paths/rails

# 今日はHTMLに触れてみた!
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2632394/e1c53435-3698-911c-7fd2-3f8eff89c0d6.png)

“`

* 開始タグと終了タグ
* 開始タグ
*
終了タグ
* 見出しをつける
* 見出し
* hはheadingの頭文字
*

,

,

,,,

,,,と数字が大きくなるについれて見出しは小さくなる
* 段落をつける
*

タイトル

元記事を表示

Enumが定義されたインスタンス変数を更新する

仕事のコードを読んでいたところ次の記述に遭遇しました。

“`ruby:sample.rb
(~)? (モデル).accept! : (モデル).refuse!
“`
(~)が真ならば(モデル).accept!、偽ならば(モデル).refuse!を実行するという記述です。

「ほう、`accept!`なんてメソッドがあるのか」と思い調べましたが、何も出てきません。
そこでコードに戻ったところ次の記述がありました。
“`ruby:models/sample.rb
enum status: { refuse: 0, accept: 1 }
“`
「`enum`は属性に対応する値をDBに保存するんだったよな…」

Railsガイドには次の記述がありました。

https://railsguides.jp/active_record_querying.html#enum

> 以下の!付きインスタンスメソッドは自動で作成されます。最初にstatusの値を更新し、次にstatusがその値に設定されたかどうかをtrue/falseで返します。
“`ruby:railsguide.rb

元記事を表示

【初学者】ログイン機構のまとめ【Webアプリ開発の道~その3~】

# はじめに
こんにちは。しばらく投稿の間が空いてしまいました…。
言い訳をしておきますと、(また後で記事にできたらいいなと思っているのですが…)「要件定義」や「基本設計」について、深掘りして勉強しながら、実際にオリジナルアプリの設計をしていたからです。
暫定的な成果物はできたのですが、おそらく、アプリ開発の中で、見直しされていくと思いますので、最終的にアプリが形になってから、記事にしたいと思います。

今回は、どのWebアプリでも必ず実装するであろう「ログイン機構」について、学んだことをまとめていきたいと思います。

# 何を書いたか
Ruby on rails チュートリアルの第8章、第9章の内容をベースに、自分なりに咀嚼したものを描いていきます。

# なぜ書いたか
学習記録です。特に自分が理解しにくかった部分は、自分なりの解釈を加えています。(間違っている部分はご指摘いただけると幸いです。)

# 本題

## 基本的なログイン機構
### ログインの基本的な仕組み
→ブラウザがログインしている状態を保持し、ユーザーによってブラウザが閉じられたら状態を破棄するといった仕組み

元記事を表示

Rails 6/7にjQueryとBootstrap 5を入れる(その1)

RailsにjQueryとBootstrap 5を入れる方法を調べながら、Rails 7のCSSとJavaScriptの新機能を調べてみました。次のようなコードを動かすのが目標です。BootstrapのjQueryプラグインを使うものです。

“`javascript
$(‘[data-bs-toggle=”tooltip”]’).tooltip()
“`

あるいは、次のようにjQueryプラグインを使わない方法でもよしとします。

“`javascript
$(‘[data-bs-toggle=”tooltip”]’).each((idx, elm) => {
new bootstrap.Tooltip(elm)
})
“`

## Webpacker(Rails 6.1)

まず、Rails 7の新機能を使わず、Rails 6にWebpackerで導入する方法です。yarnでBootstrap 5、Popper 2、jQueryを入れます。

“`
% yarn add bootstrap @popperjs/core jquery
“`

Bootstrap

元記事を表示

カラムの合計値を出す方法

カラムの合計値を出す方法

controller↓
@任意の変数名 = テーブル名.all.sum(:合計を出したいカラム名)

元記事を表示

JavaScript BundlingとCSS Bundlingのしくみ

Rails 5-6時代に使われた[Webpacker](https://github.com/rails/webpacker)は、公式に「has been retired」とされ、Rails 7では[importmap](https://github.com/rails/importmap-rails/)が標準となりました。

Rails7はimportmapとは別に、JavaScriptのバンドラやCSSのフレームワークを導入するしくみを用意しています。2つのgem、 [JavaScript Bundling(jsbundling-rails)](https://github.com/rails/jsbundling-rails) と [CSS Bundling(cssbundling-rails)](https://github.com/rails/cssbundling-rails) です。この2つは、Rails 6に入れることもできます。

## 概要

JavaScript Bundling は、JavaScriptのバンドラ(esbuildやwebpack)を使い、JSファ

元記事を表示

【Rails】Slimでのifを利用する方法

# 初めに

Rails でポートフォリオを作成中に、条件によってクラスをつける方法を忘れてしまっていたので忘備録として残しておきます。

## 環境

Rails 7.0.2
Ruby 3.1.1
Slim 4.1.0

# 本文

erb での後置 if の書き方は多くありましたが slim でのやり方が少なかったので記事にしておきます。

こちらは erb での書き方です。

“`erb: if.html.erb

<% if @result == true %>
<%= link_to "Topへ", words_path,{class:'btn-bule'} %>
<% end %>

元記事を表示

Railsでエラーメッセージ表示されない時の対処法

mac OS バージョン11.6
Rails 6.0.4

# やりたいこと
ユーザー登録に失敗した場合、エラーメッセージが出るようにする

# エラー内容
どこか1つを空欄で登録しようとした場合、本来ならエラーメッセージが出るはずだが出ない。

![66c676ebe92b0cec674b3199da319983.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1962714/f38ca33f-0981-f5a6-0cc8-d7bb81578f1a.png)

# 原因
form_withがajax通信になっていたので、画面が更新されていなかった。

Rails 5.1〜6.0 の form_with ではデフォルトでajax通信が行われる仕様になっていて、非同期通信になってしまうのです。
ここにlocal: trueと引数を渡す事で、HTMLをレンダリングできるようになります。(Railsの6.1からはデフォルトでajaxではなくなったのでlocal: trueは不要です)

# 解決策
local

元記事を表示

GemfileでグローバルインストールするGemを管理する

普段プロジェクトごとにGemfileを管理していますが、システム全体で使うGemもGemfileで管理したいと思い方法を調べました。

## 環境
Mac OS Big Sur 11.6
Bundler 2.2.32
Ruby 3.0.2
Gem 3.2.22

## 結論

好きな場所にGemfileを作成して

“`ruby
bundle install –system
“`

これだけでシステム全体でGemが使えるようになります。

## 保存場所

自分の場合は[rbenv](https://github.com/rbenv/rbenv)を使いバージョン管理をしています。

そこで、 `Gemfiles` というフォルダを作り、その下でバージョンごとに管理することにしました。

“`ruby: 好きな場所
Gemfiles
├── 2.6.3
│   └── Gemfile
│   └── Gemfile.lock
├── 2.6.6
│   └── Gemfile
│   └── Gemfile.lock
└── 3.0.2
└── Gemfile
 

元記事を表示

🔴CircleCiで、Rails6のRspecのSYSTEMテストを実行する方法【Docker】

# ✅当方の環境
– 開発環境 : Docker
– ruby 2.7.5
– rails 6.1.5
– Circle Ci

# ✅前提条件
:::note warn
「selenium-webdriver」をアプリ(WEB)のコンテナに導入したのではなく、アプリ(WEB)のコンテナとは別の「selenium-webdriver」のDockerコンテナを新しく作成・起動させて、SYSTEMテストを実行した場合に、本記事が有効である
– アプリ(WEB)のコンテナに、直接「Chome-driver」を導入した場合などは、本記事は対象外
– [こちらの記事](https://qiita.com/felmy/items/d4b1334a6adee071ef46)で「selenium-webdriver」を導入した場合は、以降の内容を試してみてください
:::

# ✅概要
:::note alert
Circle Ciで使用する「自分で設定したイメージファイル」と、「自分で設定したDockerのイメージファイル」は、別々でお互いに共有されないため、Circle Ciの環境をDockerの

元記事を表示

OTHERカテゴリの最新記事