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

複数の画像をアップロードできるようにします。 コマンド yarn add dropzone@5.5.1 「app\assets\stylesheets\application.scss」ファイルに以下の記述を追加します。 記述追加 app\assets\stylesheets\application.scss(23行目) @import 'dropzone/dist/bas…

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 class="col-md-4 select"> <div class="form-group"> </div></div></div></div></div></article></div></section>

コマンド １文です。 rails g controller Rooms index new create listing pricing description photo_upload amenities location update app\controllers\rooms_controller.rb class RoomsController < ApplicationController before_action :set_room, exc…

コマンド 長いですが全部つながっています。１文です。 rails g model Room home_type:string room_type:string accommodate:bigint bed_room:bigint bath_room:bigint listing_name:string summary:text address:string is_tv:boolean is_kitchen:boolean i…

コマンド rails g migration AddExtraFieldsToUser phone_number:string コマンド マイグレーション rails db:migrate 電話番号カラムが追加されました。 電話番号カラム追加 ストロングパラメータに電話番号の項目追加します。 記述追加 app\controllers\ap…

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

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

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

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

ドラッグアンドドロップで登録したタスクの順番を変えられるようにします。 記述追加 GemFile(84行目) gem "active_admin-sortable_tree", "~> 2.0.0" GemFile source 'https://rubygems.org' git_source(:github) do |repo_name| repo_name = "#{repo_name}…

アプリケーションをデプロイする場合レンタルサーバでは写真の保存ができません。 そのためアップロードした写真の保存先にアマゾンS3を利用する必要があります。 アマゾンS3のキーの取得方法は以下の手順でお願いします。 mrradiology.hatenablog.jp 記述追…

ImageMagickをインストールします。 ダウンロードは以下のサイトからできます。 ww.npackd.appspot.com インストールは以下の手順でお願いします。 途中、「install legacy utilities」と「install development」にチェックを入れて下さい。 mrradiology.hat…

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

ダッシュボードの新しいテーマを実装していきます。 記述追加 GemFile(75行目) gem 'active_skin' GemFile source 'https://rubygems.org' git_source(:github) do |repo_name| repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/") "ht…

管理ダッシュボードを作成します。 記述追加 GemFile(72行目) gem 'activeadmin' GemFile source 'https://rubygems.org' git_source(:github) do |repo_name| repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/") "https://github.com…

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

ナビゲーションバーにリンクを追加します。 記述追加 app\views\shared\_navbar.html.erb 77行目に「」のリンクを追加しています。 <nav class="navbar is-danger" role="navigation" aria-label="main navigation"> <div class="navbar-brand"> <a class="navbar-item" href="/"> <h1>テストサイトOshigoto</h1> </a> </div></nav>

複数の画像をアップロードできるようにします。 コマンド yarn add dropzone@5.5.1 「app\assets\stylesheets\application.scss」ファイルに以下の記述を追加します。 記述追加 app\assets\stylesheets\application.scss(23行目) @import 'dropzone/dist/bas…

仕事の内容を登録できるようにします。 実際に登録して試すことはまだできません。 「app\views\gigs\edit.html.erb」ファイルを以下のように編集します。 app\views\gigs\edit.html.erb <section class="section"> <div class="container"> <div class="steps" id="stepsDemo"> </div></div></section>

仕事ビューを作成していきます。 「app\views\gigs\new.html.erb」ファイルの記述を以下の内容に変更します。 app\views\gigs\new.html.erb <section class="section"> <div class="container"> <div class="steps" id="stepsDemo"> <div class="step-item is-active is-primary"> <div class="step-marker">1</div> <div class="step-details">…</div></div></div></div></section>

仕事コントローラを作成していきます。 コマンド rails g controller Gigs new create edit update show --no-test-framework ルートの設定をします。 自動で書かれた記述は削除します。 記述追加 config\routes.rb(17行目) resources :gigs config\routes.r…

仕事のモデルを作成します。 コマンド（４つ） rails g model Category name --no-test-framework 一文です。 rails g model Gig title video active:boolean has_single_pricing:boolean user:references category:references --no-test-framework 一文です…

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

ダッシュボードビューに以下の記述を追加します。 記述追加 app\views\users\dashboard.html.erb(155行目) <div class="content"> <p> <strong>アカウント連携</strong><br/> <% if current_user.provider %> <span class="has-text-success">Facebookでログイン中</span> <% else %> <span class="has-text-danger">アカウント連携していません。</span> <% end %> </p> </div> app\…

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

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

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

アプリケーションをデプロイする場合レンタルサーバでは写真の保存ができません。 そのためアップロードした写真の保存先にアマゾンS3を利用する必要があります。 アマゾンS3のキーの取得方法は以下の手順でお願いします。 mrradiology.hatenablog.jp 記述追…

Google Cloud PlatformにGoogleアカウントでログインしてAPIキーを取得してください。 手順は以下の通りにお願いします。 mrradiology.hatenablog.jp 記述追加 GemFile（69行目） #googleマップ gem 'geocoder', '~> 1.4' GemFile source 'https://rubygems.…