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

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

Bulma

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 23 | アクションテキスト

[22]写真アップロード(dropzone)[ホームに戻る] >> [24]写真カルーセル表示 アクションテキストをインストールします。 コマンド rails action_text:install マイグレーション適用 rails db:migrate 「app\models\room.rb」ファイルを以下の内容に更新し…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 22 | 写真アップロード(dropzone)

[21]部屋ビュー作成[ホームに戻る] >> [23]アクションテキスト 複数の画像をアップロードできるようにします。 まずは「doropzone」のインストールをします。 コマンド yarn add dropzone@5.5.1 「app\assets\stylesheets\application.scss」ファイルに…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 21 | 部屋ビュー作成

[20]部屋コントローラ作成[ホームに戻る] >> [22]写真アップロード app\views\room\new.html.erb <section class="section"> <div class="container"> <article class="panel"> <div class="panel-heading"> お部屋の登録 </div> <div class="card"> <div class="card-content"> <div class="media"> <%= form_for @room do |f| %> </div></div></div></article></div></section>

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 20 | 部屋コントローラ作成

[19]部屋モデル作成[ホームに戻る] >> [21]部屋ビュー作成 コマンド 1文です。 rails g controller Rooms index new create listing pricing description photo_upload amenities location update app\controllers\rooms_controller.rb class RoomsCont…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 19 | 部屋モデル作成

[18]プロフィールページ作成[ホームに戻る] >> [20]部屋コントローラ作成 コマンド 長いですが全部つながっています。1文です。 rails g model Room home_type:string room_type:string accommodate:bigint bed_room:bigint bath_room:bigint listing_n…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 18 | プロフィールページ作成

[17]電話番号カラム追加[ホームに戻る] >> [19]部屋モデル作成 ユーザープロフィールページを作成します。 「app\controllers\users_controller.rb」ファイルに以下のメソッドを追加します。 記述追加 app\controllers\users_controller.rb(8行目) def s…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 17 | 電話番号カラム追加

[16]アマゾンS3[ホームに戻る] >> [18]プロフィールページ作成 コマンド rails g migration AddExtraFieldsToUser phone_number:string コマンド マイグレーション rails db:migrate 電話番号カラムが追加されました。 電話番号カラム追加 電話番号カラ…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 16 | アマゾンS3

[15]画像アップロード[ホームに戻る] >> [17]電話番号カラム追加 herokuにアプリケーションをデプロイすると画像をローカルに保存することができません。 それに対応するため、アップロードした画像を全てアマゾンS3に保存するよう設定します。 アマゾン…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 15 | 画像アップロード(ActiveStorage)

[14]Gitにコミット[ホームに戻る] >> [16]アマゾンS3 アバター画像をアップロードできるようにします。 コマンド rails g migration AddImageColumsToUser image コマンド rails active_storage:install コマンド マイグレーションの適用 rails db:migra…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 14 | Gitにコミット

[13]アイコン[ホームに戻る] >> [15]画像アップロード(ActiveStorage) 今まで行なった変更をGitにファイル送信してコミットします。 Gitにコミットしておけば好きなバージョンに巻き戻したり出来ますし、バックアップにもなります。 ソース管理を選択し…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 13 | アイコン

[12]Googleフォント[ホームに戻る] >> [14]Gitにコミット 「Font Awesome」のアイコンを使えるようにします。 fontawesome.com 「app\views\layouts\application.html.erb」ファイルに以下の記述を追加します。 記述追加 app\views\layouts\application.…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 12 | Googleフォント

[11]ダッシュボード[ホームに戻る] >> [13]アイコン サイト fonts.google.com 上記のサイトで選んだフォントをサイトに適用することができます。 今回は「Kosugi Maru」というフォントを適用してみます。 https://fonts.google.com/specimen/Kosugi+Maru…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 11 | ダッシュボード

[10]デバイス認証設定の修正[ホームに戻る] >> [12]Googleフォント ユーザーモデルに項目を追加します。 コマンド rails g migration AddColumsToUser about:text status:boolean 「db\migrate\20200723123617_add_colums_to_user.rb」ファイルの記述を…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 10 | デバイス認証設定の修正

[09]Gメール[ホームに戻る] >> [11]ダッシュボード 「app\controllers」フォルダに「registrations_controller.rb」ファイルを新規作成します。 app\controllers\registrations_controller.rb(新規作成したファイル) class RegistrationsController < De…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 09 | Gメール

[08]フラッシュメッセージ[ホームに戻る] >> [10]デバイス認証設定の修正 Gmailを使ってメールの送信をできるようにします。 以下の手順でGmailのセキュリティを2段階認証プロセスに変更し、アプリパスワードを生成してください。 mrradiology.hatenabl…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 08| フラッシュメッセージ(noty)

[07]氏名認証[ホームに戻る] >> [09]Gメール notyのデザインについては以下を参照して下さい。 ned.im notyはyarnを使ってインストールします。 コマンド yarn add noty 「app\javascript\packs\application.js」に以下の記述を追加します。 記述追加 ap…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 07 | 氏名認証

[06]デバイス(devise)[ホームに戻る] >> [08]フラッシュメッセージ ユーザーモデルに氏名の項目を追加します。 コマンド rails g migration AddFullnameToUser full_name:string コマンド マイグレーション適用 rails db:migrate Posticoでテーブル確認 …

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 06 | デバイス(devise)

[05]ナビゲーションバー(Bulma)[ホームに戻る] >> [07]氏名認証 「devise」を利用してメールとパスワードでの認証ができるように実装します。 記述追加 GemFile(61行目) gem 'devise' GemFile source 'https://rubygems.org' git_source(:github) { |rep…

Ruby on Rails6.0 | 空き部屋を登録・予約・決済できるWebサイトを作成する 05 | ナビゲーションバー(Bulma)

[04]Windowsスタートアップ[ホームに戻る] >> [06]デバイス(devise) Bulmaを利用してナビゲーションバーを構築します。 Bulmaの詳細については下記を参照してください。 bulma.io GemFileに以下の記述を追加します。 記述追加 GemFile(57行目) gem 'bulm…