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

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

Rails6.1でSwiperライブラリを使いたい

# 環境
macOS Big Sur Ver11.2.1
Rails6.1.1
webpacker5.0

# この記事の目標
カルーセルが手軽に実装できるライブラリ「Swiper」をRailsアプリケーションで使うべく、javascriptのファイルを新しく作成し、ビューで読み込ませる。
今回はapplication.html.erbではなく、個別のビューファイルにjsを読み込んでイベント発火させるのが目標。

“`ruby:app/views/layouts/application.html.erb



PracticeJs

<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag 'application', media: 'all', 'da

元記事を表示

これから学ぶ言語について

#HTML
##HTMLとは
– HTMLはHyper Text Markup Languageの略である。
– Webページを作る際に、マークアップ言語という視覚表現や文章構造を記述するための最も基本的な言語が使われるが、HTMLはこのマークアップ言語のうちの一つである。
– Webサイトやアプリ、電子メールなどを適切に表示するために使用されている。

##HTMLでできること
– ホームページビルダーなどのWeb制作ツールがなくてもWebサイトを制作できる。
– 無料配布されているWebサイトのテンプレートを自分なりにアレンジすることができる。

#CSS
##CSSとは何か
– CSSはCascading Style Sheetsの略である。
– 先述したHTML文章に、装飾やレイアウトを施すために使用される。

##なぜCSSが必要か
– Webページの見た目はHTMLでも指定することができるが、HTMLだけで行うとWebページの情報構造が乱れ、検索エンジンに理解されにくく、ブラウザによって表示のされ方が変わってしまう。
– そのため、HTMlとは別のファイルでCSSによってス

元記事を表示

[rails]renderメソッドのついて

#renderメソッドとはなにか
呼び出すテンプレート(ビュー)ファイルを指定するメソッドです。
コントローラー・ビューで使うことができます。

#renderメソッドの使い方
ビューファイルではこのようにつかいます

“`
<%= render 'ファイル名' %>
“`

しかし、ビューファイルでrenderメソッドを使うときは部分テンプレートを呼び出す場合がほとんどです。

#部分テンプレートとは
部分テンプレートとは複数のビューファイルの共通部分として作成するビューファイルです。
部分テンプレートを使えば、同じHTML構造の部分を共通化することができます。

#部分テンプレートの作成
部分テンプレートとしてビューファイルを作成する時は__tweet.html.erbのようにファイル名の前に_(アンダースコア)をつける必要があります。

このようなファイル名で作成すると部分テンプレートとして使うことができます。

#部分テンプレートを呼び出す
<%= render partial: ‘tweet’ %>
_と拡張子除いた形で呼び出します。
partialは部分テンプレートを明

元記事を表示

rails db:createエラーの解決例

routes.rb:6:syntax error,unexpected keyword_end
こちらのエラーはroutes.rbの6行目に何らかの文法エラーが存在するという内容です。

routes.rbの6行目の記述の末尾に「,」が入力されていました。
「,」はアクションの間に記述するので末尾にある場合はエラーになります。

元記事を表示

モデルにテーブル定義をコメントしてくれるgem、annotateが動作しない

Rails の開発お役立ち gem として有名な [annotate_models](https://github.com/ctran/annotate_models).
`rails db:migrate` した時に自動的にモデルの頭のところに対応するテーブル定義をコメントで追加してくれるアレです。この動作のことってアノテーティングと言うようですね。
とても便利なので重宝しているんですが、導入済みのプロジェクトでいつの間にか動かなくなっていました。最近テーブル定義の変更やっていなかったんで気付きませんでしたが、アレ?何かやったかな?

結論を言うとこれは annotate_models のデフォルトの挙動が変わったため。バージョンが2.7.xまでと3.1.x以上で異なっているので、古いバージョンから使っていた人はこの問題に直面します。
理由と対処法も公式にちゃんと書いてあります。

[Upgrading to 3.X and annotate models not working?](https://github.com/ctran/annotate_models#upgrading

元記事を表示

Rails 5.2 でPaypalのSmartPaymentボタンがリロードしないと表示されない問題

Rails 5.2 でPaypalのSmartPaymentボタンがリロードしないと表示されない問題に悩まされていた。
ページをリロードしたら表示されるので後回しにしていたけど、

Turbolinksを切ったら解決した。

元記事を表示

初心者のためのコンソールの使い方

はじめに

プログラミングスクールに通い、日々勉強中の初心者です。
普段はコードを書き、いちいちサーバーを起動しては、エラーが表示され修正…なんてことを繰り返しています。
そんな時に、コンソールを使用するととても便利だということが最近身に染みて少しずつ分かってきたので、今回も自身と同じような初心者の方に向けた投稿をしようと思います。

コンソールを立ち上げる

rails cのコマンドを実行すると、001 > と入力できる画面に切り替わります。

“`terminal.
$ rails c
Running via Spring preloader in process 18895
Loading development environment (Rails 5.2.4.4)
2.6.3 :001 >

