タスク3
タスク3で行なった変更を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」ファイルを以下の内容に更新します。 1.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: "…
プロジェクトとタスクのモデルを作成していきます。 コマンド(2つ) 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 …
タスク3で行なった変更をGitにコミットします。 ソース管理を選択します。 ソース管理 「+」をクリックして全ての変更をステージします。 全ての変更をステージ コミットネームを入力します。 コミットネームを入力 チェックマークをクリックしてコミット…
Google Cloud PlatformにGoogleアカウントでログインしてAPIキーを取得してください。 手順は以下の通りにお願いします。 mrradiology.hatenablog.jp 記述追加 GemFile(70行目) #googleマップ gem 'geocoder', '~> 1.4' GemFile source 'https://rubygems.…
写真をカルーセル表示できるようにします。 コマンド yarn add bulma-extensions 「app\javascript\packs\application.js」ファイルを以下のように書き換えます。 1.記述追加 app\javascript\packs\application.js(13行目) window.BulmaCarousel = require…
アクションテキストをインストールします。 コマンド 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>
コマンド 1文です。 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…
コマンド 長いですが全部つながっています。1文です。 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…
ユーザープロフィールページを作成します。 「app\controllers\users_controller.rb」ファイルに以下のメソッドを追加します。 記述追加 app\controllers\users_controller.rb(8行目) def show @user = User.find(params[:id]) end app\controllers\users_co…
コマンド rails g migration AddExtraFieldsToUser phone_number:string コマンド マイグレーション rails db:migrate 電話番号カラムが追加されました。 電話番号カラム追加 ストロングパラメータに電話番号の項目追加します。 記述追加 app\controllers\ap…
herokuにアプリケーションをデプロイすると画像をローカルに保存することができません。 それに対応するため、アップロードした画像を全てアマゾンS3に保存するよう設定します。 アマゾンS3のキーの取得方法は以下の手順でお願いします。 mrradiology.hatena…
アバター画像をアップロードできるようにします。 コマンド rails g migration AddImageColumsToUser image コマンド rails active_storage:install コマンド マイグレーションの適用 rails db:migrate 「app\models\user.rb」ファイルに記述を追加します。 …
タスク3で行なった変更をGitにコミットします。 ソース管理を選択します。 ソース管理 「+」をクリックして全ての変更をステージします。 全ての変更をステージ コミットネームを入力します。 コミットネームを入力 チェックマークをクリックしてコミット…
ドラッグアンドドロップで登録したタスクの順番を変えられるようにします。 記述追加 GemFile(88行目) 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 記述追…
HomebrewでImageMagickをインストールします。 ターミナルで以下のコマンドを実行してください。 brew install imagemagick 記述追加 GemFile(82行目) gem 'paperclip', '~> 5.1.0' GemFile source 'https://rubygems.org' git_source(:github) do |repo_n…
プロジェクトとタスクのモデルを作成していきます。 コマンド(2つ) 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(79行目) 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(76行目) 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…
タスク3で行なった変更をGitにコミットします。 ソース管理を選択します。 ソース管理 「+」をクリックして全ての変更をステージします。 全ての変更をステージ コミットネームを入力します。 コミットネームを入力 チェックマークをクリックしてコミット…
ナビゲーションバーにリンクを追加します。 記述追加 app\views\shared\_navbar.html.erb 72行目に「」のリンクを追加しています。 <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…