写真をカルーセル表示できるようにします。 コマンド yarn add bulma-extensions 「app\javascript\packs\application.js」ファイルを以下のように書き換えます。 １．記述追加 app\javascript\packs\application.js(13行目) window.BulmaCarousel = require…

プロジェクトコントローラを作成します。 コマンド rails g controller Project index show app\controllers\project_controller.rb class ProjectController < ApplicationController before_action :set_project, only: [:show] def index @projects = Pro…

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

タスクの管理モデルを作成します。 コマンド rails g trestle:resource Task タスクモデルに「有効化」「無効化」を格納するカラムを作成します。 コマンド rails g migration AddActiveToTask active:boolean 記述追加 db\migrate\20200802105846_add_activ…

trestleでリッチテキストが使えるようにします。 記述追加 GemFile(86行目) gem 'trestle-tinymce', '~> 0.3.0' GemFile source 'https://rubygems.org' git_source(:github) { |repo| "https://github.com/#{repo}.git" } ruby '2.6.6' # Bundle edge Rails…

アクションテキストをインストールします。 コマンド rails action_text:install マイグレーション適用 rails db:migrate 「app\models\project.rb」ファイルを以下の内容に更新します。 １．5行目に以下の記述を追加します。 has_rich_text :description ha…

ユーザ管理が出来るようにします。 「GemFile」に以下の記述を追加します。 GemFile(78行目) gem 'trestle-search', '~> 0.4.2' gem 'trestle-active_storage', '~> 3.0' gem "mini_magick" gem 'image_processing', '~> 1.2' GemFile source 'https://rubyg…

trestle管理画面にダッシュボードを作成します。 「app\admin」フォルダに「dashboard_admin.rb」ファイルを新規作成して下さい。 app\admin\dashboard_admin.rb(新規作成したファイル) Trestle.admin(:dashboard) do menu do item :ダッシュボード, icon: "…

プロジェクトとタスクのモデルを作成していきます。 コマンド（２つ） rails g model Project name:string content:text price:bigint user:references rails g model Task title:string note:text video:string header:boolean tag:bigint project:referenc…

管理ダッシュボードを作成します。 記述追加 GemFile(74行目) gem 'trestle', '~> 0.9.3' gem 'trestle-auth', '~> 0.4.0' GemFile source 'https://rubygems.org' git_source(:github) { |repo| "https://github.com/#{repo}.git" } ruby '2.6.6' # Bundle …

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

ユーザープロフィールページを作成します。 「app\controllers\users_controller.rb」ファイルに以下のメソッドを追加します。 記述追加 app\controllers\users_controller.rb(8行目) def show @user = User.find(params[:id]) end app\controllers\users_co…

herokuにアプリケーションをデプロイすると画像をローカルに保存することができません。 それに対応するため、アップロードした画像を全てアマゾンS3に保存するよう設定します。 アマゾンS3のキーの取得方法は以下の手順でお願いします。 mrradiology.hatena…

アバター画像をアップロードできるようにします。 コマンド rails active_storage:install コマンド マイグレーションの適用 rails db:migrate 「app\models\user.rb」ファイルに記述を追加します。 １．3行目に以下の記述を追加します。 has_one_attached :…

「Font Awesome」のアイコンを使えるようにします。 fontawesome.com 「app\views\layouts\application.html.erb」ファイルに以下の記述を追加します。 記述追加 app\views\layouts\application.html.erb(13行目) <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"> app\views\layouts\application.html.erb </link>

ユーザーモデルに項目を追加します。 コマンド rails g migration AddColumsToUser about:text status:boolean 「db\migrate\20200801121900_add_colums_to_user.rb」ファイルの記述を以下のように更新します。 記述追加 db\migrate\20200801121900_add_colu…

Google Cloud PlatformにGoogleアカウントでログインしてAPIキーを取得してください。 手順は以下の通りにお願いします。 mrradiology.hatenablog.jp GemFileに以下の記述を追加します。 記述追加 GemFile(67行目) gem 'omniauth' gem 'omniauth-google-oaut…