Rails関連のことを調べてみた2021年10月08日

Rails関連のことを調べてみた2021年10月08日

Rails CSRF対策について

#CSRFとは
Cross Site Request Forgeryのことで、
Webアプリに知らない間にリクエストが送られる不正攻撃のことです

例えばインスタで知らない間に自分の投稿を消されていたりしたら
CSRFです。

#CSRF対策の設定
application_controller.rbに下のような記述をすると、

“`
Can’t verify CSRF token authenticity
“`
というエラーが出てきます。このエラーが出たらCSRFのエラーで
Railsがちゃんとしたリクエストがいっているかどうかを CSRF Tokenというもので
確認するのですがそれが確認できないというエラーです。

“`application_controller.rb

class ApplicationController < ActionController::Base protect_from_forgery with: :exception end ``` #解決策 application_controller.rbに下のような記述をします。 `

元記事を表示

Railsのform_withの使い方を素人ながらまとめました。

##form_withはフォームにす関するHTML要素を簡単に生成することができる便利なメソッド

まずフォームの値をデータベースに保存する際の書き方です。
↓railsでこう書くと

“`java
<%= form_with(model: @user, local: true) do |f| %>
<%= f.label :name %>
<%= f.text_field :name %>

<%= f.label :email %>
<%= f.email_field :email %>

<%= f.label :password %>
<%= f.password_field :password %>

<%= f.label :password_confirmation, "Confirmation" %>
<%= f.password_field :password_confirmation %>

<%= f.submit "Create my account",

元記事を表示

【Rails + Vue】変更が反映されない!?と思ったら bin/webpack-dev-server 忘れだった人の記事(foremanで一元管理する)

久々に開発を再開しようとしたら、変更したコードがビューに反映されなくて、てんやわんやしました。
Rails6 + Vue3で、webpackerを使って環境構築しており、`rails s`と `bin/webpack-dev-server`を、それぞれ手動で立ち上げていたことをすっかり忘れていただけだったのですが、いっそまとめて管理しようと心に誓いましたので、まとめます。

# gem foreman を使ってみる
## インストールする
gem [foreman](https://github.com/ddollar/foreman) を使って一元管理を試みます。アプリケーション実行の際のコマンドをまとめて管理できるという、ありがたgemです。

`Gemfile`に書いて `bundle install` しようとしましたが、この方法は非推奨とのこと。なので、以下を実行しましょう。

“`
$ gem install foreman
“`

## Procfileを新たに作成する

foremanは、Procfile の内容を継承するようになっているので、ここにコマンドを書いて

元記事を表示

RailsのN+1問題をincludesメソッドで解決する

## アプリの概要(前提)
[![Image from Gyazo](https://i.gyazo.com/e4e30c01447d6af3ec95ce71221af4a9.gif)](https://gyazo.com/e4e30c01447d6af3ec95ce71221af4a9)

・こんな感じで、ユーザーaaaの投稿に対してコメントが6件ついていて、そのコメントと共に、コメントした人のユーザー情報(名前とプロフ画像)が載っている

・`/posts/8`にGETリクエストを送ると`views/posts/show.html.slim`が返される

・ユーザーaaaの`id`は`16`
・ユーザーoooの`id`は`17`

・Commentはbodyカラムを、Userはnameカラムとimageカラムを持つ

## N+1問題とは
N+1問題とは、データベースからデータを取り出す際に、必要以上にSQLが発行されることで、パフォーマンスが悪くなる(処理速度が遅くなる)問題のこと
## 具体例

先程のアプリのpostsコントローラー

“`ruby:posts_co

元記事を表示

バリデーションとは!

#①結論!

バリデーションとは、データの入力に制約をかけるという事です!

データを登録する際に、一定の制約をかけることを言います!

例えば、以下のようなものがあります!

・空のデータが登録できないようにする!(ブログ記事など)

・既に登録されている文字列を登録できないようにする!(メールアドレスの登録など)

・文字数制限をかける!(パスワードなど)

バリデーションを設ける際は、モデルにvalidatesメソッドを記述します!

#②.validatesメソッド

validatesとは、バリデーションを設定する時に使用するメソッドです!

以下が記述方法になります!

“`php
モデルファイルへ記述

validates :カラム名, バリデーションの種類
“`

これが書き方です!

続いて下記の例は、presence: trueと記述することで、nameカラムが「空ではないか」というバリデーションを設けています!

“`php
モデルファイルへ記述

validates :name, presence: true
“`

これで完成です!

このバリデーショ

元記事を表示

初めてのオリジナルアプリ公開までの道のり

# 公開までの道のり

