HerokuとS3を連携
S3の初期設定
この記事のバケットの作成のところ(Imagemagikの導入の手前)までの通りすればできました。
【Rails】S3へ『CarrierWave+fog』を使って画像アップロードする方法 | vdeep
Gemfile
こちらを追加し、bundle install
gem 'fog-aws', group: :production gem 'carrierwave', '~> 1.0'
○_uploader/rbに以下を追記
if Rails.env.production? storage :fog else storage :file end
carrier_wave.rb
$ touch config/initializers/carrier_wave.rb
でファイル作成
作成したファイルに以下を追記
require 'carrierwave/storage/abstract' require 'carrierwave/storage/file' require 'carrierwave/storage/fog' CarrierWave.configure do |config| if Rails.env.production? config.storage = :fog config.fog_provider = 'fog/aws' config.fog_credentials = { # Amazon S3用の設定 :provider => 'AWS', :region => ENV['S3_REGION'], :aws_access_key_id => ENV['S3_ACCESS_KEY'], :aws_secret_access_key => ENV['S3_SECRET_KEY'] } config.fog_directory = ENV['S3_BUCKET'] else config.storage :file config.enable_processing = false if Rails.env.test? end end
ここの下の画像の人の例を参考にしました。
herokuの環境変数の設定
S3の初期設定で取得できているcredentials を前項のENVの[ ]内の変数を下記コマンドで設定していく。
heroku config:set S3_REGION= heroku config:set S3_ACCESS_KEY= heroku config:set S3_SECRET_KEY= heroku config:set S3_BUCKET=
※credentialsがわからなくなったら、アクセスキーIDとREGIONは次から確認できる。 ルートアカウント認証情報を使用してサインイン→ヘッダーのユーザ名のdropdownからセキュリティ認証情報を選択→左のユーザー→ユーザーを選択→認証情報タブ secret keyはどう確認するかわからないからユーザーを作った時にcredentials.csvをダウンロードしておこう!
デプロイ
これでデプロイしてみるとできている。できなければ、DATABASEのリセットとかを試してみるといいかも。
アコーディオン機能の三角がくるっと回るやつの設定方法
html
<dt><p><img src="./images/triangle.png" class="arrow"> 学歴</p></dt> <dd><p>長岡技術科学大学 環境工学課程卒業</p></dd> <dt><p><img src="./images/triangle.png" class="arrow"> 実績</p></dt> <dd><p>オーストラリアワーキングホリデー<br>6,000kmヒッチハイク旅制覇</p></dd> <dt><p><img src="./images/triangle.png" class="arrow"> SNS</p></dt>
1. クリックファンクションを設定
2. クリックした要素の三角の画像を取り出す$('img', this)
3. アコーディオンを開くと同時に2で取り出した要素にcssのスタイルを設定.toggleClass('dropdown_toggle')
$(function(){ $('.side_menu dd').hide(); $('.side_menu dt').click(function(e){ // toggleClassは開くときにクラスを当てる // thisの子孫要素である'img'を取り出す $('img', this).toggleClass('dropdown_toggle'); $(this).next('dd').slideToggle() }); })
4. 3で設定される、三角を回転させるためのスタイルを設定
.dropdown_toggle { -webkit-transform: rotate(90deg); transform: rotate(90deg); }
バリデーションの日本語表示の仕方
1. 辞書ファイルをダウンロード
まずプロジェクトのトップで下記コマンドを実行して、辞書ファイルをダウンロード。プロジェクトのトップとはアプリ名がsampleであれば「:~/workspace/sample (master) $ 」のようにディレクトリを移動してからという意味
2.モデル用の辞書ファイルを分割して作成
そうするとconfig/locales/に「ja.yml」というファイルが作成されているのがわかる。
このファイルは長いので管理が大変になるため、モデル用のファイルはconfig/locales/下に別で作成する。
ファイル構成例
3. ファイルに辞書を記載していく。
※このときインデントが少しずれているだけで読み込まれないので注意。
上記だとモデルcontactの属性値の辞書を記している。
4. しっかり読み込ませる
辞書が完成したら、このファイルは自動では読み込まれないので、config/application.rb に下記を追加して、起動時に読み込まれるようにしておく。
これで Rails を起動し直すと、validates とかのエラーメッセージが日本語化されている
Rails5 バリデーションの書き方
バージョン
Rails 5.1.4
対象
下図のようなお問い合わせフォームのバリデーションを作成していく。
文法
validates シンボル1,シンボル2, シンボル3,・・・, バリデーションの種類: {オプション: true}
※カラムのシンボル名は→「:」+「カラム名」
※「バリデーションの種類:」の後スペースが必要。presence:trueのようにスペースがないと:trueをシンボルだと認識してしまう。
バリデーションの種類やそのオプションはガイドを参考に
※ガイドに書いてある「%{value}」はコントローラーから送られてくる変数ではなく、バリデーションの種類とそのオプションに応じて使える変数である。too_longの%{count}も同じ
こんな感じ・・・
2行目は名前の欄に記入された文字へのバリデーション。
presence: は空欄の場合、エラーを発生させるバリデーションの種類。
length: は文字数設定。
maximum: や too_long: はlengthのオプション。
8行目の
format: は設定したパターンと同じでないときエラーを返すもの
message: はformatのオプション。エラーが発生したときに
「・(カラム名) (メッサージ)」の形でエラー文を表示
formatだけでなく色んなバリデーションへつけられる。
エラー結果↓↓↓
ただ、上記だけでは上のようにモデルの属性値は日本語になりません。
モデルの属性値の日本語化はこちらにまとめました↓↓↓
フレキシブルなメソッドでの書き方
メソッドであればより柔軟にバリデーションを設定できる。下のコードは上のコードとほぼ同じ結果になる。メソッドを使うことで日本語翻訳設定をしなくても日本語でエラー文を表示できる。
メソッドにするときは「validates」ではなく「validate」と単数形で「:メソッド名」
引数の渡し方は不明。
とりあえず「validate :メソッド」にすればバリデーションするためのパラメーターが渡される。
name, email, contentのようにカラム名を引数のような形で扱う。
バリデーションを書いているときに・・・
バリデーションのコードを書いていて試したいときにはrails cが使える。
rails cで仮にエラーが出るように登録してみる
・変数.vaild? →検証できてるかどうか
・変数.errors.full_messages →エラー内容が確認できる
・変数.errors →エラー発生時どんな内容のエラーか確認できる。
・変数.errors.count →エラーの数
・変数.errors.full_messages →エラーのメッセージ。
また、複数のターミナルを開いて、このターミナルではサーバーを起動。こちらのターミナルではrails cを起動。などにしておくと、いちいちサーバーを落としたりしなくてもいい。
Ruby on Rails一連の流れ
全体の流れ
1.ブラウザからのリクエスト→ルーター
2. ルーター→コントローラー
3. コントローラー→モデル
4. モデル→DB
5. コントローラー→ビュー
1.ブラウザからのリクエスト→ルーター
ユーザーがブラウザからサーバーにリクエストを送る。リクエストにはURL(https://~)やHTTPメソッド(GET, POST, DELETEなど)やその他パラメーターなどが含まれている。
ブラウザ(UI: User Interface)からURLを元に行きついたサーバーでは、まずルーターがそのリクエストを受け取る。ルーター(routes.rb)はこれからの一連の処理の案内役である。
2. ルーター→コントローラー
ルーターは受け取ったリクエストから指定されたコントローラーの指定されたメソッドを実行する。
例:以降、「Blog.show」メソッドを例にして示す。
「/blogs/~」というURLがくれば「BlogsControlloer」というコントローラークラスへ渡す。(これはフレームワークであるrailsの規則。何も設定しなければ、URLに応じて、命名規則で決められたコントローラーへ渡す。)
app/controller/blogs_controller.rb
そして、「/blogs/:(id)」のようなURLと、同じくリクエストに含まれているHTTPメソッドがGETであれば、そのクラスのshowメソッドを実行する。
3. コントローラー→モデル
そのメソッドは、大体の場合、DB(データベース:PostgreSQL, MySQLなど)のデータを取得したり、修正したりするもので、どういう処理をしたいかをモデルに伝える。
例:
showメソッドが実行されるとまずBlog.find()が行われる。
app/controllers/blogs_controller.rb
これはモデルには「Blog」というクラスがあり、そのfind()メソッドを行うという意味である。
app/models/blog.rb
4. モデル→DB
モデルはDBと一対になっていて、「Blog」というモデルクラスがあれば「blogs」というテーブルがDBに存在する。
※モデルの中(モデルファイル名:blog.rb)にはfind()メソッドは記述されてはいないが、find()やnew,saveなどはテーブル操作において使えるActiveRecordのメソッドである。なので、Blog.find()はクラスBlogのインスタンスメソッドのfind()を実行してほしいと伝えている。
app/models/blog.rb
例えるなら、モデルはDBという異国へ行く。DBは異国なので使われている言語が違う。なのでモデルはメソッドからの命令を翻訳して理解して、他言語が使われているDBでデータを探しデータを調達したり、改修したりする通訳者兼配達者みたいなもの。
例:
これをActiveRecordで解釈したモデルは下記のようにSQLへ翻訳する。
モデルクラス「Blog」→DBのテーブル名「blogs」
インスタンスメソッド「Blog.find(2)」→SQLのメソッド「select * from blogs where id=2」 :id値が2のレコードを取得する。
console
上図から翻訳されているのがわかる。こうして取得したレコードをコントローラーへ渡す。
5. コントローラー→ビュー
コントローラーはモデルから受け取ったレコードをインスタンス変数に格納して、ビューへ渡す。
例:
コントローラーのshowメソッドでは、モデルからDBから取ってきたレコードを@blogというインスタンス変数へ代入する。そしてそれをビュー(show.html.erb)へ渡してビューで表示できるようにする。(これはrailsの命名規則であり何も設定しなければ、実行したメソッドの名前に応じて、決められたコントローラーへ渡す。def show→show.html.erb。表示先を変えたければredirec_toやrenderで指示する。)
関数の中に余分の変数に余分な引数が格納される
関数judgementで仮引数pointsが設定されている。その関数に仮引数の個数以上の引数を渡すと、その関数内に違う変数があれば、余分な引数は自動でその変数に格納される。もし、関数内に余分な変数がなければエラーになる。
Rubyでは*argsを仮引数に設定しておくと同じことができる。
Javascriptはメソッドの外の変数も読み込む
Javascriptはメソッドに引数を設定しないで、メソッドを呼び出してもメソッドの外の変数を読み込んで計算する。
メソッド(get_achievement)に引数を設定しないで、そのメソッドを呼び出しても、メソッドの外にある変数pointsを読み込み計算している。これを実行すると"A"を返す。
rubyは下記のように、メソッド(sort_algo)で変数sample_listはメソッド内では読みこめない。下に実行結果は赤文字でエラーが出ている