ランキング参加中プログラミング [９１]Bootstrap | ページネーション[ホームに戻る] >> [９３]Bootstrap | メッセージと会話 | 会話表示 「47 | メッセージと会話 | コントローラとビュー作成」の内容をBootstrapの記述に変更します。 メッセージコントロー…

ランキング参加中プログラミング[９０]Bootstrap | クレジットカード決済 | Stripe（ストライプ）コネクト[ホームに戻る] >> [９２]Bootstrap | メッセージと会話 | コントローラとビュー作成 「44 | ページネーション」の内容をBootstrapの記述に変更します…

ランキング参加中プログラミング[８９]Bootstrap | クレジットカード決済 | Stripe（ストライプ）[ホームに戻る] >> [９１]Bootstrap | ページネーション 「42 | クレジットカード決済 | Stripe（ストライプ）コネクト」をBootstrapの記述に書き換えます。 …

ランキング参加中プログラミング[８８]Bootstrap | 承認予約[ホームに戻る] >> [９０]Bootstrap | クレジットカード決済 | Stripe（ストライプ）コネクト 「41 | クレジットカード決済 | Stripe（ストライプ）」をBootstrapの記述で書き換えます。Stripe（ス…

ランキング参加中プログラミング[８７]Bootstrap | jQueryスライダー[ホームに戻る] >> [８９]Bootstrap | クレジットカード決済 | Stripe（ストライプ） 「40 | 承認予約」をBootstrapの記述に書き換えます。 設定部分は省略します。 app\views\rooms\new.h…