“`

Userモデルを例に挙げて色々な動作を確認していきたいと思います。
普段コントローラーに記述している内容を、コンソールで確認・試すことができます。

①ターミナル上でユーザーを作成
必須情報のみを入力すれば、任意のカラムはnilで保存されます。
※NO

元記事を表示

データベース設計 READEME 制約 編

# 制約とは?
制約はDBにおいて、保存するデータに制限をかけるために
カラムに設定できるもののこと。
バリデーションに似ている、DBに直接設定しているため
後になって変更すると、手間がかなりかかるっぽい、、、

そのため、設計の際にしっかり考えて置く必要がある

– NOT NULL制約
– 一意性制約/UNIQUE制約
– 主キー制約
– 外部キー制約

の順に紹介

# NOT NULL制約
データ保存の際に、空の状態で保存できないようにするための制約。
難しく言うと、テーブルの属性値にNULL(空の値)が入らないように制限する制約。
__記述例__

“`rb:READMEファイル

| Column | Type | Options |
| —————— | ———- | —————————— |
| user | references | null: false, foreign_key:

元記事を表示

[Ruby on Rails] 詳細画面に遷移

##詳細画面への遷移方法

まず、ルーティングの設定をします。
今回は仮に**items**とします。
  

![スクリーンショット 2021-02-10 23.38.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1078698/29c50df4-848b-2a5e-8dc1-7b2607f240cb.png)

  

次に**index.html**に詳細ページへ飛ぶ為の記述を書いていきます。
![スクリーンショット 2021-02-10 23.49.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1078698/ce8775b6-7cf6-9fc7-4bac-6a5d46cbfb1d.png)

どのアイテムの情報か読み込めるようにパスには必ず**id**が必要になります。
  
上記の**item_path**は削除機能などと同じ**Prefix**なので
それを見分けるために、lin

元記事を表示

Railsチュートリアル 第6版 振り返り 第2章

#はじめに

このまとめ記事はRailsチュートリアルを1周終えた私が1周目で分からなかった所や記憶に残したい箇所のみをピックアップして記述しています。完全解説記事ではないので注意して下さい。

私と同じく2周目の方、たまに復習したいなと振り返りを行う方等におすすめです。

#ユーザーのモデル設計(2.1.1)

