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

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

axiosを使わないでいいね機能を非同期化

こんにちは、普段はプログラミングスクールでメンターをやっている@takokkeです。

今回はいいね機能の非同期化手順を学習記録としてまとめてみました。axiosなどのjsライブラリを使わず、シンプルにjQueryだけで実装したいと思います
# 非同期処理の大まかな手順
1. いいねボタンを押したら、javascriptリクエストがコントローラに送られる
1. アクションがデータ処理を行い、いつもならhtml.erbにインスタンス変数を渡すが、今回はjs.erbへ渡す
1. js.erbに記述したjsコードが、いいねボタンの部分だけ書き換える

ポイントは、いつもならコントローラで定義したインスタンス変数がhtml.erbに渡るのを、**js.erb**に渡すということです。

# いいねボタンのHTMLを部分テンプレート化
いいねボタンの部分テンプレートを作成します。

“`erb:app/views/favorites/_favorite-btn.erb
<% if book.favorited_by?(current_user) %>
<%= link_to book_fa

元記事を表示

【Rails】データの状態遷移をわかりやすく定義できるGem「AASM」

どうもこんにちは。

コード理解を進めている中でAASMというライブラリが何者なのか知る必要がありそうなので、調べてみました。

# AASMについて

ChatGPTに聞いてみたところ、以下のような返答が返ってきました。

> `AASM(Acts As State Machine)`は、オブジェクトの状態を管理し、状態間の遷移を定義するためのRubyライブラリです。このライブラリを使用すると、モデルの状態遷移を宣言的に記述でき、コールバックや条件付き遷移などの高度な機能を利用することができます。

ちょっとよくわからなかったですが、よく調べてみると、
**データの状態を変更する前と後で明示的に処理を分けることができてメソッド化できる**ライブラリということです。

これは実際にコードを書いて理解するのがわかりやすそうです。

## modelを用意

以下のようにテーブル,モデルを用意します。

contentsテーブル
| カラム名 | 型 |
| — | — |
| id | integer |
| title | string |
| status | integer

元記事を表示

【rails】bootstrapを導入した際にcssを読み込ませる方法!

今回はbootstrap導入方法からその後のcssの読み込み方法に関して説明します!

## bootstrap導入
既に導入済みの方は飛ばしてください。

#### 1. yarnでインストールする
“`terminal
$ yarn add jquery bootstrap@4.6.2 popper.js
“`
#### 2. config/webpack/enviroment.jsを編集
“`javascript: congfig/webpack/environment.js
:
:
///以下すべて追加してください
const webpack = require(‘webpack’)
environment.plugins.prepend(
‘Provide’,
new webpack.ProvidePlugin({
$: ‘jquery/src/jquery’,
jQuery: ‘jquery/src/jquery’,
Popper: ‘popper.js’
})
)
“`
#### 3. app/javascriptの配下にst

元記事を表示

【日記?考察?】pluckメソッドとfind_byメソッドはどこで使うのか

こんばんは!
今まであまり使う機会がなかったメソッドをこの機に理解しよう!とおもったのですが、
pluckメソッドの使いどころがいまいちピンとこず、
今回は**pluckメソッド**と**find_byメソッド**について考えてみるというふわっとした感じです:cactus:
(現在DM機能がうまく実装できず煮詰まり中。。。)

## pluckメソッドはどんな時に使う?
> pluck メソッドは、指定されたカラムの値を直接データベースから取得し、ActiveRecord オブジェクトのインスタンス化をせずに値の配列として返します。これは特に、カラムの値を素早く配列として取得したい場合に便利です。

↑引用元は[こちら](https://zenn.dev/kumasaka/articles/d17ddda0c9476b)

初心者(私)はこれでもすぐ理解できなかったので、自分の言葉に直して使った状況も踏まえながら説明してみたいと思います。

ということで、私がどういうタイミングでpluckを使う流れになったのか考えてみました。

まさに絶賛煮詰まり中のDM機能実装の際、
ログイン中のユ

元記事を表示

VSCode + Docker + Docker-compose +Railsのデバッグの設定方法

# 概要
`Dev container`の環境を作らず、ステップ実行でデバッグが出来る環境を作成しました。今回は、その方法を記載します。

# 事前設定
以下がインストールされている事が前提です。
– **Docker Desktop**
– **Visual Studio Code**
– **VSCode rdbg Ruby Debugger**

# ディレクトリー構成
“`sh
.
├── db/
│ ├── conf/
│ │ └── .env   
│ └── postgres_volume # ← コンテナー起動時に自動生成
├── web/
│ ├── vscode/
│ │ └── lanuch.json
│ ├── # rails関連のファイル
│ ├── Dockerfile
│ ├── Gemfile
│ └── Gemfile.lock
└── compose.yml
“`

# 環境構築
– `Dockerfile`の構成は下記
“`Dockerfile
FROM ruby:3.2.2
ENV LANG=ja

