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

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

Rails6 gem serviceworker-rails で PWA化

# はじめに
WebアプリケーションをネイティブなアプリのようにできるPWA化に憧れて、実装してみました!
紆余曲折しましたがなんとか完成!
忘れないうちにまとめておこうと思います!

おおまかな流れは、こちらのREADMEを参考にしています↓

https://github.com/rossta/serviceworker-rails

# 前提
Ruby 3.1.2
Rails 6.1.7.7

Rails6以降の記事が少なくて…!苦戦しました💦

# Serviceworkerの導入

#### gem導入

“`Gemfile.
gem ‘serviceworker-rails’
“`

“`
$ bundle install
“`

ファイルはコマンドを実行すれば、自動作成してもらえます

“`
$ rails g serviceworker:install
Running via Spring preloader in process 31804
create app/assets/javascripts/manifest.json.erb

元記事を表示

【勉強】大学院生がRuby on Rails勉強してみた

## はじめまして
こんにちは.理系大学院生(数学専攻)です.
備忘録的に文章を残しておこうと思います.誰かの役に立てば万々歳ぐらいのやつです.就職した後に自分で見て赤面してくれー(笑).

## どんなひと?
AtCoderで競技プログラミングをやったりちょっっとだけ研究でプログラムを書いたりしているだけで,あまりにも開発経験が浅いということだけ先に.
競プロでPython,研究でC言語を使っています.

最近就活しなきゃなーってなってインターンに参加してみたはいいものの,本当に参加しただけになってしまった気がしてる(一応選考ルート乗ってみるけど不安)

## エンジニアインターンに参加してみて分かったこと
### ①エンジニアのしゃべってる言葉が分からない
くらす?えらーはんどりんぐ???いんすたんす?????みたいな.話に全然ついていけなくてめちゃくちゃ迷惑かけました
### ②バックエンドでRuby on Railsが使われがち
私が見てる会社だけかも.MVCモデルおもろそう.
### ③プログラミングやっぱりたのしい!
これは本当に気付けて良かったこと.エンジニアたのしそう.

元記事を表示

課題ドリブンな個人開発で「Members Hub」というWebアプリを作った

# はじめに

この度、[Members Hub](https://members-hub.onrender.com/) というWebアプリを開発しました。

サークルや部活などの「チーム」を対象として、メンバーのプロフィールを検索して閲覧できるプラットフォームを提供するためのサービスとなっています。

開発の記録として、この記事を残すことにします。

![linkedin_banner_image_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3657525/af9815af-1596-12bd-9c67-4c8b41d2ac98.png)

### サービスURL
https://members-hub.onrender.com/

:::note warn
~~Renderの無料枠でデプロイしています。そのため、サイトの立ち上がりに20〜30秒かかる可能性があります 。~~
:::
:::note notice
上の件ですが、[Cloud Scheduler](https://cl

元記事を表示

Rust+Locoでサービス開発してShuttleにデプロイまで試してみる

# Locoとは

RailsにインスパイアされたRust製のウェブアプリケーションフレームワークです。

https://loco.rs/

主な機能はこんな感じです。Railsに慣れていればとても親しみやすい構成です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/64098/ae3fc5d1-2abc-75d7-4ecf-a4e97ad599da.png)

※MVCではありますが、ViewはJSONがデフォルトなので、RailsのAPIモードのような感じです。

# Shuttleとは

Rust用のHerokuのような感じです。Rustアプリケーションを簡単にデプロイできます。
Postgresqlなどのサービスもある程度無料で使えます。
Heroku同様、コマンド1つでデプロイできてSSLのURLが付与されて即アクセスできて便利です。

https://www.shuttle.rs/

# 作ったもの

[haikunator](https://github.com/usm

元記事を表示

【個人開発】ソロ活をお助け!ひとり外食専用投稿アプリを作成しました🍽️【Rails】

# はじめに
こんにちは、なかじ(@nakayama-bird)と申します。
現在、プログラミングスクールに通ってRuby on Railsを学習しております。
今回スクールの卒業制作として、ひとり外食に特化した飲食店の投稿アプリを作成しました。

**サービスURL**
[Me Time Meals | ひとり外食投稿アプリ](https://www.metime-meals.com/)
![ogp.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3760414/426caa33-0097-02b6-a57c-10479f3a495b.png)

**リポジトリ**

https://github.com/nakayama-bird/metime-meals

:::note warn
私はプログラミング学習中で、初学者です。
内容に誤りのある場合がございます。
もし間違いがあればご指摘いただけますと幸いです。
:::
## 目次
[1.アプリの紹介](#1-アプリの紹介)
[2.技術構成](#2-技術

元記事を表示

【Rails】delete_allでエラーが発生する

## はじめに
Railsのアップデート中にdelete_allを使用している箇所でエラーが出たので、その対応をまとめます。

## 問題
コード
“`ruby
User.delete_all(company_id: company.id)
“`

エラー文
“`ruby
wrong number of arguments (given 1, expected 0)
“`

## 解決方法
Rails7では、delete_allに引数を取れなくなっているので、whereを使用するように修正します。
“`ruby
User.where(company_id: company.id).delete_all
“`

## 参考
https://qiita.com/migaruna_debu/items/ad685c6d75d7af5fa7d9

元記事を表示

[ Rails ] アプリ内のコメント通知をLINEで行う方法

はじめに

こんにちは!
個人開発アプリの通知機能のまとめ記事です。
全3回構成となっており、今回は最終回として、アプリ内のコメント通知をLINEで行う方法について説明します。

個人開発のまとめ記事はこちらからご覧ください。

https://qiita.com/CarBoss1996/items/63c14260fc7fe65da78e

前回記事たちはこちらからご覧ください。

https://qiita.com/CarBoss1996/items/e619335206076301e00f

https://qiita.com/CarBoss1996/items/fba0f499160f0d4530d7

開発環境

・Ruby on Rails 7.1
・Ruby 3.2.3

完成物

ユーザーの投稿に新規コメントが作成されると、LINEに通知が送られます。
通知にはリダイレクトURLも含まれており、簡単にアプリに戻ることができます。

![image.png](https://

元記事を表示

RSwagを使ったAPI仕様書の自動作成

## 前置き

公式Docにも掲題手順はありますが、備忘録として自分の言葉でも残して置こうと思い書きました。

### 公式Doc

https://github.com/rswag/rswag?tab=readme-ov-file#enable-swagger-endpoints-for-swagger-ui

### この記事で説明すること
– RSwagを使ったAPIDoc自動生成する環境構築

### この記事で対応しないこと
– レスポンスのプロパティ情報の生成
– デプロイツールを使った場合のDoc自動作成

## 手順

### RSwagインストール

gemファイルに次の行を追加
`gem ‘rswag’`

app環境のCLIで

“`shell
bundle install
“`

インストールジェネレータを実行

“`shell
rails g rswag:install
“`

このコマンドでswaggerのAPI仕様書用のルーティングが自動作成されるので、アクセスできるか確かめてみる。
`/api-docs` にアクセス(例:http://127.0

元記事を表示

プロフィール画像の編集を非同期処理で実装する方法

## はじめに
railsのCRUD操作には慣れてきましたが、JavaScriptを使った非同期処理にまだまだ手こずっているので、学習記録として実装した非同期処理を記載します。
特に今回の実装ではchatGPTにかなり助けられた面があるため、なぜそのコードにしているのか、という点も含めて言語化していこうと思います。

## やりたいこと
![20240915_recording.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3875060/54a3a46d-6e39-79e5-b899-29421081bf27.gif)

– JavaScriptから画像をPOSTする
– POST後非同期処理でprofile画像を表示する

### 具体的な方法
– axiosとrails-ujsを導入し、javascriptからpost/putする
– javascriptでプロフィール画像の設定状況を確認し、条件に応じて画像の出し分けをする

### 前提
– rails6を使用
– UserとProfileは1

元記事を表示

オブジェクトとハッシュを照合するには?flattenメソッドの使用

この記事はプログラミング学習者がアプリ開発中に躓いた内容を備忘録として記事におこしたものです。内容に不備などあればご指摘頂けると助かります。

###### 制作しているクローンアプリの中でControllerで取得したある2つのデータをハッシュとオブジェクトの文字列という形で保存していました。これらのデータを称号する為に調べて実装した内容を掲載します。

## 実装したコードの紹介

“`ruby:tweets_controller.rb
def show
@tweet = Tweet.includes(images_attachments: :blob).find(params[:id])
@comments = @tweet.comments.includes(user: { icon_attachment: :blob }, images_attachments: :blob)
@replies = {}
@comments.each do |comment|
@replies[comment.id] = Comment.whe