ランキング参加中プログラミング[８６]Bootstrap | AJAX検索[ホームに戻る] >> [８８]Bootstrap | 承認予約 「38 | jQueryスライダー」をBootstrapの記述に書き換えます。 記述追加 app\javascript\packs\application.js 「require("jquery-ui/ui/widgets/sl…

ランキング参加中プログラミング[８５]Bootstrap | ホームページ[ホームに戻る] >> [８７]Bootstrap | jQueryスライダー 「37 | AJAX検索」をBootstrapの記述に書き換えます。 設定部分は省略します。 記述追加 app\controllers\pages_controller.rb 「searc…

ランキング参加中プログラミング[８４]Bootstrap | レビュー[ホームに戻る] >> [８６]Bootstrap | AJAX検索 「36 | ホームページ」をBootstrapで書き換えます。 「app\assets\images」フォルダに「home」フォルダを新規作成してください。作成した「home」フ…

ランキング参加中プログラミング[８３]Bootstrap | ページ修正[ホームに戻る] >> [８５]Bootstrap | ホームページ 「35 | レビュー」をBootstrapの記述に書き換えます。 「raty-js」をインストールします。 コマンド yarn add raty-js@2.9.0 「app\javascrip…

ランキング参加中プログラミング[８２]Bootstrap | 予約確認ページ[ホームに戻る] >> [８４]Bootstrap | レビュー 「34 | ページ修正」をBootstrapの記述に書き換えます。 プロフィールページを修正していきます。 記述追加 app\controllers\users_controlle…

ランキング参加中プログラミング[８１]Bootstrap | 予約フォーム[ホームに戻る] >> [８３]Bootstrap | ページ修正 「33 | 予約確認ページ」をBootstrapの記述に変更します。 宿泊者（ゲスト）の予約確認ページを作成します。 記述追加 app\controllers\reser…

ランキング参加中プログラミング[８０]Bootstrap |jQuery日付ピッカー[ホームに戻る] >> [８２]Bootstrap | 予約確認ページ 「32 | 予約フォーム」をBootstrapの記述に変更します。 設定部分は省略します。 記述更新 app\views\reservations\_form.html.erb …

ランキング参加中プログラミング[７９]Bootstrap |予約コントローラとビュー[ホームに戻る] >> [８１]Bootstrap | 予約フォーム 「31 | jQuery日付ピッカー」をBootstrapの記述に変更します。 jqueryはすでにインストールされているので、「jquery-ui」をイ…

ランキング参加中プログラミング[７８]Bootstrap |ログイン認証における書き換え[ホームに戻る] >> [８０]Bootstrap | jQuery日付ピッカー 「30 | 予約コントローラとビュー」におけるBootstrapの書き換えを行います。 記述追加 app\views\rooms\show.html.e…

ランキング参加中プログラミング[７７]Bootstrap |Googleマップ[ホームに戻る] >> [７９]Bootstrap | 予約コントローラとビュー 「26 | Facebook認証」「27 | Google認証」について、Bootstrapへの書き換えを行います。 設定は省略します。 app\views\devise…

ランキング参加中プログラミング[７６]Bootstrap |写真カルーセル表示[ホームに戻る] >> [７８]Bootstrap | ログイン認証における書き換え 「25 | Googleマップ」をBootstrapに書き換えます。 設定部分は省略します。 Google Cloud PlatformにGoogleアカウン…

ランキング参加中プログラミング[７５]Bootstrap |アクションテキスト[ホームに戻る] >> [７７]Bootstrap | Googleマップ 「24 | 写真カルーセル表示」をBootstrapに書き換えます。 Bulmaの設定は省略しても大丈夫です。 「app\assets\images」フォルダに「b…

ランキング参加中プログラミング[７４]Bootstrap |写真アップロード(dropzone)[ホームに戻る] >> [７６]Bootstrap | 写真カルーセル表示 「23 | アクションテキスト」のBootstrap変更部分を載せておきます。 「app\views\rooms\description.html.erb」ファイ…

ランキング参加中プログラミング[７３]Bootstrap |部屋ビューの作成[ホームに戻る] >> [７５]Bootstrap | アクションテキスト 「22 | 写真アップロード(dropzone)」の内容をBootstrapの記述で書き換えます。 複数の画像をアップロードできるようにします。 …

ランキング参加中プログラミング[７２]Bootstrap |プロフィールページ作成[ホームに戻る] >> [７４]Bootstrap | 写真アップロード(dropzone) 「21 | 部屋ビューの作成」をBootstrapで書き換えていきます。 app\views\room\new.html.erb <br/> <br/> <div class="row"> <div class="col-sm-6" style="margin:0 auto;"> <div class="card text-center"> <h4 class="card-header text-center">お部屋の…</h4></div></div></div></br/></br/>

ランキング参加中プログラミング[７１]Bootstrap |電話番号カラム追加[ホームに戻る] >> [７３]Bootstrap | 部屋ビューの作成 「18 | プロフィールページ作成」のBootstrap記述変更部分を載せておきます。 「app\views\users」フォルダに「show.html.erb」フ…

ランキング参加中プログラミング[７０]Bootstrap |画像アップロード[ホームに戻る] >> [７２]Bootstrap | プロフィールページ作成 「17 | 電話番号カラム追加」のBootstrap変更部分を載せておきます。 「app\views\devise\registrations\edit.html.erb」ファ…

ランキング参加中プログラミング[６９]Bootstrap |Googleフォント・アイコン[ホームに戻る] >> [７１]Bootstrap | 電話番号カラム追加 「15 | 画像アップロード」のBootstrap変更部分のみ書いておきます。 ダッシュボードビューに記述を追加します。 記述更…

ランキング参加中プログラミング[６８]Bootstrap |ダッシュボード[ホームに戻る] >> [７０]Bootstrap | 画像アップロード 「12 | Googleフォント」についてはそのまま記述追加で問題ないです。 「13 | アイコン」のBootstrap変更部分から書いておきます。 「…

ランキング参加中プログラミング[６７]Bootstrap |デバイス認証設定の修正[ホームに戻る] >> [６９]Bootstrap | Googleフォント・アイコン 「11 | ダッシュボード」の変更部分を中心に書いていきます。 ナビゲーションバーを更新します。 app\views\shared\_…

ランキング参加中プログラミング[６６]Bootstrap |Gメール[ホームに戻る] >> [６８]Bootstrap | ダッシュボード 「10 | デバイス認証設定の修正」の変更部分を中心に書いておきます。 ユーザー編集ページを更新してパスワードのフィールドを減らします。 ユ…

ランキング参加中プログラミング[６５]Bootstrap |フラッシュメッセージ(noty)[ホームに戻る] >> [６７]Bootstrap | デバイス認証設定の修正 設定部分は「09 | Gメール」と同じなので違う部分をメインに書いておきます。 更新 app\views\devise\mailer\reset…

ランキング参加中プログラミング[６４]Bootstrap |氏名認証[ホームに戻る] >> [６６]Bootstrap | Gメール フラッシュメッセージ(noty)をBootstrapで実装していきます。 インストール等については「08| フラッシュメッセージ(noty)」と同じなので省略します。…

ランキング参加中プログラミング[６３]Bootstrap |デバイス(devise)[ホームに戻る] >> [６５]Bootstrap | フラッシュメッセージ(noty) 設定方法等は「07 | 氏名認証」と同じですので、Bootstrapによって変更になった部分のみを載せておきます。 認証ビューを…

ランキング参加中プログラミング[６２]Bootstrap |ナビゲーションバー[ホームに戻る] >> [６４]Bootstrap | 氏名認証 デバイスの設定部分は「06 | デバイス(devise)」と同じです。 Bootstrap用に書き換えた部分を載せていきます。 ナビゲーションバーに「新…