- 1. Element Plusのel-uploadにてアップロードするファイルとは別にパラメーターを付属させるやり方
- 2. 【Rails】検索フォームをヘッダーに追加する
- 3. コード譜投稿アプリを作る #1（アプリ構築）
- 4. 【Rails】Javascriptバンドラーの第5の選択肢vite_rails
- 5. 【Rails】resourcesとは① 〜基礎〜
- 6. PHPerでLaravel使いの僕がRailsでハマったこと(環境構築編)
- 7. 【Rails】Fromオブジェクトパターンを使用したActiveStorageの拡張子バリデーションを設定する方法
- 8. Reactでローディングアニメーションを実装
- 9. 【Ruby on Rails】link_toの中でhtmlタグを表示させずにタグの内容だけ適用させる方法
- 10. whenever gem mac cron log どこ ? – wheneverでcronを正常作動させるまでの備忘録 –
- 11. 【Rails】bundlerでプロジェクト毎にgemを管理する根拠と方法(5分)
- 12. 【Rails】devise_token_auth でパスワードをリセットする流れをまとめる
- 13. ログイン機能を実装中（自分でログインできない)
- 14. ActiveRecord::PendingMigrationError
- 15. 初めてのウェブサービスに縦書きエディタを選んだ理由
- 16. 【RSpec】have_xpathの使い方｜テキストフィールドの中身をテストする
- 17. Rails 非同期いいね エラー解決集
- 18. rails sがうまくいかなかった
- 19. 【Rails】同一名のmodule内でクラスを呼び出す方法
- 20. 【Rails】l(エル)メソッドを使用して時刻表示を日本語化rev1
Element Plusのel-uploadにてアップロードするファイルとは別にパラメーターを付属させるやり方
#### 概要
Element Plusのel-uploadを使用していますが、ファイルアップロード時におまけでパラメータを付属させてサブミットする方法でハマったので、備忘録として残しておきます。#### テンプレート側
“`
.
【Rails】検索フォームをヘッダーに追加する
# はじめに
検索フォーム(検索窓)を実装する。
**仕様**
・ヘッダーに検索フォームを追加し、テンプレートを崩さない。
・form_withを使用する。
・虫眼鏡マークと検索フォームが重ねる。
・検索キーワードが空白の時は、全ての投稿を返す。
・検索キーワードがタイトルと内容に一致するを記事を検索する。
# 環境
| No | 項目 | 内容 |
|—:|————-|————|
| 1 | OS | Mac |
| 2 | Ruby | 2.6.3 |
| 3 | rails | 6.0.4 |
4|sass-rails|5.1.0# 実装
# routes.rbの設定
コード譜投稿アプリを作る #1（アプリ構築）
[←前回の記事](https://qiita.com/t_sekky/items/de8768b9826d98601164)
今回はひとまずRailsのAPIモードとNext.jsのアプリケーションを作っていきます
環境はM1macです## Railsアプリ作成
[この記事](https://qiita.com/ydammatsu/items/a2fbae968149bf2c1999)に書いてあることを~~コピペ~~参考にしてdockerを使って構築しました
ruby3系とRails７系は初めてだけど試すのには絶好の機会だしまぁええでしょ詰まった点としては`db:create`する際に以下のようなエラーが出ました
“`
/lib/aarch64-linux-gnu/libm.so.6: version `GLIBC_2.29′ not found (required by /usr/local/bundle/gems/nokogiri-1.13.0-aarch64-linux/lib/nokogiri/3.1/nokogiri.so) – /usr/local/bund
【Rails】Javascriptバンドラーの第5の選択肢vite_rails
# 初めに
`Rails7`からアセットパイプラインは`importmap` `esbuild` `webpack` `rollup`の 4 つの選択肢があります。
ですが、新たに`vite_rails`という選択肢をここで紹介させていただきます。# なぜ vite_rails なのか
– 開発サーバーは非常に高速に起動し、変更が即座に更新される。(ホットリロード)
– 基本的にデフォルトの設定で動作し、構成が簡単である
– デプロイ時は`assets:precompile`でバンドルができる。
– css や sass などもバンドルできる。# 導入方法
`webpacker`からの移行する方法になります。
`Gemfile`に`vite_rails`を追加します。
“`Gemfile:Gemfile
gem ‘vite_rails’
“`“`console:ターミナル
$ bundle install$ bundle exec vite install
設定ファイルを作成する
“`デフォルトでは`app/frontend`がエントリーポイントに
【Rails】resourcesとは① 〜基礎〜
# はじめに
この記事は、resourcesに関する基礎知識をまとめた記事である。（備忘録的な意味もあります…）
・前提
・resourcesとは
・書き方
・注意事項## 前提
・Railsのルーティングを理解している## resourcesとは
resourcesとは、特定のコントローラーに対する**ルーティングをまとめて設定してくれる**もの。設定するルーティングは、データベース上での**CRUD操作**(Create/Read/Update/Delete)にそれぞれ対応できるようなルーティングを設定してくれる。
:::note info
index、new、create、show、edit、update、destroyアクションに対するルーティングを設定してくれる。
:::## 書き方
### 基本
・書く場所：`config/routes.rb`
・書き方 ：`resources :コントローラー名`“`rb:config/routes.rb
resources :コントローラー名
“`
例：postsコントローラー
PHPerでLaravel使いの僕がRailsでハマったこと(環境構築編)
# Ruby on Railsやろう！
ある日突然急にRailsがやってみたくなって手を出した男の奮闘記です。
またなんかあったら追記します。# 環境
OS: Windows11
エディタ: Intellij Idea
ターミナル: Windows Terminal
Rubyインストーラー: Ruby+Devkit 3.1.2-1 (x64)
Rubyバージョン：3.1.2p20
Railsバージョン：7.0.3.1# 第1の壁：「エラー: データベース ‘msys’ は無効です (無効または破損したデータベース (PGP 鍵))」が乱立
Rubyのパスも通った、railsコマンドも入った、さて「rails new」をしよう！
・・・とやる気のところに立ちはだかる無数のエラー
「エラー: データベース ‘msys’ は無効です (無効または破損したデータベース (PGP 鍵))」しか記録に残して置かなかったのですが、他にも鍵がないとかのエラーが出てたと思います。
## 解決策：
MSYS2 development toolchain と Run ‘ridk install’
【Rails】Fromオブジェクトパターンを使用したActiveStorageの拡張子バリデーションを設定する方法
大阪でRailsを中心に学習している薬剤師エンジニア（初学者）こと、ヨマ([@yoma_2003](https://twitter.com/yoma_2003))です！
Fromオブジェクトパターンを使用したActiveStorageの拡張子バリデーションを設定する方法をまとめます。※おことわり※
断定口調でまとめますが、初学者であるため間違い等あればご指摘頂けると嬉しいです。# はじめに
### やりたいこと
以下の様にPostモデルとCommentモデルに同時にデータを登録するため、PostCommentモデルというFormオブジェクトを作成した時、
**PostCommentモデル（Formオブジェクト）において、Postモデルで保存する画像データに拡張子のバリデーションを設定したい。**
“`ruby:p
Reactでローディングアニメーションを実装
Reactでローディングアニメーションを実装をしました。
参考記事
https://almonta2021blog.com/%E3%80%90react%E3%80%91%E3%81%8A%E3%81%97%E3%82%83%E3%82%8C%E3%81%AAloading%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3react-spinners/まずは、_app.tsxに記載します。
アニメーションはreact-spinnersというライブラリを利用しており、ClipLoaderを利用しています。カスタマイズもしやすいため、おすすめのライブラリです。
“`JavaScript
import Head from “next/head”;
import “../styles/globals.css”;
import “tailwindcss/tailwind.css”;
import { useRouter } from “next/router”;
import { useEffect, us
【Ruby on Rails】link_toの中でhtmlタグを表示させずにタグの内容だけ適用させる方法
## やろうとしていたこと
“`
p= link_to “#{use_tmp(gorira.name)}”, user_path
“`
こんな感じのコードをrailsのslimを使用して書いていた。
ちなみに↑の“`use_tmp“`はapplication_helper.rb内に記述したヘルパーメソッド。
このヘルパーメソッドでは、文字を青く表示する処理を聞いた。そのため、ユーザーが実際にみる画面では文字が青く表示されれば良い。
が、うえの書き方だと
“`
ごりら
“`
このように、ユーザーが見る画面でもspanタグが表示されてしまう状態だった。## 解決方法
“`
– gorira_name = “#{use_tmp(gorira.name)}”
p= link_to “#{gorira_name}”.html_safe, user_path
“`
このようにすると、htmlタグは表示されず、ごりらという文字が青で表示されるようになった。
whenever gem mac cron log どこ ? – wheneverでcronを正常作動させるまでの備忘録 –
# – wheneverでcronを正常作動させるまでの備忘録 –
## 執筆経緯
> [whenever(github)](https://github.com/javan/whenever)上記のgemを導入してmacbookローカル上で定期実行を試みたが、全くうまくいかず
・ログどこにあるの？？？
・何のエラー起きてるの？？？となり、想定した動作をするまでにかなり時間を費やしたので
同じ症状の方が短時間で解決できるよう、解決方法と原因を周知するために執筆する。## 私の環境
PC：MacBook Air (M1, 2020)
rails(アプリ側): 6.1.6.1
rails(ターミナル標準):5.2.8.1## テーマと扱わない事項
:::note
本記事のテーマは、macでwheneverを使用した際にcronを正常動作させるために
・”schedule.rb”にどのように記載すべきか
・記載内容の意味
をテーマに解説していきます。
:::
:::note alert
wheneverの具体的な使い方については解説していません
:::## 結論
“
【Rails】bundlerでプロジェクト毎にgemを管理する根拠と方法(5分)
## 本記事の趣旨
初学者の方でもわかりやすいように、5分で読めるくらいの軽さで下記の項目についてまとめます！
1. bundlerとは何か？
1. プロジェクト（アプリ)毎にgemを管理する根拠
1. bundlerを使ってプロジェクト毎にgemを管理する方法
1. プロジェクト毎にGemを管理するときはgitignoreしよう※ OSはmacを想定しています。
※ rbenvを使用していることを想定しています。## bundlerとは何か？
ざっくり言うと、**Gemfileに書いているGemをよしなに管理してくれる超便利マン**です。
各種のGemを人の手で管理すると、非常にだるい、だるすぎるので、bundlerさんの力を借りて簡単に管理するのが定石となります。
下記の記事でわかりやすくまとめてくれているので、詳しく知りたい方は参照してください。
https://pikawaka.com/rails/bundler## プロジェクト毎にgemを管理する根拠（メリット）
上記の通り、Gemをよしなに管理してくれるbundlerさんですが、デフォルトではinst
【Rails】devise_token_auth でパスワードをリセットする流れをまとめる
RailsAPI でパスワードリセットを実装したので、議事録として残します。
# 目的
devise_token_authにて、パスワード再設定を実装する
# パスワードリセットの流れ
1. パスワードリセットメールを送信する
2. 送信されたメールのリンクから、パスワード再設定画面へ遷移する
3. パスワードを更新する# passwords_controller.rbの各アクションについて
passwords_controller.rbで定義されている3つのアクションを使用します。
https://github.com/lynndylanhurley/devise_token_auth/blob/master/app/controllers/devise_token_auth/
ログイン機能を実装中（自分でログインできない)
ログイン機能を実装中（自分でログインできない）
シードファイル
rails db:seed
テーブルのサンプル読み込みの役割bundle exec rake db:seed
を行ってからログインするシードファイル
rails db:seed
テーブルのサンプル読み込みの役割
を忘れていた。seedデータとは
初期データやテストデータのことで動作確認用データを登録する目的で行います。投入したいデータの件数が増えた場合にもこれさえあれば迅速に投入できる環境を構築することができます。
seedデータの投入
下記コマンドを実行します。rake db:seed
dockerを使用している場合
docker-compose exec web bundle exec rake db:seed
をおこなえば良い。ファイルにgemを入れる
bundle installテーブルの作成
rails db:createマイグレーションを実行
rails db:migrateテストの実装
rake db:seedの流れ
❯ bundle exec rake db:see
ActiveRecord::PendingMigrationError
ActiveRecord::PendingMigrationError
You have 2 pending migrations:
2件の保留中のmigrationファイルがある。
→rails db:createは終わっているが、rails db:migrateしていないでしょと言われている。何をrails db:migrateしていないのかを確認するためにrails db:migrate:statusを行う
＊
migrationは、SQL文を書かずにデータベースの構造を変更したり、元に戻したりできる実行後の内容
Status Migration ID Migration Name
————————————————–
up 20220815060217 ********** NO FILE **********
up 20220815060220 ********** NO FILE **********
up 20220815073501
初めてのウェブサービスに縦書きエディタを選んだ理由
# 1.はじめに
初めまして。55歳を過ぎてWebの勉強を始め、このほど初めてウェブサービスをデプロイしました。開発したのは、ブラウザ上の原稿用紙とでもいいましょうか、[縦書きエディタ](https://www.sakubun.tokyo)です。
# 2.なぜ縦書きエディタ？
なぜ縦書きエディタかというと、GIGAスクールが関係しています。学校現場に配布される児童・生徒１人１台端末は、手軽さなどからChromebookが採用されるケースが多いのですが、文書を作成するツールは、GoogleドキュメントなどのGoogle系ツールが主体です。Google系ツールには縦書き機能がなく、日本語を教える国語の先生は大変困っています。
教育現場で使われているにもかかわらず、日本語を縦書きできる環境がないのは教育の根幹にかかわる問題だと
【RSpec】have_xpathの使い方｜テキストフィールドの中身をテストする
# have_xpathの使い方
have_xpathを使うとタグの有無を確認することができます。“`ruby
#ページ内に指定した属性が’hoge’である指定したタグがあるかテストする
expect(page).to have_xpath “//タグ名[@属性名=’hoge’]”#ページ内にvalue属性が’サンプルデータ’であるinputタグがあるかテストする(テキストフィールドの中身が’サンプルデータ’かどうかテストする)
expect(page).to have_xpath “//input[@value=’サンプルデータ’]”
“`※XPathとはなんぞや？という人は以下のサイトを参考にしてください。
[【図解】XPathとは？基本概念から書き方までわかりやすく解説！](https://www.octoparse.jp/blog/xpath-introduction/)# 参考
– [Capybara RSpecでのマッチャ、セレクタ 「こんなときどうするの」その1](https://qiita.com/kenzan100/items/9642615bad
Rails 非同期いいね エラー解決集
以前、非同期いいねで大量に困った経験があるので、Railsの非同期いいね（Railsだったら他の非同期にも使えるかも？）なエラー解決集をメモ代わりに作っておきます！
# エラー解決のタイミング
1. RailsにjQeuryを導入する時
1. 部分テンプレート作成時（若干エラー吐かない内容もありますが、非同期のアクシデント解決の関係で入れてます）
## 1. RailsにjQeuryを導入する時
Qiitaでよく調べている方はご存知かもしれませんが、Railsの記事はRails6以前のものが多く、役に立たないことがあります。そこで、Rails6でのjQuery導入方法をお伝えします！### 手順
1. Gemfileに**jquery-rails**を追加する
“`ruby:Gemfile
# 最終行に追加しましょう！
gem ‘jquery-rails’
“`
2.bundle install
3.application.jsに**import “jquery”**を追記
“`js:application.js
// This file is automatica
rails sがうまくいかなかった
背景
railsのバージョンを6.1.6.1 → 6.1.4.4に変更。
変更前はエラーが多発していた
1.
Running via Spring preloader in process ~
2.
gemでgemfile.lockにインストールされていない
3.
rails s
rails db:migrate
rails db:seedバージョンによる問題、バージョンが理由ではない問題に
切り離して考えてみた。問題が起こる前の挙動
gemfile
gem ‘activeadmin’
gem ‘devise’
gem ‘net-smtp’
を追加して、
bundle install —path vendor/bundle実行
❯ rails s=> Booting Puma
=> Rails 6.1.6.1 application starting in development
=> Run `bin/rails server –help` for more startup options
Exiting
/Users/~/.rbenv/versions/3
【Rails】同一名のmodule内でクラスを呼び出す方法
## 状況
一見問題なさそうだが
“`User.hoge_method“`で“`User“`モデルではなく、“`Parameters::User:Module“`の“`User“`が呼ばれてしまっているためエラーが起きている。
moduleとクラス名が同一のため起きていると考えられる。
“`ruby
class User
def hoge_method
puts ‘hogeメソッドを実行’
end
endmodule Parameters
module User
class ProfileParameter
def fuga_method
User.hoge_method
end
end
end
end
end
“`“`
NoMethodError:
undefined method `hoge_method’ for Parameters::User:Module
“`
## 解決法クラス名の前に“`::“`をつける。
ちな
【Rails】l(エル)メソッドを使用して時刻表示を日本語化rev1
# はじめに
[こちら](https://qiita.com/vaza__ta/items/268cad88235c4de7940c)の記事で一部、よりDRYな書き方をアドバイスいただいたので、その方法で実装をする。ご指摘いただき、ありがとうございます。# 環境
| No | 項目 | 内容 |
|—:|————-|————|
| 1 | OS | Mac |
| 2 | Ruby | 2.6.3 |
| 3 | rails | 6.0.4 |# 実装
下記のように、lメソッドを使用して、時刻を表示する。
“`ruby:posts/show.html.erb
# <%= post.created_at.to_s(:datetime_jp) %>
# 上記ではなく、下記で記載する。
<%= l object.created_at %>
“`
application.rbに下記を定義する。
“`ruby:config