元記事を表示

gitコミットの取り消し

直前のコミットを取り消すには
“`
git reset –soft HEAD^
“`
ワークディレクトリの内容はそのままでコミットだけ取り消すことができる。

元記事を表示

【個人開発】スクール生活をより豊かにするためのアプリを開発しました🤖

## はじめに
私はプログラミングスクール「RUNTEQ」に通い、プログラミング学習をしております。
今回私はスクール生活での小さな悩みを解消するアプリを開発いたしました。

RUNTEQではカリキュラムなどで分からない問題があったときや、
就職活動等の話を受講生同士で相談し合いたい時に、
Discord(ビデオ通話・音声通話でのコミュニケーションツール)を用いて受講生同士で交流しあうことがよくあります。

その際に私は2つの思いがありました。
1. オンラインスクールであるため、気軽にDiscrodで集まる人を募集するハードルが少し高い…もっと気軽に声をかけたい!という思い
2. Xなどの投稿を通じて募集を行う人が多かったのですが、SNSのコメント欄などで、日程調整をすることが少し手間だな…という思い

今もRUNTEQでは交流は盛んでコミュニティによく助けられているのですが、
受講生同士が今よりももっと気軽に学習や就職活動の相談を行い、より交流の輪を広げることができるようになったらいいな…という思いがきっかけで、
Discordに集まる日程や時間を調整できるアプリと

元記事を表示

xxx_pathの”xxx”をどう設定するか調べるには