月 | やってたこと
— | ———————-
5月 | tech camp(教養コース入学)
7月 | tech camp(転職コース入学、夜間休日タイプ)
8月 | カリキュラム終了
9月 | オリアプ作成開始
10月 | オリアプ完成

卒業予定は1月、笑

# 公開したアプリの概

## アプリ名
**FX-Traders**
https://fxtraders.jp

## どんなアプリ?
fx取引の記録を公開できるアプリになります。そしてその記録をもとにグラフを作り結果を解析できるアプリです。
それを公開することで

* 自身が決めた取引ルールの厳守
* 取引ルールのブラッシュアップ
* 第三者からのフィードバック
* 他者取引への理解

などを狙っています。

## なんで作ったの?
まずは自分で欲しかったから。一番大きな理由でもありますね。学生の頃にfxの記録を紙のノートに書いていて、画像を残せないのが残念で書くだけで満足していて、笑笑
こんなことを思っている人がたくさんいるんじゃないか?って思ったのも作った理由の

元記事を表示

【超初心者向け】belongs_toとhas_many、アソシエーションってなに?

# belongs_toとhas_many アソシエーションについて

belongs_toとhas_manyが「あれ?どっちがどっちだっけ?」となっていたので、備忘録として記載。

####そもそも関連付け(アソシエーション)とは?
テーブル同士に関係があることを表現すること。

例えば、茶川さんという著者(author) がいて、羅生マンという本(book)を書いていたとする。(※架空の著者・本です。)

茶川さんはauthorテーブル、羅生マンはbook テーブルにそれぞれ保存されます。この状態は、一人の作者に対して一冊の本なので、「1対1」です。

