【jQuery】超簡単　ページごと　scss切り替え

## 目的
jQueryを使って、ページごとに装飾を変えます。

## 前提
jQueryを導入済

##実装例
イメージとしてこんな感じができます。
ホーム画面ではフッターのホームアイコンが緑になり
ユーザー一覧では、ユーザーズアイコンが緑になります。
https://gyazo.com/1209de9920840478ec974d0f4cd33632

##記述例

下記にjqueryの記述を書きます
ポイントは

var loc = location.pathname;
でそのページのパスを取得することです。
あとはシンプルなif文でページによって、クラスを与えます。

“`application.js
$(function(){
var loc = location.pathname;
if(loc == “/”){
$(“#HomeIcon”).addClass(“green”)
} else if (loc == “/users”){
$(“#UsersIcon”).addClass(“green”)
}

});
“`

“`

【第六章】フリマアプリ開発完全ロードマップ【商品購入機能】

#はじめに
本記事は**第五章　商品カテゴリ機能**のつづきです。
Railsを用いてフリマアプリの根幹機能である商品の購入機能を実装します。
本章がこのロードマップの最終章となります。

###フリマアプリ開発完全ロードマップ

|章|内容|難易度|所要時間|主要技術|
|—|—|—|—|—|
|序　章|AWS自動デプロイ|★☆☆☆☆|★★★☆☆|capistrano|
|第一章|データベース設計|★☆☆☆☆|★☆☆☆☆||
|第二章|【第五章】フリマアプリ開発完全ロードマップ【商品カテゴリ機能】

#はじめに
本記事は**第四章　商品出品/編集/詳細表示/削除**のつづきです。
Railsを用いてフリマアプリの商品出品や詳細表示機能で使用する**カテゴリ機能**を実装していきます。

#制作するアプリ
ユーザ登録、商品出品・購入の機能を備えたフリマアプリです。
メルカリ風、というかほぼメルカリです。メルカリを作ります。

こんな感じのWebサイトを作っていきます。

ちなみに、この規模のアプリは**単価50万円**ほどで取引されることが多いそうです。
通常納期は30日ほどだと思いますが、慣れてくれば1週間くらいで作れたりします。
この記事を使って、Web開発を極める一助にしていただければ幸いです。

`

【第四章】フリマアプリ開発完全ロードマップ【商品出品/編集/詳細表示/削除】

#はじめに
本記事は**第三章　ユーザ登録/ログイン機能**のつづきです。
Railsでフリマアプリの根幹機能である**商品出品/編集/詳細表示/削除**といった機能を実装します。

画像の複数投稿機能が一番の難関です。`gem”carrierwave”`を使用します。

#制作するアプリ
ユーザ登録、商品出品・購入の機能を備えたフリマアプリです。
メルカリ風、というかほぼメルカリです。メルカリを作ります。

こんな感じのWebサイトを作っていきます。

ちなみに、この規模のアプリは**単価50万円**ほどで取引されることが多いそうです。
通常納期は30日ほどだと思いますが、慣れてくれば1週間くらいで作れたり

【第三章】フリマアプリ開発完全ロードマップ【ユーザ登録/ログイン機能】

#はじめに
本記事は**第二章　マークアップ作業**のつづきです。
Railsでフリマアプリの根幹機能となる商品出品・購入に必要な**ユーザ登録/ログイン機能**を実装します。
`gem”devise”`を使って実装します。また、`ウィザード形式`という手法を用います。

#制作するアプリ
ユーザ登録、商品出品・購入の機能を備えたフリマアプリです。
メルカリ風、というかほぼメルカリです。メルカリを作ります。

こんな感じのWebサイトを作っていきます。

ちなみに、この規模のアプリは**単価50万円**ほどで取引されることが多いそうです。
通常納期は30日ほどだと思いますが、慣れてくれば1週間くらいで作れたり

【第二章】フリマアプリ開発完全ロードマップ【マークアップ作業】

#はじめに
本記事は**第一章　データベース設計**のつづきです。
Railsとhaml&scss記法を用いて、フリマアプリに必要となるホームページや商品登録ページなどのマークアップ作業をしていきます。

#制作するアプリ
ユーザ登録、商品出品・購入の機能を備えたフリマアプリです。
メルカリ風、というかほぼメルカリです。メルカリを作ります。

こんな感じのWebサイトを作っていきます。

ちなみに、この規模のアプリは**単価50万円**ほどで取引されることが多いそうです。
通常納期は30日ほどだと思いますが、慣れてくれば1週間くらいで作れたりします。
この記事を使って、Web開発を極める一助にしていただければ

【第一章】フリマアプリ開発完全ロードマップ【データベース設計】

#はじめに
本記事は**序章　AWS自動デプロイ**のつづきです。
RailsとMySQLを用いて、フリマアプリに必要となるデータベースを設計していきます。

#制作するアプリ
ユーザ登録、商品出品・購入の機能を備えたフリマアプリです。
メルカリ風、というかほぼメルカリです。メルカリを作ります。