![demo_user_model.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/952874/7b86d776-22eb-12e5-ad32-b389906e56d6.png)
引用: [Railsチュートリアル2.1.1](https://railstutorial.jp/chapters/toy_app?version=6.0#sec-modeling_demo_users)図2.2

usersはデータベースのテーブル(**table**)

id,name,emailの属性はそれぞれテーブルのカラム(**column:列**)に相当する。

#マイクロポストのモデル設計(2.1.2)

元記事を表示

Railsのビューにeachメソッドで取得したデータの中身が全て表示されてしまう問題解決

### 概要
ERB形式で作ったビューに、eachメソッドを使って下記のように複数のタグを表示出来るような記述を書きました。

“`erb:ビューファイル
〜省略〜

<%= card.tags.each do |t| %>
<%= t.tag %>
<% end %>

〜以下略〜
“`

すると、ブラウザ上では

“`erb:ブラウザ上での表示
タグのテスト [#]
“`

と、配列全体が表示されてしまい、
いやいや君は別に呼んでないんだよなんじゃらほい状態となってしまったので、
対処法を探す流れとなりました

### 結論
原因はミスです。ええ、しょうもない凡ミスです。

`<%= card.tags.each do |t| %>`
ではなく、正しくは
`<% card.tags.each do

元記事を表示

【Rails、JavaScript】モーダルウィンドウに写真詳細画面を表示させる

# 概要
一覧の写真をクリックすると、モーダルウィンドウ内に写真詳細画面が表示される機能を実装します。

# 参照
### モーダルウィンドウ

基本的なモーダルウィンドウの作成方法とアニメーションの付け方は、これらの記事を参考にしました。

– JavaScriptでモーダルウィンドウを作ろう(ドットインストール)
https://dotinstall.com/lessons/modal_js_v3

– モーダルウィンドウ・ダイアログウィンドウの作り方1(HTML、CSS、JavaScriptで作る)

– モーダルウィンドウ・ダイアログウィンドウの作り方2(HTML、CSS、JavaScriptで作る)

### Ajax
remote: trueによるAjaxの実装方法は、この記事がわかりやすいです。

– 【Rails】remote: trueでフォーム送信をAjax実装する方法とは?

元記事を表示

Railsアプリで削除機能を実装する

#削除機能の概要
一覧画面の任意の投稿の「削除」ボタンをクリックすれば、確認ダイアログが出て、OKを押すとその投稿が削除され、一覧画面に遷移するようにします。また、詳細画面にもボタンを配置します。
##削除機能ボタンの追加
一覧画面に削除ボタン(リンク)を追加します。

“`ruby:app/views/posts/index.html.slim
tbody
– @posts.each do |post|
tr
td= link_to post.content, post
td= post.created_at
td
= link_to ‘編集’, edit_post_path(post), class: ‘btn btn-primary mr-3’
= link_to ‘削除’, post, method: :delete, data: {confirm: “投稿を削除します。よろしいですか?”},
class: ‘btn btn-danger’

元記事を表示

Rails | 動的ディスパッチを使って検索ロジックを一行にしてみる試み

良いこと思いつたと思って、一回これをやって先輩に怒られたので真似しない方がいいです。
ただ自分的に結構おもしろいなあと思ったのでメモ。

## 概要
[株式会社万葉の新入社員教育用カリキュラム](https://github.com/everyleaf/el-training)のタスク管理アプリを使います。
既に@yokku21 さんが終わらせたものをフォークしてきました(どうもありがとうございました)。

タスク一覧画面では、タスクをタスク名、ステータス、優先度、ラベルで絞り込むことができ、さらにそれらを並び替えることができます。
今回、ここを一行にしてみたいと思います。

## プルリク
https://github.com/yoyoyoheyheyhey/task_app/pull/1

## ビフォーアフター
### ビフォー(イメージ)
“`ruby
# app/controllers/tasks_controller.rb

def index
@tasks = current_user.tasks.with_title(params[:title]).

元記事を表示

【Ruby on Rails】Active Record 関連付け(アソシエーション)1対多についての超簡単なまとめ

モデル間の1対多、多対多のなどの関連付けの事をアソシエーションという
アソシエーションについては現実世界に置き換えるとわかりやすい。
今回はメッセージ投稿アプリを例にしている。
「一人のユーザーは何個もメッセージを投稿できる」= 1対多 というように現実的に考えると、
どのような関連付けが行えるかが見えてくる。

## 1対多の関連付け(アソシエーション)
メッセージ投稿機能をもったアプリの場合は次のようになる。

– Userテーブル

|id|email|備考|
|—|—|—|
1|arai@example.com|新井さん|
2|saitou@example.com|斎藤さん|
3|suzuki@example.com|鈴木さん|

– Postテーブル

|id|content|user_id|備考|
|—|—|—|—|
1|ありがとう|2|斎藤さんのメッセージ|
2|最高!|1|新井さんのメッセージ|
3|よろしく|3|鈴木さんのメッセージ|
4|おはよう|1|新井さんのメッセージ|
5|おやすみ|2|斎藤さんのメッセージ|

というように「あり

元記事を表示

【Rails】Kaminariで、ページネーションを解除する方法

# 結論
ページネーションしているインスタンスに、以下の記述を追加する。

“`ruby
.except(:limit, :offset)
“`

## もう少し詳しく

“`ruby
# 全件取得
@users = User.all

# 全部で100件
@users.count # => 100

# 30件ごとにページネーションして、1ページ目を取得
@users = @users.page(1).per(30)

# 全部で30件
@users.count # => 30

# ページネーションを解除
@users.except(:limit, :offset)

# 全部で100件
@users.count # => 100
“`

元記事を表示

Herokuの概要

##目的
Herokuについての概要を知ること、自身の学習の糧とすることを目的としております。

##Herokuとは
アプリケーションの公開、運用を行うための**サーバーを提供してくれる**サービス。
基本的には無料で使用することができる。デプロイの手間が少なくなる。

##デプロイとは
ネットワークを通じてWebアプリケーションなどのシステムを公開し、利用可能な状態にすること。

##ClearDBアドオン
MySQLを使用するためのツール。Herokuではデータベースの設定がデフォルトでPostgreSQLになっているため、開発環境でMySQLを使用する際に必要。

##流れ
1.ターミナルにて下記のコマンドを入力する。

% brew tap heroku/brew && brew install heroku

2.インストールできているか確認する。

% heroku –version
※heroku/◯.◯.◯ ~~~など、数字が記述された表示がされればインストール完了。

3.ログイン

% heroku login –inter

元記事を表示

[Rails] credentials.yml.enc、master.keyについて。

## 結論

秘密鍵: master.key

公開鍵: credentials.yml.enc

## master.keyとは
・暗号化された「credentials.yml.enc」の記述を復号化するための鍵のようなもの
####・アプリを消して、同じものをクローンした時点で、無くなっているから、credential.yml.encを再生成する必要がある。
[[Rails] ActiveSupport::MessageEncryptor::InvalidMessageの解決方法](https://qiita.com/kazumawada/items/c1dd676a42f9286bfccf)

## credentials.yml.encとは

中身はこんな感じで暗号化されている

“`bash
LEebK7Oel2pwADz3qzaLXWYHR12UexPU097wLK9FPnnRjZXPY7ZtSBsr96yCcC5r3dKRZrzzvwkmHO7hmuMgF+fiEOEWczncvQ50XuqMC2GDXiAsK0AyuF59eJ7EzzjiYT6FLS9Hvqk8W6

元記事を表示

[Rails] ActiveSupport::MessageEncryptor::InvalidMessageの解決方法

## なぜこのエラー?

credentialとmaster.keyの整合性が取れていない。
[[Rails] credentials.yml.enc、master.keyについて。](https://qiita.com/kazumawada/items/fb63806d74d89cbdf70f)

>「端的にcredentials.yml.encの文字列とmaster.keyの文字列の組み合わせが不正解であるということです。」

https://hirocorpblog.com/rails-credentials-master/

他にも
> if you delete your project local and clone it again your master.key will be lost.

> The only way to fix this is by setting up new credentials.yml.enc and add your AWS credentials to it again.
First you need to remove the ex

元記事を表示

【Rails】 SimpleCovの概要・導入・オプション

#はじめに
「SimpleCovって何?」っていう状態から導入をしましたので、調べたことについてまとめておきます。
全くSimpleCovについて知らない方が、個人開発や業務で導入して設定するまでの参考になれば幸いです。

ちなみに筆者は最近エンジニアとして働き出したレベルの者です。

#目次
– [そもそもSimpleCovとは](#そもそもSimpleCovとは)
– [コードカバレッジとは何か](#コードカバレッジとは何か)
– [導入方法](#導入方法)
– [使い方](#使い方)
– [オプションの設定](#オプションの設定)

#対象読者
・SimpleCovってそもそも何という方
・SimpleCovは知っているけど実際の導入の仕方を知りたい方
・導入はとりあえずできるけど、追加でどんなオプションがあるか知りたい方

#環境
– Ruby 2.7.2
– Rails 6.0.3
– rspec-rails 4.0.2
– simplecov 0.21.2

#そもそもSimpleCovとは
・Ruby用のコードカバレッジ分析ツール
(分かりやすく言うと、コードカバレッ

元記事を表示

OTHERカテゴリの最新記事