ここで、茶川さんが「蜘蛛と糸」という本(book)を書いたとする。
すると、bookテーブルには新たに「蜘蛛と糸」という本が追加されるので、
一人の著者に対して複数の本が関連付いていることになります。
これが「1対多」の関係になるということになります。この際に、model 記載するのが「belongs_to」と「has_many」ということになります。
今回の例でいうと、一人の著者が複数の本を書いている(ここでは都合よく本が著者に

元記事を表示

railsチュートリアル第七章 エラーメッセージ

###エラーメッセージ
ユーザー登録の失敗によるエラーメッセージを表示させよう。

Userコンソールを使い、誤ったユーザー情報を入力してみよう。

“`rb
>> user = User.new(name: “Foo Bar”, email: “foo@invalid”,
?> password: “dude”, password_confirmation: “dude”)
(1.6ms) SELECT sqlite_version(*)
=> #
>> user.save
(0.1ms) begin transaction
User Exists? (0.8ms) SELECT 1 AS one FROM “users” WHERE “users”.”email” = ? LIMIT ? [[“e

元記事を表示

railsチュートリアル第七章 Strong Parameters

###Strong Parameters

“`rb
user = User.new(params[:user])
“`
paramsハッシュ全体を初期化するという行為はセキュリティ上、極めて危険
この場合誰でも管理者に化けることができるため

paramsを使うのに条件をつけた。
paramsハッシュでは:user属性を必須とし、名前、メールアドレス、パスワード、パスワードの確認の属性をそれぞれ許可し、
それ以外を許可しないようにする。

“`rb
params.require(:user).permit(:name, :email, :password, :password_confirmation)
“`
:user属性でなければ、情報を確認できないようにした。
それを解決した。

“`rb
class UsersController < ApplicationController . . . def create @user = User.new(user_params) # 外部メソッドを使う if @user.save

元記事を表示

railsチュートリアル第七章 ユーザー登録失敗

##ユーザー登録失敗
フォームを理解するには“`ユーザー登録の失敗“`のときが最も参考になる。
この節では、無効なデータ送信を受け付ける“`ユーザー登録フォームを作成“`し、ユーザー登録フォームを更新して“`エラーの一覧を表示“`します。

###正しいフォーム
“`rb
Rails.application.routes.draw do
root ‘static_pages#home’
get ‘/help’, to: ‘static_pages#help’
get ‘/about’, to: ‘static_pages#about’
get ‘/contact’, to: ‘static_pages#contact’
get ‘/signup’, to: ‘users#new’
resources :users
end
“`
urlにusersを入れることができる。
それによりcreateアクションを使い、新規作成者を作ることができたりした。

“`rb

`rails s` 実行時にRubyGemsのエラーが発生する

## 環境情報

– macOS Big Sur 11.6
– Ruby 2.6.1
– Rails 5.2.6

## 起きたこと

OSのアップデートやrbenvの再インストールを行った後、
`rails s` や `rails c` を実行した時に下記エラーが発生するようになってしまった  
(起きていた現象として、エラーが発生するだけで起動は行われる)

“`
/path/to/.rbenv/versions/2.6.1/lib/ruby/gems/2.6.0/gems/bundler-2.2.28/lib/bundler/rubygems_integration.rb:12: warning: already initialized constant Bundler::RubygemsIntegration::EXT_LOCK
/path/to/.rbenv/versions/2.6.1/lib/ruby/2.6.0/bundler/rubygems_integration.rb:12: warning: previous definition of EXT_LOCK wa

元記事を表示

rails-i18n による日本語化

基本的な流れ(自分用に)

# gem ‘rails-i18n’をインストールする

“`rb:Gemfile
gem ‘rails-i18n’
“`

Gemfileに「rails-i18n」を導入する。

“`:ターミナル
bundle install
“`
「rails-i18n」をインストール

# デフォルトの言語を日本語に設定する、i18nの複数のlocalesファイルが読み込まれるようにする

“`rb:config/application.rb

module RunteqNormal
class Application < Rails::Application config.load_defaults 5.2 config.generators.system_tests = nil config.generators do |g| g.skip_routes true g.assets false g.helper false g.test_framework

元記事を表示

enumの値によってviewページの表示を変えたい

#はじめに
現在プログラミング学習を始めて3ヶ月目の初学者です。
学んだことをqiitaに投稿という形でアウトプットするため、また備忘録として記事を作成しました。

##enumの値によってviewページの表示を変えたい
今回Todoアプリを作るに当たってタスクの種類をenumで管理してるので、そのenumの値によってそれぞれのタスクの種類のviewだけに表示させたい

###考えた方法
・controllerで指定

###controllerで指定
@tasks = Task.categories.find(2)
で行けるかなと思ったが
undefined method `sentence’ for [“よく使うタスク”, 0]:Array
と出るので確かにsentenceカラムはこれだと表示できないよなぁ。

@tasks = Task.where(category:2)
今度こそと思ったがviewにはなにも表示されない
と思ったがcreate時のログを見たところ “category”が”categories”になっていたのでform_withの記述をf.sele

元記事を表示

Railsプロジェクト内でReactを使う方法

RailsとReactを分離させてSPAで動かす記事はたくさん見つかるけど、そうではなくRailsプロジェクトの一部でReactを使う方法。
`react-rails`というgemを使う方法です。ほぼ以下のgemでの導入方法に近い記事です。
[reactjs/react\-rails: Integrate React\.js with Rails views and controllers, the asset pipeline, or webpacker\.](https://github.com/reactjs/react-rails#get-started-with-webpacker)

## 環境
– Rails 6.1.4
– Ruby 3.0.0

# Reactの導入
まず導入したいrailsプロジェクトディレクトリ内に移動し、railsコマンドでReactとその関連ファイルをインストール。

~~~zsh
% rails webpacker:install:react
~~~

インストールすると、`app/javascript/packs/hello_react.j

元記事を表示

[Rails]deviseで使えるモジュールについて

##初めに
####なぜこの記事を書きたかったのか
deviseを使うときのmodelの記述でわからないままにしてあったのがあったので、勉強するため記事にしたかった

####環境
・Macbook Air (Retina, 13-inch,2019)
・プロセッサ 1.6GHz デュアルコアIntel Core i5
・メモリ 8GB 2133 Mhz LPDDR3
・MacOS Big Sur バージョン 11.5.2

####記事の目次
**1)deviseって?モジュールって?**
**2)前提条件(deviseの導入)**
**3)モジュールの種類**
**4)モジュールの追加方法**
**5)最後に**

##deviseって?モジュールって?
####deviseについて
**deviseとはgemの一種で導入することでログイン/新規登録機能が簡単に使えるようになれる!**

####モジュールについて
**モジュールのイメージは機能が入っている箱の名前だと思う!これを使うことで1からコードを組んで作成しなくとも自分がほしいシステムと近いものが使えるのです!**

##

元記事を表示

デプロイに使用したAWSのサービスとインフラ知識のまとめ

ポートフォリオのデプロイに使用したAWSのサービスとその周辺のインフラ知識についてまとめました。

サービス一覧、

– VPC
– RDS
– EC2
– Route53
– IAM
– S3
– ACM
– ALB

# VPC

### VPCとは?
– Virtual Private Cloudの略で、AWS上に仮想ネットワークを作成できるサービス。
– AWSの広いネットワークの土地の中で自分だけの空間を作成できる。

### リージョン
– AWSの各サービスが提供されている地域のこと。
– AWSのサービスを使う場合まずリージョンを設定し、リージョン毎にサーバーを作っていく。

### アベイラビリティゾーン
– 独立したデータセンターのこと。
– どのリージョンにも複数存在している。理由は災害が起きて1つのアベイラビリティゾーンが止まっても他のアベイラビリティゾーンを使えるから。

### サブネット
– ネットワークを分割して作った小さなネットワークのこと。
– サブネット内で1つをインターネットからアクセス可能なWebサーバー、もう1つをアクセスできないDBサーバー

元記事を表示

Ruby 正規表現を使用して文字列からほしい文字を取得する!! 【gsubメソッド】【sliceメソッド】【scanメソッド】【最短マッチ】

[前回の記事](https://qiita.com/mm_st/items/3c613bdce6f18594355c)で取得したツイートから必要な内容を取得したい!!!と思い正規表現についてググったものをまとめていきます:)

# 正規表現
>正規表現(regular expression)は文字列のパターンを記述するための言語です。また、この言語で記述されたパターンも正規表現と呼びます。
正規表現を用いると、文字列が指定したパターンを含んでいるかどうかを判定し、また含んでいるならばそれが文字列中のどの場所であるかを知ることができます。

[Ruby 3.0.0 リファレンスマニュアル > 正規表現](https://docs.ruby-lang.org/ja/latest/doc/spec=2fregexp.html)

# 今回取得したツイート
このツイートから***値段*** ***ブランド*** ***アイテム名*** を取得したい!
> 【GUCCI】
インターロッキングGシルバー
¥40,700- tax in

>【Lansing store】
アロマキャンドル(4個)

元記事を表示

【Rails】便利な正規表現まとめ

オリジナルアプリ作成にあたり使用した正規表現を、備忘録としてアウトプットします。

#英数字混合
※大文字・小文字の区別なし

“`
/\A(?=.*?[a-z])(?=.*?\d)[a-z\d]+\z/i
“`

#半角数字のみ

“`
/\A[0-9]+\z/
“`

# 全角(漢字・ひらがな・カタカナ)

“`
/\A[ぁ-んァ-ヶ一-龥々ー]+\z/
“`
・`ァ-ン`ではなく`ァ-ヶ`としているのは`ヴ、ヵ、ヶ`を含めるため。
・`一-龥`ではなく`一-龥々`としているのは`々`を含めるため。
・末尾に`ー`があるのは「ジュリー」「メアリー」などのハイフンを含めるため。

# 全角(カタカナのみ)

“`
/\A[ァ-ヶー]+\z/
“`

#電話番号10桁以上11桁以下(ハイフンなし)

“`
/\A[0-9]{10,11}+\z/
“`

#郵便番号(ハイフンあり)

“`
/\A\d{3}[-]\d{4}\z/
“`

#今回登場した正規表現のパターン表記一覧

`[a-z]`: 角括弧で囲まれた文字のいずれか 1個にマッチ
`\d`:数字にマッ

元記事を表示

[Rails]非同期(Ajax)でのコメント機能実装

## この記事の目的
非同期処理(ajax)でのコメント投稿機能を学んだのでアウトプットします
## 目標
[![Image from Gyazo](https://i.gyazo.com/13b13c9847585f462000a341b671e8b8.gif)](https://gyazo.com/13b13c9847585f462000a341b671e8b8)
## 要件
コメント投稿は非同期で行う
## 環境
・Ruby 2.7.1

・Rails 5.2.6
## 前提
・UserとPostは作成済み

・bootstrapとjquery-railsが入っている

## 設計
ER図
[![Image from Gyazo](https://i.gyazo.com/919c4a7bc8f4e5e4c7ff50fb2efcdab1.png)](https://gyazo.com/919c4a7bc8f4e5e4c7ff50fb2efcdab1)

ルーティング

“`
POST /posts/:post_id/comments comments#creat

元記事を表示

git push heroku masterが失敗する

#書いた理由
備忘メモ

#起こったこと

rails tutorialを第3章を進める過程で
`git push heroku master`
を実行したとき、コケた

“`
remote: We will use “yarn” to install the CLI via “yarn add -D webpack-cli”.
remote: Do you want to install ‘webpack-cli’ (yes/no):
remote:
remote: !
remote: ! Precompiling assets failed.
remote: !
remote: ! Push rejected, failed to compile Ruby app.
remote:
remote: ! Push failed
“`

#解決したこと
webpack-cliを再インストールしたり、webpackを再インストールした上で、
最終的に再度以下を実行したらできた
`git commit -am “hog

元記事を表示

OTHERカテゴリの最新記事