ターミナル上でdocker-compose run web bin/rails routesコマンドを実行する
(config/routes.rbに定義されたルーティングとそれぞれの Prefix, Verb, URI Pattern, Controller#Actionの対応表が表示される)

リダイレクト先のアクション(例:Controller#Action の tasks#show)の行を探す

その行の Prefix 部分を確認(例: “task”)。このPrefixに_pathを追加する(例:task_path)ことで、Railsが URI Pattern のパスを生成する。

元記事を表示

【Rails】外部キーの作成に便利?reference型とは?

こんにちは!
今回はテーブル作成時に使用するカラム**reference型**について紹介します!

## reference型を使う時はいつ?
 外部キー(FK, foreign keyともいう)を作成したいとき、integer型を用いてt.integer: xxx_idと単純に作ることもできますが、下の例のようにreference型を使うこともできます。

“`ruby: XXXX_create_xxxx.rb
t.references: user, foreign_key: true
t.references: group, foreign_key: true
“`
このように用いますが、reference型を知らない方は、あれ?外部キーを作るのにカラム名に_idが抜けてる?となると思います。
実は、reference型はマイグレーションファイル上ではuserやgroupとしか表示されて
いませんが、 rails db:migrate後にuser_id、group_idのように自動で外部キーのカラムが作成されるという特徴があります。

## 外部キー制約が必

元記事を表示

【Rails】CSV出力機能を簡単に作成する

## はじめに
Railsでモデル(Item)のデータを取得しcsv出力する機能を作成する

## 環境
`ruby 2.7.2p137`
`Rails 6.0.3.4`

## コンロトーラー
~~~ruby:app/controllers/items_controller.rb
require ‘csv’

def export_csv
items = Item.all # 出力したいデータと取得します
headers = [‘id’, ‘name’]
data = CSV.generate do |csv|
csv << headers # 1行目ヘッダーになるため、項目をheadersに代入して初めにcsvに書き込みます。 items.each do |item| csv << [item.id, item.name] # 1行目にヘッダーを書き込み終えたら、2行目以降はitemsをループ処理で書き込んでいきます。この時ヘッダーの項目と出力する値が乖離しないように同じ順番にしています。 end end send_data

元記事を表示

Thrusterを楽しみにしている

先日、Rails8のマイルストーンが発表された。

その中でAirlockという謎のワードがでていたのをご存知だろうか

Railsのフロントエンドは7以降import-mapsを使ったstimulusコントローラのオートローダーを導入している

基本的に何もしなければRailsアプリケーションはTurboによって最初からSPA化されてるということもあり、このローダーはデフォルトで初回表示時にimport-maps内に記載されてるStimulusコントローラの全ダウンロードを実施する

https://github.com/hotwired/stimulus-rails#:~:text=controllers%20are%20pinned.-,By%20default%2C%20your%20application,controllers%2Findex.js%20file.,-When%20lazy%20loading

この読み込みを高速化するため、Rails7系以降はhttp/2化がパフォーマンス上の重要な要件となっている

https://x.com/dhh/status/17

元記事を表示

[Ruby on Rails]stimulusを用いたプレビュー画像表示機能実装(初学者向け)

私は現在、未経験からのエンジニア転職に向けてプログラミングスクールで学習をしている、いしかわと申します。

今回Webアプリケーションの個人開発で`stimulus`を用いたプレビュー画像表示機能を実装したのでアウトプットとして記事にしたいと思います。
どなたかの参考になれば幸いです。

:::note warn
プログラミング初学者なので、内容に誤り等ある可能性があります
誤りがありましたら教えてくださると幸いです
:::
**環境**
・Mac M1
・Ruby3.2.2
・Ruby on Rails 7.0.8
※importmapではなくesbuildでバンドルしています

# 期待する実装内容
入力フィールドから画像を選択した時、その画像がいずれかの場所に表示される
その画像は保存されているわけではないプレビュー画像とする

# stimulusコントローラの作成
`javascript/controllers`配下に`image_preview_controller.js`を新たに作成します
“`javascript:image_preview_controller.js

元記事を表示

【Rails】has_manyでオートセーブが設定できるのは便利

どうもこんにちは。

今回は、モデル同士の関連付けを定義する時によく使用される`has_many`での便利なオプション`autosave: true`についてメモします。

以降は、以下の記事の知識(`build`メソッド)を使用しています。

https://qiita.com/PDC-Kurashinak/private/413059bf52c7ab14ed16

## has_manyってなに?

`has_many`とは、モデル同士を関連付けるために`belongs_to`と一緒に使用するものです。

UserモデルにPostモデルが子として紐づいていることを定義したい場合は、以下のように定義します。

“`ruby
# Userモデル
class User < ApplicationRecord has_many :posts end # Postモデル class Post < ApplicationRecord belongs_to :user end ``` has_manyにはオプションがいくつかあり、最も使用されるものは`dependent:

元記事を表示

Railsガイド +α メモず 【バリデーション】

# はじめに
[Active Record バリデーション](https://railsguides.jp/active_record_validations.html)を読んでわからなかったこと、メモです。

気になった見出しがあればご覧ください。
# メモず
## バリデーションの種類
### モデルレベルでのバリデーション
Railsの基本的なバリデーション
### データベース制約
メリット:複数のプログラミング言語を使用するプロジェクトであれば、大元であるデータベースレベルでバリデーションをすることは理にかなう。
デメリット:バリデーションのテストはアプリケーションと分離して行わねばならず、保守も困難になる可能性がある。
### ストアドプロシージャ
SQL文をまとめて保存し、関数のように名前で呼び出す。
データベース制約の一種
### クライアント側でのバリデーション
メリット:扱いやすい
デメリット:ユーザーによってバリデーションを変更されてしまうリスクがある。
### コントローラレベルのバリデーション
メリット:手軽
デメリット:再利用性が低い、一貫性が欠如する、全体

元記事を表示

rails db:resetとrails db:migrate:resetの違い

## 発端:データベースのデータ型を間違えて作成していたことに気づいた
データベースを作成後、データ型が間違えていたことに気づいたため、マイグレーションファイルを修正してから「rails db:migrate:reset」を実行しました。

## rails db:resetとrails db:migrate:resetの違い
### rails db:reset
db/schema.rbファイルを元にDBを作成する。
マイグレーションファイルは利用しない。

### rails db:migrate:reset
DBを削除した後に、マーグレーションファイルを古い順から実行してデータベースを作成する。

## 結論:便利!
どうやってデータ型の修正をしよう?
ロールバックだと手順を一つ戻るらしいから、色々やった後だとどうなるのかよく分からないし・・と思っていたので、マイグレーションファイルを修正して実行し直せばいい「rails db:migrate:reset」は便利だな!と思いました。

## 参考
・[Rails: db:reset よりも db:migrate:reset を使

元記事を表示

【Rails】Rspecで500エラーが出る

# はじめに
この記事では、学習中に出会ったエラーとその解決までの道のりを自分のために記録しています。
初学者のため理解が不十分なところがあるかもしれません。その場合はご指摘いただけると幸いです。

# 起こった問題
Solidusを使用してECサイトを作成中、Rspec(リクエストスペック)を実行したところ500エラーが返ってきた

# 結論
テストに使用しない場合でもviewで使用しているデータはテストデータとして作成しておく

# 解決までの道のり
### 前提条件
– Solidusに予め用意されているテストデータを使用
– viewには商品カテゴリーのパンくずリスト、商品画像、商品名、金額を表示

### 発生したエラー
スペックファイルは下記のように記述
“`spec/requests/product_spec.rb
require ‘rails_helper’

RSpec,describe “Products”, type: : request do
describe “GET /products” do
let!(:product) { create(:

元記事を表示

Railsでログインを押すとログアウトに表示を変更する方法

## Railsでログインを押すとログアウトに表示を変更する方法

今回はRuby on Railsでログイン機能を実装します!
ログイン機能を実装しようとすると、ログイン・ログアウト・新規登録のボタンが3つできるかもしれません。今回は3つできるボタンを2つで実装し、ログインボタンを押したらログアウトと表示できるようにしていきたいと思います!(イメージは以下の動画です)
![ログイン.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3687617/30d26900-51b4-51bb-0646-223227b9db92.gif)

:::note warn
注意
この記事は、すでにログイン・ログアウト・新規登録の実装ができていることを前提に書いています。
:::

### 目次
1.View周り
2.コントローラー設計
3.ルート周り

## View周り
まず、ビューページのどこかに以下のようにログイン・ログアウト・新規登録のボタンを実装しているかもしれません。

“`ruby:tweets/i

元記事を表示

Devise 使用 Rails アプリで、パスワード変更機能をユーザー情報編集から分離➡パスワードリセットと統合してみた話

## 概要(やってみたこと)

1. ユーザー編集画面で、パスワードとそれ以外の属性の編集画面を別々にする
1. パスワード**以外**の編集時は確定時のパスワード再入力を不要とする
1. パスワード変更画面/処理はパスワードリセットのView/Actionと共用にしてパスワード変更処理を一つにする

末筆の通りあまりお行儀は良くない気がするので、コードの量より分かりやすさが重要な状況(大規模プロジェクトetc.)には向かないと思います。
コード量抑制を重視する状況下では使いどころもあるかもしれませんが、こんなやり方もできたという一種の頭の体操的に捉えて頂けますと幸いです🙏

なお前提として、本稿内では Devise の認証対象のモデルは「`User`」としています。
モデル名が異なる場合は適宜読み替えてください。

## ソース・環境

ソース全文・全履歴は下記になります。なるべく対応内容ごとの変化が分かりやすいようにコミット単位も調整しました。

https://github.com/k-yamauchi-1/passwords_edit_with_devise

ローカル環境は

元記事を表示

text_fieldとtext_areaの違い

## text_fieldとtext_areaの違い

text_fieldは一行しか入力できないけど、text_areaは複数行入力できる。

元記事を表示

【Rails】意図していないアクションが実行されてしまう時に確認してほしいこと

## はじめに
Railsでアプリ開発をしていて、意図通りにアクションが実行されないことはよくあると思います。
その原因は様々あると思いますが、今回は未来の自分の為にいくつか例を投稿します。
ついでに初学者の方々の助けにもなれば幸いです。

## ルーティングの記述の順番を確認する。
Railsのルーティングは、ルートの定義順によって評価されます。
つまり、最初にマッチしたものが実行されます。
以下の場合`item_export_list_path`をリクエストすると
`item#export_list`ではなく`item#show`が実行されてしまいます。
~~~ruby:config/routes.rb
post ‘items/:id’, to: ‘item#show’, as: ‘items_show’
post ‘items/item_list’, to: ‘item#export_list’, as: ‘item_export_list’
~~~
なので以下のように順番を入れ替えて修正
~~~ruby:config/routes.rb
post ‘items/item_lis

元記事を表示

OTHERカテゴリの最新記事