こんな感じのWebサイトを作っていきます。

ちなみに、この規模のアプリは**単価50万円**ほどで取引されることが多いそうです。
通常納期は30日ほどだと思いますが、慣れてくれば1週間くらいで作れたりします。
この記事を使って、Web開発を極める一助にしていただければ幸いです。

“`:開発環境
OS :

【序　章】フリマアプリ開発完全ロードマップ【AWS自動デプロイ】

#はじめに
添野と申します。プログラミング学習を初めて4か月ほど経過しました。
Railsを用いて、メルカリ風フリマアプリを1人で作れたので、ロードマップとして一通りの開発経緯を残します。

序章では、Railsでフリマアプリ開発を行う前にアプリの雛形をAWSへデプロイする方法を解説します。
デプロイには**自動デプロイ**が可能となる便利な`gem”capistrano”`を使用します。
#制作するアプリ
ユーザ登録、商品出品・購入の機能を備えたフリマアプリです。
メルカリ風、というかほぼメルカリです。メルカリを作ります。

こんな感じのWebサイトを作っていきます。

ちなみに、この規模のアプリは**単価50万円**ほどで取引されることが多いそうです。
通常納期は30日ほどだと思いますが、慣れてくれば1週間くらいで作れたりします。
この記事を使

hamlの書き方 基礎編

普段htmlを書いていてhamlに慣れていなかったので簡単にhamlの書き方をまとめます。

# Hamlファイルの構造
“`html

Teen Wolf

Home

“`

上記はhamlに直すと以下のようになる

“`haml
#content
.title
%h1= @title
= link_to ‘Home’, home_url
“`

## %
<開始タグ>と<終了タグ>を書く代わりに%をつけるだけで良い

## 入れ子構造にするときインデントが必須
holidayではタブ一つ分(半角スペース2つ分開けています)

# タグの中身
“`haml
#content
.title
%h1= @title
= link_to ‘Home’, home_url
“`

## id
divは省略可能なので%divも取り払って`#content`となる

## clas

備忘録 form_withのlocal: trueについて

#一言メモ（のちに修正します）

form_withではデフォルトの状態ではajaxでの通信がおこなわれる。
それをキャンセルするためのオプションンが　local: true

gem action_args の README を翻訳しました

