- 0.0.1. jQueryを使ってクリックする度に要素のテキストを切り替える方法
- 0.0.2. 【Ruby on Rails】SNS認証時に起こった「-bash: export: `=': not a valid identifier」のエラー解決をした話
- 0.0.3. 一発で理解できる ~Ruby,Railsについて~
- 0.0.4. rubyでgetsするときはSTDINがいらないのに、rakeタスクでgetsするときはSTDINが必要な理由
- 0.0.5. Mass AssignmentとStrongParameters
- 0.0.6. Dockerfileやdocker-compose.ymlで悩まないruby on railsのDocker環境構築
- 0.0.7. RailsアプリにReactを導入
- 0.0.8. 【Rails】i18nをパーシャルに適用する
- 1. はじめに
- 2. 環境
- 3. 結論
- 4. 方法
- 4.0.1. 【JavaScript】画像投稿時のプレビュー機能
- 4.0.2. 【Rails】sequenceを使ってテストデータを作成する。
- 4.0.3. 具体的にどう本物のエンジニアになるかというお話(バックエンドエンジニアのロードマップ付)
- 4.0.4. Railでの非同期通信(Ajax)を利用したいいね機能の実装
- 4.0.5. 【Docker】Rails6/MySQLのコンテナを作って開発環境を構築
- 4.0.6. DockerでRailsの環境構築を一つ一つ丁寧に読み解きながらやってみた(docker-compose.yml編)
- 4.0.7. 【Ruby】保存されている複数画像のうち1枚だけ表示した場合について
- 4.0.8. railsチュートリアルでherokuへのpushができない
- 4.0.9. Docker で Rails(API モード) + MySQL での環境構築を行う
- 4.0.10. Ruby on rails 備忘録1(Ruby・Rails インストール)
- 4.0.11. 【Ruby on Rails】Missing :controller key on routes definition, please check your routes. (ArgumentError)というエラーを解決した話
- 4.0.12. bcrypt-rubyのmodule BCryptのソースコードを日本語訳する
jQueryを使ってクリックする度に要素のテキストを切り替える方法
#今回の記事
①jQueryを使ってクリックする度に要素のテキストを切り替える方法をメモ
※自分の,そのままのコードを貼り付けているので、分かりづらいかもしれません。おまけ
② ①で切り替えると他の要素を変更させる方法
Railsにて、要素を変えたいが中身にインスタンス変数などがあり、ややこしいかも#環境
ruby 2.6#対象のコード
*①jQueryを使ってクリックする度に要素のテキストを切り替える方法*“`perl:HTML
“`
こちらは、期間の月を表してます。こちらをクリックするたび「Yearly、Day、Week」に変更していく。“`perl:application.html.erb
“`
jQueryを読み込みさせる。“`perl:jQuer
$('.fo
【Ruby on Rails】SNS認証時に起こった「-bash: export: `=': not a valid identifier」のエラー解決をした話
#対象者
* 環境変数を設定している方
* SNS認証を実装している方
#状況
SNS認証実装中、
環境変数設定時に下記のようなエラーがターミナル
````
-bash: export: `=': not a valid identifier
````#解決方法
環境変数設定時に
```
export 環境変数="変数名" ○
export 環境変数 = "変数名" ✕
```上記のように**環境変数と変数名の間に半角スペースを開けるとエラー**になってしまいます。
スペースを無くしたらエラーもなくなりました!
####投稿者コメント
初めて見たエラーだったので記事にしてみました。
学習内容だけでなく、自分が遭遇したエラーに関しても発信していきたいです。####My Profile
プログラミング学習歴3ヶ月目のアカウントです!
プログラミングスクールで学んだ内容や自分が躓いた箇所等のアウトプットの為に発信しています。
また、プログラミング初学者の方にわかりやすく、簡潔にまとめて情報共有できればと考えています。
もし、投稿した記事の中に誤り
一発で理解できる ~Ruby,Railsについて~
# Ruby概要
__日本人が作ったプログラミング言語__
* Rubyは、まつもとゆきひろ氏が開発したプログラミング言語です。日本で開発されたプログラミング言語
* Rubyは、非常にシンプルで書きやすいプログラミング言語であり、最初に学ぶプログラミング言語として最適__名前由来__
名前の由来はまつもとゆきひろ氏の好きなプログラミング言語であるPerlをモデルに開発したことからその名称には『Perl(パール)に続ぐ』という意味が込められており6月宝石であるPerlの次月(7月)宝石のRuby(ルビー)という名称になったようです。
# Rubyの特徴
__シンプル__
Rubyは、なんといっても記述のシンプルさが売りです!
可読性(読みやすさ)を重視しています。Javaと比較してみましょう!
Hello World”という文字を表示するプログラムを比較してみて下さい。```java:Java
public class Main {
public static void main(String[] args){
System.out.println("H
rubyでgetsするときはSTDINがいらないのに、rakeタスクでgetsするときはSTDINが必要な理由
# はじめに
rakeタスクを初めて作っているときに、標準入力の文字を受け取りたいと思い、getsを実装したところエラーが発生しました。rubyではgetsでエラーが起きてなかったのになぜ?Rakefileでもrubyは扱えたんじゃないの?そんな疑問と格闘した結果です。# 動作環境
- macOS version 11.4
- ruby 2.4.9
- rake 13.0.3# 名前を読んでくれないrakeタスク君
このご時世、人と合う機会も減り、普段名前を呼ばれることがありません。せめてrakeタスク君からは名前を呼ばれたい、その一心で次のタスクを作成しました。
```ruby:Rakefile
desc 'ユーザ名を入力すると、3回呼びかけてくれるタスクです。'
task :call_three do
print 'input your name:'
input = gets.chomp
puts ((input + '!') * 3)
end
```
しかし、実行すると```
$ rake call_three
input your name:rake
Mass AssignmentとStrongParameters
# StrongParameters
指定したリクエスト以外受け付けないようにすることで、セキュリティを強化する仕組み。
adminのリクエストで管理者権限奪取されて悪用される事を防ぐ。
# Mass Assignment(マスアサインメント)モデル(データ)の作成(new)や更新(update)の際にハッシュを使って一括で設定できる、効率的な機能のこと。
```ruby
@user = User.new(params[:user]) #:userはUserモデルにあるカラムのpermitを全て受け取ってる
```↑と↓は同じ。マスアサインメント機能でこれができる。
```ruby
@user = User.new(name: "Foo Bar", email: "foo@invalid",
password: "foo", password_confirmation: "bar")
```ただし、これだとシステムで脆弱性の問題がある。
悪者がadmin=trueというリクエストを混ぜて送信した際、massAssignment機能で
Dockerfileやdocker-compose.ymlで悩まないruby on railsのDocker環境構築
Dockerfileやdocker-compose.ymlをよく知らないへっぽこエンジニアなので、
DockerHubのbitnamiのイメージを使って環境構築してみる。```
$ mkdir ~/myapp && cd ~/myapp
$ curl -LO https://raw.githubusercontent.com/bitnami/bitnami-docker-rails/master/docker-compose.yml
$ docker-compose up
```
```
myapp_1 | => Booting Puma
myapp_1 | => Rails 6.1.4.1 application starting in development
myapp_1 | => Run `bin/rails server --help` for more startup options
myapp_1 | Puma starting in single mode...
myapp_1 | * Puma version: 5.4.0 (ru
RailsアプリにReactを導入
RailsアプリにReactを導入するには、Webpackerを使えばOK
##Rails new を実行時に導入
```ターミナル
% rails new app --webpack=react
```##既存のアプリに導入
```ターミナル
%rails webpacker:install:react
```必要なパッケージやapp/javascript/packs/hello_react.jsxが生成されます!
【Rails】i18nをパーシャルに適用する
はじめに
Ruby on Railsの学習を始めツイッタークローン作成時にi18nを用いた国際化を試みました。
i18nをパーシャルに適用する際の方法の備忘録になります。i18nの導入やapplication.rbの修正等は実施してある前提です。
環境
・rails 5.0.7以上
・rails-18n 5.1以上結論
viewと同じ記載で適用されます。
例えば、ルートに設定してるならこれだけです。```ja.yml
ja:
delete: 削除
retweet: リツイート
favorite: お気に入り
```方法
今回はルートパスに設定したviewの例のみ記します。
ここで対象になるのは[home.html.erb]です。```routes.rb
root to:'static-pages#home' #このhome-viewにi18nを適用します。
``````home.html.erb
<%=render 'microposts/micropost' %>
`
【JavaScript】画像投稿時のプレビュー機能
画像複数投稿機能以上に詰まっていたプレビュー機能。
ようやく解決できたので備忘録のために投稿します。
jsの記述のルールや基礎的なところ抑えていかなければと思いました。下記解決後コード
2,14,15,30行目の記述に変更を加えています。```js
document.addEventListener('DOMContentLoaded', function() {
if (document.getElementById('store-image')){
const ImageList = document.getElementById('image-list')const createImageHTML = (blob) => {
const imageElement = document.createElement('div')
imageElement.setAttribute('class', "image-element")
let imageElementNum = document.querySel
【Rails】sequenceを使ってテストデータを作成する。
sequenceというものを使ってテストデータを作成すると、テストデータをいい感じに作ることができる。
```ruby
FactoryBot.define do
factory :user do
sequence(:name) { |n| "ごりら#{n}" }
end
end
```
このような形でspec/factories/user.rbに記述する。
そして、rails cでuserを作成してみる。```
irb(main):001:0> FactoryBot.create(:user)
(2.4ms) SET NAMES utf8mb4 COLLATE utf8mb4_bin, @@SESSION.sql_mode = CONCAT(CONCAT(@@sql_mode, ',STRICT_ALL_TABLES'), ',NO_AUTO_VALUE_ON_ZERO'), @@SESSION.sql_auto_is_null = 0, @@SESSION.wait_timeout = 2147483
(2.3ms) BEGIN
Use
具体的にどう本物のエンジニアになるかというお話(バックエンドエンジニアのロードマップ付)
# 1. 誰に向けたどういう記事なのか
いわゆる #駆け出しエンジニア と呼ばれるような(定義割愛)プログラミング学習者に向けて,私が個人的に定義する**「本物のエンジニア」**になるための1つの道標になるような記事を目指しています.
また,今回の記事は主にエンジニアという単語で主にWebエンジニアを指します.## 1.1. 駆け出しエンジニアがある程度勉強をし終えた時に抱えるペイン
* Progate一通りやってレベル強強なんですけど全然自分の作りたいサービスが作れるビジョンが見えない
* 某スクールにたくさん課金してポートフォリオもできたし転職準備は完璧!でもあれ?Wantedlyで応募しても大抵書類選考で落ちてるっぽい??
* Udemyの先生の言ってることはわかるんよ.わかるのと書けるのは別なのよ?こんなふうになっていませんか?
プログラミングの勉強は決して転職のためのものではないし,正直私個人エンジニアへの転職業界をみていてあまり気持ち良い思いはしていません.## 1.2. 筆者の思い
ですが,圧倒的な需要が生まれているのも事実ですし,具体的な目標を持って努力する
Railでの非同期通信(Ajax)を利用したいいね機能の実装
使用環境
Ruby2.6.8
Rails6.1.4#完成イメージ
![スクリーンショット (30).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1193085/f7c1a964-2e29-07b8-d881-1f4b353a6571.png)非同期通信を用いることで、上の画像の♡を押すと、ページの更新なしに「いいね」をつけたり、消したりすることができます。
##処理の流れを説明する前に・・・
####前提
railsでjQueryを読み込めるようにする必要があります。https://qiita.com/tatsuhiko-nakayama/items/b2f0c77e794ca8c9bd74
また、非同期通信でいいね機能を実装するためには、javascriptでHTML構造を書き換える必要があります。なので、それぞれの投稿を部分テンプレートで切り出す必要があります。
![スクリーンショット (30)_LI.jpg](https://qiita-image-store.s3.ap-
【Docker】Rails6/MySQLのコンテナを作って開発環境を構築
## 背景
これまでローカル/Railsサーバーの開発環境で開発を進めていたが、本番環境(EC2)との差分により環境依存が発生。そこで、Dockerを用いてより本番環境に近い開発環境を構築することで環境依存に取られる時間を削減しようと考え実装しました。
### 開発環境
Ruby 2.7.2
Rails 6.1
MySQL 5.7
Docker for Mac
Nginx
Puma
Supervisor## docker開発環境
```:ターミナル
$ mkdir docker/dev
```
まず、アプリのroot配下にdockerフォルダ、その配下にdevフォルダを作ります。このdev配下にdocker関連のファイルを作成していきます。
```:ディレクトリ構造
root
├ docker
└ dev
├ app
├ nginx
├ dev.ドメイン名.conf
└ nginx.conf
├ supervisor
DockerでRailsの環境構築を一つ一つ丁寧に読み解きながらやってみた(docker-compose.yml編)
## この記事の内容
`Docker` & `Rails`で新規プロジェクトを立ち上げることになったので、Docker周りのファイルを丁寧に読み解きながら設定した時の話。これまでに[Dockerfileの設定](https://qiita.com/tanutanu/items/808850ed7e4e8461b24b)はやっているので、今回はその続きから。
▼前回の記事
[RailsでDockerfile設定しながら、コマンド一つひとつ丁寧に読んでみた](https://qiita.com/tanutanu/items/808850ed7e4e8461b24b)▼Railsのバージョン
6.1.4## 参考にした内容
今回も[公式のRailsの設定ガイド(Quickstart: Compose and Rails)](https://docs.docker.com/samples/rails/)を参考にしつつ、バージョン等を最新版(2021年8月時点)にアップデートして作成しました。- [Quickstart: Compose and Rails](https://d
【Ruby】保存されている複数画像のうち1枚だけ表示した場合について
現在作成中のアプリケーションにて、画像表示について表題のような挙動にしたかったのですが、解決まで時間がかかったので備忘録用に。
##状況
1つの店舗に対して複数の画像を投稿できる機能を追加しました。
トップページ、詳細ページどちらも投稿された画像が全て表示されています。
トップページでは店舗の外観画像のみ表示し、詳細ページでは店舗外観とその他画像が確認できるようにしたい。
以下解決前コード```rb
<% store.images.each do |image| %><% end %>
```
上記コードではstoreモデルが持っている画像を全件表示する、というコードになっていました。
削除後、下記コードに変更したところ解決しました。
とても単純でした。```rb
<%= link_to image_tag(
railsチュートリアルでherokuへのpushができない
# これは何
- ruby on railsのチュートリアルでherokuへアプリケーションをデプロイする場面があるのですが、以下のようなエラーで先に進めませんでした```
remote: -----> Installing dependencies using bundler 2.2.21
remote: Running: BUNDLE_WITHOUT='development:test' BUNDLE_PATH=vendor/bundle BUNDLE_BIN=vendor/bundle/bin BUNDLE_DEPLOYMENT=1 bundle install -j4
remote: Your bundle only supports platforms ["x86_64-darwin-19"] but your local platform
remote: is x86_64-linux. Add the current platform to the lockfile with `bundle lock
remote:
Docker で Rails(API モード) + MySQL での環境構築を行う
# はじめに
Docker を使いRails(API モード) + MySQL での環境構築を行なったのでその時の手順を記す。
# 環境構築
※ docker のインストールなどは済ませておくこと。
https://docs.docker.jp/docker-for-mac/install.html## 1. 新たなディレクトリを作り必要なファイルを作成する
新しくディレクトリを作る~~~
mkdir rails_api_app
~~~ディレクトリが作れたら必要なファイルを作成。
ローカル環境で用意するのは下記4つのみ。
全て `rails_api_app` 直下に作成する。- Dockerfile
- docker-compose.yml
- Gemfile
- Gemfile.lock※残りの `app/controllers/` やら `config/` やらは後ほどコンテナ内でコマンドを叩いて生成する。
### Dockerfile
~~~dockerfile:Dockerfile
FROM ruby:3.0.0RUN apt-get up
Ruby on rails 備忘録1(Ruby・Rails インストール)
##1.Rubyインストール
・公式サイトからRubyをインストールする。https://rubyinstaller.org/downloads/
・最新版もしくは、公式おすすめのバージョン(x64)をインストール。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1870509/070a3ac0-200f-f6b7-55f9-13fa57a19058.png)・「I accept the License」を選択し、「Next」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1870509/16b05c38-7540-59b9-8534-0dec6d2b05fd.png)・そのまま「Install」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1870509/910
【Ruby on Rails】Missing :controller key on routes definition, please check your routes. (ArgumentError)というエラーを解決した話
#結論
* routes.rbを書き直す
#現状
rails sを実行すると見たことないエラーが
![スクリーンショット 2021-08-17 16.23.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1681213/203ddfc6-cf54-2c03-3984-0c71cb6f0cd8.png)
#解決策
###1.原因
訳すと
「routesのコントローラーキーが見つからないから、routes見てくれ」という感じ。###2.対策
素直にroutes.rbを見てみたら確かにコントローラーキーがおかしかった
```routes.rb
get "articles/new" => "articles#new"
````と変更すればOK!
####投稿者コメント
見たことないエラーだったので記事にまとめてみました。
ちゃんとエラー文を読むこと大事ですね!####My Profile
プログラミング学習歴3ヶ月目のアカウントです!
プログラミングスクールで学んだ
bcrypt-rubyのmodule BCryptのソースコードを日本語訳する
Railsチュートリアル9章に出てきたBCrypt::Password.new(remember_digest).is_password?(remember_token)が初見では理解できなかったので、このコードの大元であるmodule BCryptを日本語訳します。
```ruby
module BCrypt
# A password management class which allows you to safely store users' passwords and compare them.
#ユーザーのパスワードを安全に保管し、比較することができるパスワード管理クラスです。
#
# Example usage: 使用例:
#
# include BCrypt
#
# # hash a user's password ユーザーのパスワードのハッシュ化
# @password = Password.create("my grand secret")
# @password #=> "$2a$12$C5.FIvVDS9