学生向けプログラミング入門 | 無料

学生向けにプログラミングを無料で解説。Java、C++、Ruby、PHP、データベース、Ruby on Rails, Python, Django

Bootstrap

Rails6.0 | 民泊予約サイトの構築 | 77 | Bootstrap | Googleマップ

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

Rails6.0 | 民泊予約サイトの構築 | 76 | Bootstrap | 写真カルーセル表示

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

Rails6.0 | 民泊予約サイトの構築 | 75 | Bootstrap | アクションテキスト

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

Rails6.0 | 民泊予約サイトの構築 | 74 | Bootstrap | 写真アップロード(dropzone)

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

Rails6.0 | 民泊予約サイトの構築 | 73 | Bootstrap | 部屋ビューの作成

ランキング参加中プログラミング[72]Bootstrap |プロフィールページ作成[ホームに戻る] >> [74]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/>

Rails6.0 | 民泊予約サイトの構築 | 72 | Bootstrap | プロフィールページ作成

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

Rails6.0 | 民泊予約サイトの構築 | 71 | Bootstrap | 電話番号カラム追加

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

Rails6.0 | 民泊予約サイトの構築 | 70 | Bootstrap | 画像アップロード

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

Rails6.0 | 民泊予約サイトの構築 | 69 | Bootstrap | Googleフォント・アイコン

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

Rails6.0 | 民泊予約サイトの構築 | 68 | Bootstrap | ダッシュボード

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

Rails6.0 | 民泊予約サイトの構築 | 67 | Bootstrap | デバイス認証設定の修正

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

Rails6.0 | 民泊予約サイトの構築 | 66 | Bootstrap | Gメール

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

Rails6.0 | 民泊予約サイトの構築 | 65 | Bootstrap | フラッシュメッセージ(noty)

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

Rails6.0 | 民泊予約サイトの構築 | 64 | Bootstrap | 氏名認証

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

Rails6.0 | 民泊予約サイトの構築 | 63 | Bootstrap | デバイス(devise)

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

Rails6.0 | 民泊予約サイトの構築 | 62 | Bootstrap | ナビゲーションバー

ランキング参加中プログラミング[61]Bootstrap |導入編[ホームに戻る] >> [63]Bootstrap | デバイス(devise) Bootstrapでの書き直しを行っていきます。 まずはホームページのコントローラ作成です。 コマンド rails g controller Pages home ナビゲーシ…

Rails6.0 | 民泊予約サイトの構築 | 61 | Bootstrap |導入編

ランキング参加中プログラミング[60]本番環境の構築 | 秘密情報[ホームに戻る] >> [62]Bootstrap | ナビゲーションバー 「05 | ナビゲーションバー(Bulma)」で導入した「Bulma」の代わりに「Bootstrap」を導入します。 getbootstrap.jp Yarnで必要なパッ…