# 概要
gem [action_args](https://github.com/asakusarb/action_args) の [README](https://github.com/asakusarb/action_args/blob/master/README.md) を翻訳しました。

– 翻訳について
– 翻訳サービス [Deepl](https://www.deepl.com/translator) と [Goole翻訳](https://translate.google.co.jp/) の訳文を参考にしている箇所があります。
– 翻訳対象の[コミットハッシュ](https://github.com/asakusarb/action_args/commit/9d49d54a66c89e96dc1be2755302b4e67aeb23ae)
– 非公式の翻訳です。
– 訳文がおかしい箇所があったら指摘をもらえると幸いです。

– ライセンスについて
– [action_args のライセンス](https://github.com/

【Docker, Rails 5】Autoprefixer doesn’t support Node v4.8.2. Update it エラーについて

Railsで突如出たこのエラー。

直訳すると、

「Autoprefixer機能はNode.jsのバージョン4.8.2ではサポートしておりません。アップデートしてください。」

Node.jsのバージョンを変更しろと怒られているようです。

調べてみると、Dockerを使ってapplicationを作っていると起きるエラーのようで、

Dockerfileの
[Docker]Rails6 + Postgres 環境構築時エラー対処

### 開発環境
– MacOS 10.13.6
– Docker version 19.03.8

参考記事：[Dockerを使ってRails6環境の構築をしてみる](https://qiita.com/me-654393/items/ac6f61f3eee66380ecd7)

ほぼ記事の通りに進めていました。
（一点だけ修正したのは、`Dockerfile`１行目でRubyのバージョンを`2.6.5`と指定しました）

### 問題
`$ docker-compose build`まではうまく出来ていましたが、
今回エラーが出たのは、__2-3.データベースの設定と作成__ のところでした。

“`
$ docker-compose run web rake db:create
Starting scraperb_db_1 … done
could not translate host name “db” to address: Name or service not known
Couldn’t create ‘myapp_development’ database.

Rakeエラー rake spec rake aborted!

Railsでrake specを使い、rspecを実行しましたが、NoMEthodErrorになりました。

##仕様

“`Gemfileにrakeを追加する
# A sample Gemfile
source “https://rubygems.org”

gem “rspec”, “>= 3.0.0”
gem “rake”
“`

Rakefileを作成する

“`
require ‘rspec/core/rake_task’
RSpec::Core::RakeTask.new(:spec)
task :default => :spec
“`

rakeコマンドでspecを実行

“`
$ bundle exec rake spec
“`
##エラー

“`
$ bundle exec rake spec
rake aborted!
NoMethodError: undefined method `last_comment’ for #
/Users/yuki/rspec_test/Rake

【raty.js】 星付き　評価機能　実装　rails　view表示まで


##【ゴール】
raty.jsを使用して星付きのランキング機能の実装　view表示まで

##【メリット】
■　UXの向上
■　javascript理解度向上

##【開発環境】
■ Mac OS catalina
■ Ruby on Rails (5.2.4.2)
■ Virtual Box:6.1
■ Vagrant: 2.2.7

##【実装】

###1.githubからretyのソースを持ってくる
　※[こちらのソースコード](https://github.com/wbotelhos/raty/tree/master/lib/images)から
　※ファイルは2点、①”jquey-raty.js”のファイル　,　②”image”全て

###2.jquery追記
　※　”//= requ

【Rails・MySQL・Docker】既存Rails5+MySQLのアプリにDockerを導入する

#概要

既存のRails5+MySQLのアプリケーションに、後からDockerを導入しました。

今回はローカル環境のみの構築ですが、Docker初学者でかなり苦労しましたので備忘録としてまとめます。

勉強のためにコードやコマンドの一つ一つの意味も書いていきたいと思います。

既存のRailsアプリにDockerを導入したい方のお役に立てれば幸いです。

間違い等あればご指摘くださいませ。

#前提

* Dokerの基礎的な知識
* MacOS
* Ruby 2.5.1
* Rails 5.0.7.2
* MySQL 5.6

Dokerの基礎は[入門Docker](https://y-ohgi.com/introduction-docker/)と[DOCKER/KUBERNETES 実践コンテナ開発入門](https://www.amazon.co.jp/dp/B07GP1Q3VT/ref=cm_sw_em_r_mt_dp_U_R6SREbK716BT9)で学習しました。

Dockerに初めて触れる方は、まずはDockerの概念や基礎的ところを上記等で理解することをおすすめ

Rails 本番環境（EC2）でPAY.JPのAPI keyを読み込めないエラー

####結論
本番環境（EC2）でAPI keyを読み込むためには、/etc/environmentの中にAPI keyを書きこむ必要があります。
（テスト秘密鍵であればsk_testで始まる文字列を直接書く）

####経緯
チーム開発でメルカリを模したアプリを開発しています。
・rails (5.2.4.2)
・ローカル環境にてpayjpを使いクレジットカード登録機能を実装。動作確認済。
・ローカルにおいては、クレジットカードコントローラに下記記述をすることで、
　.ENVファイルに記載されたAPI秘密鍵を読み込むことに成功していた。

“`
Payjp.api_key = ENV[“PAYJP_PRIVATE_KEY”]
“`
・本番環境にてクレカ登録をすると、登録完了画面に遷移せず、
　Payjp::AuthenticationError in CreditCardsController#payエラーが発生。
　No API key provided.と言われてしまう。（PAY.JPにもクレカ情報が反映されない）

rails newのやり方

rails で新しいアプリケーションを作るときの方法

前提
Ruby 2.5.1
Rails 5.2.3

1.rails new

“`
$：rails version new アプリケーション名 -d mysql
“`

2.作ったディレクトリに移動

“`
$：cd ~
“`

3.DBの準備

“`
rails db:create
“`

4.ブラウザを開き確認

“`
rails s
“`

完了です！

Rails ジェネレータを使って初期設定を自動化しよう！

Rails は`rails new`コマンドにより、必要なファイルを即座に用意してくれます。
しかし、好みの Gem を追加したりテスト設定したり、初期設定はとても面倒な工程です…

対策としては、GitHub に生成後のテンプレートをリポジトリに残すことも一つの手段でしょう。
ただ、生成内容を調整したい時やバージョンが変わる時は、リポジトリも作り直さなければなりません。それもまた面倒ですね…

Rails は、そんな面倒なことまでも吸収してくれます。
それが**Railsジェネレータ( Rails::Generators::Base )**と呼ばれる機能です。

本記事では、例として[\[Rails\+Vue\.js\]に係るCRUD入門〜Part１：環境構築編〜 \- Qiita](https://qiita.com/Moo_Moo_Farm/items/afacfe4349af6a106253)を利用して、初期設定をコードに落とし込みます。

# 【目的】

`rails new`によるプロジェクト生成時において、初期設定を自動化することです。
対応順は、以下の通りとなり

【jpostal】　jQuery　住所自動入力　rails おそらく一番簡単な方法で


##【ゴール】
郵便番号を入力すると、自動で住所が入力される

参考：https://remonote.jp/rails-jp_prefecture-jppostal

##【メリット】
■　UXの向上
■　javascript理解度向上

##【開発環境】
■ Mac OS catalina
■ Ruby on Rails (5.2.4.2)
■ Virtual Box:6.1
■ Vagrant: 2.2.7

##【実装】

###１. 外部の準備（一番重要漏れないように!!）

　※gem 2種類導入
　※下記のURLで　’jquery.jpostal.js’　を入手し作成したアプリケーションの
　　javascriptsディレクトリ内へ保存
　　https://github.com/