TODO ローカル変数ではなく let を使用する letを使用してprojectとtaskの変数を共通化し、visitの引数で呼び出す。 RSpec.describe 'Task', type: :system do let(:project) { create(:project) } let(:task) { create(:task) } let(:done) { create(:task,…

gemの導入 group :development, :test do gem 'byebug', platforms: %i[mri mingw x64_mingw] gem 'factory_bot_rails' gem 'rspec-rails', '~> 5.0.0' gem 'webdrivers' gem 'capybara' end rspecでcapybaraを使うために必要な機能を読み込む require 'capy…

概要 taskモデルのバリデーションに関するテストを作成する。 FactoryBotを使用しテストデータを作成する。 バリデーションエラーの発生と、エラーメッセージの内容を表示させる。 各バリデーションを削除した際、テストが失敗することを確認する。 FactoryB…

概要 GitHubからサンプルアプリを fork, clone 後、ローカルでのrspec実行環境をセットアップする。 ローカルへのコピー GitHubからサンプルアプリをforkし、ターミナルからcloneする。$ git clone URL新たなブランチの作成$ git checkout -b ブランチ名 セ…

Gitとは ファイルのバージョン管理をするツールのこと。 バージョン管理とは、ソースコードなどのファイルの追加や変更履歴を管理することで、過去の変更を確認したり、特定の場所にファイルを戻したりできること。 バージョン管理を使えば、いつ、どこで、…

DOMとは DOM( Document Object Model )はHTMLやXMLを取り扱うためのAPIのこと。 DOMを使えば、HTMLの探索やスタイルの変更・イベントの設定・HTML要素の取得の他に、振る舞いを変えたり、ユーザー操作時の処理を設定することができる。 htmlを用意する DOMを…

前提 enumとransackは導入済み →enum →ransack 実装内容 enumで定義した値の翻訳 ユーザー一覧画面でのプルダウン検索 導入 gem 'enum_help' bundle install enumの設定 general・・・一般 admin・・・管理者 と定義する。 enum role: { general: 0, admin: …

管理画面において、以下のようにサイドバーで選択(クリック)した部分を青色(アクティブ)にさせる。 実装 ヘルパーにメソッドを定義する。 def active_if(path) path == controller_path ? 'active' : '' end controller_path?でcontroler名を取得する。 cont…

CRUD作成 以下のような、管理画面に掲示板とユーザーのCRUD(Create（生成）、Read（読み取り）、Update（更新）、Delete（削除）)機能を作成する。 ルーティング namespace :admin do root to: 'dashboards#index' resources :users, only: %i[index show ed…

AdminLTEを使用し、以下のような管理画面トップページと管理画面へのログイン機能を実装する。 AdminLTEとは Bootstrapをベースにした、管理画面等のCSSフレームワーク 今回はバージョン3を使用 AdminLTEのインストール $ yarn add admin-lte@^3.0 node_modu…

エラー内容 ①rspec実行時におけるエラー ②リンクからパスワードリセットページへ行き、新しいパスワードを入力して更新を押すが更新できない。 解決手順① Unable to find field "メールアドレス" that is not disabledから実際のhtmlのfieldとテストコードの…

概要 パスワードリセット申請画面にメールアドレスを入力し申請後、tokenを発行しデータベースへ保存させる 入力されたメールアドレスにパスワードリセットページヘのリンクを送信し、発行したtokenをURLへ組み込み、ユーザーを判別する。 ユーザーはリンク…

実装内容 プロフィール詳細ページ（/profile）と編集ページ（/profile/edit）を作成する プロフィール編集画面からアバター画像をアップロードできるようにし、プロフィール詳細画面、ヘッダーアイコン、コメントしたユーザーのアイコン画像が表示されるよう…

実装内容 gem 'ransack'を使用し、掲示板一覧画面とブックマーク一覧画面に以下のようなフォームを設置する。 入力された文言が「掲示板のtitle,body」に含まれている掲示板のみを表示させる。 ブックマーク一覧のページで検索した場合は「ブックマークした…

ページネーション ページネーションとは検索結果や内容の多いページを分割して表示させ、見やすくすること 使用例↓ 実装内容 掲示板一覧画面とブックマーク一覧画面にページネーションを実装。 ページネーションにはkaminariを使用し、1ページあたり20件の掲…

実装内容 コメントの投稿、削除処理をajax（remote :true)で行う。 削除ボタンのaタグにはjs-delete-comment-buttonclassを付与。 ルーティング commentsに削除を追加。 ~ resources :users resources :boards do resources :comments, only: %i[create dest…

Ajax ajax(Asynchronous Javascript and XML)とはjavascript,XML,DOMなどを組み合わせて非同期通信すること 同期通信では画面遷移に待ち時間があるが、非同期通信ではページの必要箇所だけ書き換えるので画面遷移がなく、スムーズな操作が行える。 実装内容 …

part1からの続き 中間モデルを定義したので ルーティング→コントローラ→viewと実装していきます。 ルーティングの設定 BoardモデルとBookmarkモデルが紐付いてるので、ルーティングをネストする必要がある。 commentsとbookmarksコントローラはboardsコント…

実装内容 掲示板の☆ボタンを押すと、その掲示板をブックマーク/解除出来る機能を作成。 ブックマークすると★解除すると☆になるようにし、フラッシュメッセージも表示させる。 同じユーザが同じ掲示板を複数回ブックマークできないようにする。 ブックマーク…

System Versions Ruby version 2.6.3 Rails version 5.2.3 以下のエラーを修正していく。 blog一覧ページにアクセスした場合 blogの一覧ページが表示されること ルーティングが間違っていた。 blogではblogsコントローラのindexアクションを呼び出せないので…

ヘルパーを使ってタイトルを動的に表示させる。 ここでいうタイトルとはブラウザのタブに表示される文字のこと↓ 実装内容 今回はヘルパーを使い、以下の各ページごとに動的にタイトルを表示させる。 content_forを使い、「ページごとのタイトル名 | タイトル…

part1からの続き。 掲示板の詳細画面を実装したので、そこにコメント機能を実装していく。 投稿詳細画面へコメントの入力フォーム、エリアを追加する。 # Controllerへ追記。 boards_controllerにインスタンス変数@commentと@commentsを定義し、view側で呼び…

概要 掲示板詳細画面を追加し、その中でコメントをできるようにする。 掲示板一覧画面から掲示板のタイトル名を押すと掲示板詳細画面へ行けるようにする。 書き込んだコメントが一番上に表示されるようにコメントの並び順を指定 コメントした本人のみに削除…

実装内容 掲示板作成画面から画像を投稿する。 gem CarrierWaveとMiniMagickを利用。 サムネイルというラベルを追加し、画像の選択をする。 画像を選択せずに投稿した場合、デフォルトの画像を表示。 アップロードできるファイルはjpg, jpeg, png, gifのみに…

UserモデルとBoardモデルにアソシエーションを設定 Userと関連付いたboardを作成するので、has_manyをUserモデルに定義する。 class User < ApplicationRecord authenticates_with_sorcery! validates :password, length: { minimum: 3 }, if: -> { new_reco…

モデルの作成 Boardモデルの作成しtitle,bodyカラムを追加する。 Boardモデルにuser_idを外部キーとして設定する。 紐づくモデル名+「_id」で外部キーと呼ぶ。 reference型を使いモデルと同時に作成。 $ rails g model board title:string body:text user:re…

掲示板の一覧にダミーデータを投入する。 gem Fakerのインストール。 Fakerはdevelopmentとtest環境にインストールする。 group :development, :test do #... gem 'faker' #... end bundle installで完了。 データベース上にダミーデータを生成 今回はBoard…

Decoratorについて Decoratorとはソフトウェアのデザインパターンのひとつであり、モデルとviewの間に追加する。 「モデル→Decorator→view」のようにviewを装飾するメソッドを追加するときはモデルではなく、デコレーターへ追加する。 Decoratorを導入すれば…

概要 以下のflashメッセージをbootstrapで表示させる。 ログイン成功時・・・「ログインしました」 ログイン失敗時・・・「ログインに失敗しました」 ログアウト時・・・「ログアウトしました」 ユーザー登録時・・・「ユーザー登録が完了しました」 ユーザ…

i18nを使用しユーザー登録画面とログイン画面を日本語化する。 i18n国際化(Internationalization)はRailsにおいて、言語の翻訳機能があるgemである。 実行環境 Rails5.2.3 Ruby2.6.4 gem 'rails-i18n'をGemfileに記述し、bundleする。 # rails5系なら以下を…