フルカレンダーをインストールします。 コマンド 一文です。 yarn add @fullcalendar/core@5.3.1 @fullcalendar/daygrid @fullcalendar/interaction@5.3.1 @fullcalendar/list@5.3.1 「app/javascript/packs/application.js」ファイルに以下の記述を追加しま…

秘密情報を暗号化します。 今回はストライプのキーを秘密情報に設定します。 「Settings」タブから設定変数を編集します。 「Reveal Config Vars」ボタンをクリックして下さい。Reveal Config Vars キーを2つ登録します。 STRIPE_PK（公開可能キー） STRIPE_…

右上のメニューから「Data」を選択します。Data データベースが表示されるので選択します。 データベース 「Setting」の「View Credentials」をクリックします。 View Credentials データベースの情報が表示されます。データベース情報 Posticoを起動して接…

Herokuのページで「Deploy」の「Deployment method」欄にある「Connect to GitHub」をクリックします。Connect To GitHub 下に出た「Connect to GitHub」ボタンをクリックします。Connect to GitHub GitHubのレポジトリー名を入力して「Search」をクリックし…

Webページで画像を表示するにはコンパイルする必要があります。 以下のコマンドを実行してコンパイルを行います。 コマンド rails assets:precompile RAILS_ENV=production Gitにコミットします。 ソース管理を選択します。 ソース管理 「＋」をクリックして…

Herokuにデプロイすると「https」通信となりますので動画Wistiaのスクリプトリンクを変更しなければなりません。 「app\views\task\show.html.erb」ファイルの93行目「script src」のリンク部分を「https://fast.wistia.net/static/E-v1.js」に変更します。 …

Google認証の本番設定をします。 まずご自分のGoogleアカウントで「google cloud platform」にログインします。 console.cloud.google.com ダッシュボードで「認証情報」→「OAuth 2.0 クライアント ID」で登録した「名前」をクリックします。 OAuth 2.0 クラ…

「config\environments\production.rb」ファイルを編集していきます。 httpsの設定 47行目のコメントアウトを外します。 config.force_ssl = true 画像表示の設定 29行目「config.assets.compile」を「true」にします。 config.assets.compile = true メール…

まずherokuアカウントを作成します。 signup.heroku.com herokuアカウントの作成手順は以下の手順でお願いします。 mrradiology.hatenablog.jp アプリケーションを作成します。 「Create new app」をクリックします。create new app 「App name」を入力して…

タスク７で行なった変更をGitにコミットします。 ソース管理を選択します。 ソース管理 「＋」をクリックして全ての変更をステージします。 全ての変更をステージ コミットネームを入力します。 コミットネームを入力 チェックマークをクリックしてコミット…

ダッシュボードに購入したプロジェクトを表示させるよう変更します。 「app\controllers\users_controller.rb」ファイルに以下の記述を追加します。 記述追加 app\controllers\users_controller.rb(6行目) if !current_user.nil? @projects = current_user.p…

通知ページにページング機能をつけます。 「GemFile」に以下の記述を追加します。 記述追加 GemFile(96行目) gem 'kaminari' GemFile source 'https://rubygems.org' git_source(:github) { |repo| "https://github.com/#{repo}.git" } ruby '2.6.3' # Bundl…

コマンド rails g model Notification content user:references コマンド rails g migration AddUnreadToUser unread:bigint 記述追加 db\migrate\20200805024555_add_unread_to_user.rb 3行目末尾に「, default: true」の記述追加 class AddUnreadToUser < …

メッセージをリアルタイムで送りあうことができるようにします。 コマンド rails g channel Message ルートの設定をします。 記述追加 config\routes.rb 6行目に「mount ActionCable.server => '/cable'」の記述を追加しています。 Rails.application.routes…

会話表示できるようにします。 「app\controllers」フォルダに「conversations_controller.rb」ファイルを新規作成して下さい。 app\controllers\conversations_controller.rb(新規作成したファイル) class ConversationsController < ApplicationController…