元記事を表示

yarn install –check-filesをしたらnode-sassが読み込まれないエラー

自分用備忘録として作成
(初心者のため、もし違っていたら教えていただけると幸いです。)

課題でクローンしたアプリケーションを立ち上げるためにyarn install –check-filesをしたら、
error /Users/yec2016/workspace/dpro/rails_refactoring_task/node_modules/node-sass: Command failed.とエラーが出た。

環境は、
mac
node -v 18.18.0
node-sass -v 4.14.1
yarn -v 1.22.22

解決方法としては、node-sassのバージョンに対応できるnodeバージョンまで下げる。(pythonが読み込めないというエラーもあったため、pythonをインストールしたが、意味がなかった。)

#node-sassのバージョン確認
npm list node-sass
football_info_for_refactoring@0.1.0 /Users/xxx/workspace/xxx/rails_refactoring_task
└─┬ @

元記事を表示

【Rails】rails assets:precompile実行によりCSSを更新できなくなった

# 動作環境
OS: macOS
Rails: 7.2.1
Ruby: 3.2.3

# 事象
Webアプリ作成中、カスタムCSSの内容を変更したところ、変更後のスタイルが適用されず変更前のスタイルが維持されてしまいました。

“`app/assets/stylesheets/styles.css
/* 変更前のCSS */
.haikeigazou {
background-image: linear-gradient( …省略… );
background-color: #FFF;
background-size: 16px 16px;
}
“`
“`app/assets/stylesheets/styles.css
/* 変更後のCSS */
.haikeigazou {
background-image: url(background.jpg);
background-size:cover;
}
“`
検証ツールを確認すると、やはり変更前のCSSが適用されています。
[![Image from Gyazo](https://i.gyazo.c

元記事を表示

[ Rails ] LINEアカウントIDを取得して個人アプリのユーザーIDと連携させる

はじめに

こんにちは!
前回の記事の続きになりますが、LINEアカウントIDを取得して個人アプリのユーザーIDと連携させる方法についてまとめていきます。
前回記事はこちら

https://qiita.com/CarBoss1996/items/e619335206076301e00f

追記:今回の連携方法はワンタイムコードを用いての方法ですが、LINEログインを実装するとログイン時にuidが送られてきて、そのuidがline_user_idとなるので、今回のこの実装がより簡単になります。

開発環境

・ Ruby on Rails 7.1.3.4
・ Ruby 3.4.4

完成物

今回のアプリでは、ユーザーが「通知設定」とメッセージを送ると、ワンタイムコードとリダイレクトURLが返されます。

![IMG_4673.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3871424/6967780e-eb50-e5

元記事を表示

YAMLの作法

今回は、インターンの中で利用した、ymlについて話していきたいと思います。
# YAML (YAML Ain’t Markup Language)とは?
ymlとは、一言で言えば、
【データを直感的かつ人間が読みやすい形式で記述するためのデータ表現形式】です。
“`
name: John Doe
age: 30
email: john.doe@example.com
“`
:::note info
こんな感じで使う
:::
# 今回どんな時に使ったか
Webサイトの中で用いられている、英語の情報を日本語表記に変換するのに使いました。
例えば、
“`
ja:
hello: “こんにちは”
user:
name: “名前”
email: “メールアドレス”
messages:
welcome: “ようこそ、%{name}さん!”
goodbye: “さようなら!”
“`
これをconfig/locales/ja.ymlに記述します。そしてビューで表示させるには、
“`
<%= I18n.t('hello') %>
<%= I18n.t

元記事を表示

Railsでアバター画像が設定されていないときにプロフィール編集ページにリダイレクトする設定方法

## やりたいこと
ユーザー登録後、プロフィール画像を登録していない場合にはプロフィール設定のページに遷移したい
※抽象化すると、特定の条件を満たすとき、特定のページに遷移させたい

### 前提
– Railsを使用
– User has_one Profile の関係
– ユーザーがSign upしたタイミングではprofileはつくられない

## 課題
– プロフィールは自動で生成されないため、`unless current_user.profile.avatar.attached?`のような条件文だと、.nilクラスのエラーが出る
– application_controllerにプロフィール編集画面へのリダイレクトを記載すると、リダイレクトが繰り返されしまう

## 解決策
### 条件文の記載方法
application_controllerに以下を記載。
“`
before_action :check_avatar

private
def check_avatar
if user_signed_in?
unless current

元記事を表示

【Rails】グループ機能の実装手順

この記事では、Railsでグループオーナーが作成したグループに、ユーザーがグループに参加・離脱できるようなグループ作成機能を実装する方法をまとめています。

## 作製するモデルのアソシエーション
今回作成するテーブルは`GroupUser`と`Group`のふたつです。

![スクリーンショット 2024-09-14 204259.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882438/2a5cb3bb-4522-1448-b5b0-fb7e73f0735f.png)

### Groupテーブル
グループの情報を保存します(`name`、`introduction`、`image_id`など)。
`owner_id`フィールドにより、グループの所有者(ユーザー)を表します。
### GroupUserテーブル
中間テーブルで、ユーザーがどのグループに所属しているかを管理します。
`user_id`と`group_id`で`User`と`Group`を関連付けています。

# 実装手順
## 1

元記事を表示

[ Rails ] 個人アプリのユーザーに公式LINEを友達追加してもらい、LINEでメッセージを送信する

はじめに

こんにちは!
個人開発アプリにLINE通知機能を実装する際の備忘録です。
通知機能の完了まで結構内容が重たいので、実装内容ごとにまとめていく予定です。
今回は個人アプリのユーザーに公式LINEを友達追加してもらい、LINEでメッセージを送信するところまでをまとめました。

個人アプリの詳細な説明についてはこちらの記事をご参照ください。

https://qiita.com/CarBoss1996/items/63c14260fc7fe65da78e

開発環境

・Ruby on Rails 7.1
・Ruby 3.2.3

完成目標

・ 作成したアプリのアカウントとLINEアカウントのIDを連携させる。
以下は私が作成したアプリのLINE画面ですが、通知設定をすることで連携ができるようにしています。

![IMG_4673.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3871424/1bf60fae

元記事を表示

deviseで作成したUserモデルに自分で設定したいフィールドを追加する方法

## やりたいこと
こんな感じでdeviseで作成したサインアップ機能にaccount名を入れられるようにしたい
![スクリーンショット 2024-09-13 180650.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3875060/9f29c254-45bb-1447-3fd3-af34f9937671.png)

## 課題
– マイグレーション時にaccount用のカラムを作成する必要がある
– deviseが標準で設定しているストロングパラメーターをいじる必要がある

## マイグレーション時の対応
マイグレーションファイルに以下のように追記する
※今回はUniqueにしたかったので、その設定もしています
“`
class DeviseCreateUsers < ActiveRecord::Migration[6.0] def change create_table :users do |t| ## Database authenticatable t.s

元記事を表示

Rubyでの配列における |(和集合)と ||(論理演算)の違いを調べた

最近、Ruby Silverの資格試験の勉強をしています。全然Rubyのこと理解してないんだなぁと絶望しつつも伸びしろを感じております😚

以下の問題を考えていた際に、配列に対する `|` と `||` の違いが気になったので調べてみました。


問題:

XXXXに記述することで、実行結果が30以上になるプログラムを選択してください。

“`ruby
a = [-1, 2, 3, 4, 5]
b = (4..6).to_a

puts XXXX
“`

選択肢:

1. `a.inject(:+) + b.inject(:+)`
2. `(a | b).inject(:-).abs + (a & b).inject(:+).abs`
3. `(a | b).inject(:*) + b.inject(0) { |x, y| x + y ** 3 }`
4. `((a || b).map(&:succ).inject(:*) * (a && b).inject(:*).abs2 + 29)`

この問題の`a | b` と `a || b` の結果がどうなるか分からな

元記事を表示

Bulletがいつも正しいわけではない?!

この記事はプログラミング学習者がアプリ開発中に躓いた内容を備忘録として記事におこしたものです。内容に不備などあればご指摘頂けると助かります。

私は普段のプログラミング学習中にRailsのgemでN+1問題や不要なeager loading(includes)を検知してくれるBulletを使用しながらアプリの制作をしています。
自分でも気付き難いN+1問題などもありますので、普段は自動検知して教えてくれて助かっています。

今回はそんなBulletが検知してくれるN+1問題や不要なincludesがどうやらいつも正しくはないようだ、との考えの基に記事を書いています。

まずは検知メッセージと実際のコードをご紹介します。

対象のeager loading(不要なincludes)検知メッセージ
![スクリーンショット 2024-09-13 13.19.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3508918/66e71273-d0cb-d454-8a51-e376edbda527.png)

元記事を表示

OTHERカテゴリの最新記事