メッセージコントローラを作成します。 コマンド rails g controller messages create 「app\controllers\messages_controller.rb」ファイルを以下のように変更します。 記述変更 app\controllers\messages_controller.rb class MessagesController < Applic…

メッセージと会話のモデルを作成していきます。 コマンド rails g model Conversation sender:references receiver:references コマンド rails g model Message content:text user:references conversation:references 「db\migrate\20200805003957_create_c…

「app\mailers」フォルダに「purchase_mailer.rb」ファイルを新規作成してください。 app\mailers\purchase_mailer.rb(新規作成したファイル) class PurchaseMailer < ApplicationMailer def send_email_to_buyer(buyer, project) @buyer = buyer @project =…

タスク６で行なった変更をGitにコミットします。 ソース管理を選択します。 ソース管理 「＋」をクリックして全ての変更をステージします。 全ての変更をステージ コミットネームを入力します。 コミットネームを入力 チェックマークをクリックしてコミット…

ホームページを作成します。 「フルコード」の「サンプル画像」に入っている「home」フォルダごと「app\assets\images」フォルダにコピーして下さい。 「app\controllers\pages_controller.rb」ファイルを以下のように編集して下さい。 記述編集 app\control…

「app\views\project\show.html.erb」ファイルにレビューを表示させる記述を追加します。 １．記述追加 app\views\project\show.html.erb(13行目) <span class="star-review"><i class="fa fa-star"></i> <%= @project.average_rating %> <span class="has-text-primary">(<%= @project.reviews.count %>)</span> </span> ２．記述追加 app\views\project\show.h…

「app\views\project\show.html.erb」ファイルに以下の記述を追加します。 １．記述追加 app\views\project\show.html.erb（135行目） <span style="margin-left: 20px;"> <a class="button is-medium is-outlined is-danger toggle-modal" aria-control="<%= @project.id %>">レビューする</a> </span> <div class="modal" id="<%= @project.id %>"> </div>

「app\controllers」フォルダに「reviews_controller.rb」ファイルを新規作成してください。 app\controllers\reviews_controller.rb(新規作成したファイル) class ReviewsController < ApplicationController def create if Review.exists?(project_id: rev…

「raty-js」をインストールします。 コマンド yarn add raty-js 「app\assets\stylesheets\application.scss」ファイルに以下の記述を追加します。 記述追加 app\assets\stylesheets\application.scss(24行目) @import 'raty-js/lib/jquery.raty'; app\asset…

タスク５で行なった変更をGitにコミットします。 ソース管理を選択します。 ソース管理 「＋」をクリックして全ての変更をステージします。 全ての変更をステージ コミットネームを入力します。 コミットネームを入力 チェックマークをクリックしてコミット…

登録したクレジットカードで決済できるようにします。 「app\controllers\charge_controller.rb」ファイルを以下のように編集して下さい。 記述更新 app\controllers\charge_controller.rb 変更箇所が多いのでコードをコピーしてファイルの内容を置き換えて…

まずは以下の手順でStripeのアカウントを取得してください。 mrradiology.hatenablog.jp ダッシュボードで「公開可能キー」と「シークレットキー」をコピーします。公開可能キーとシークレットキー 記述追加 GemFile(93行目) gem 'stripe', '=4.18.1' GemFil…

購入したプロジェクトを表示するページを作成します。 「app\controllers\project_controller.rb」ファイルに以下の記述を追加します。 記述追加 app\controllers\project_controller.rb(4行目) before_action :authenticate_user!, only: [:list] app\contr…

モデルを作成していきます。 コマンド rails g model Subscription project:references user:references 「db\migrate\20200804060608_create_subscriptions.rb」ファイルを編集します。 記述追加 db\migrate\20200804060608_create_subscriptions.rb 9行目…

タスク４で行なった変更をGitにコミットします。 ソース管理を選択します。 ソース管理 「＋」をクリックして全ての変更をステージします。 全ての変更をステージ コミットネームを入力します。 コミットネームを入力 チェックマークをクリックしてコミット…