山川　雄也

概要 テックキャンプの最終課題にて作成したアプリケーションを紹介します。また本資料では、自身で実装した箇所、および開発を通じて得られた経験についても紹介します。 アプリケーション情報 アプリケーション概要 フリーマーケットのアプリケーションを作成しました。ユーザーは、サイト内で任意の商品を出品でき、また他のユーザーが出品した商品をクレジットカードで購入できます。 接続先情報 URL http://54.168.66.180/ ID/Pass ID: admin Pass: 73c テスト用アカウント等 購入者用 メールアドレス: ssss@zzz.gmail.com パスワード: 05161212s 購入用カード情報 番号： 4242424242424242 期限： Fri Jan 24 2020 00:00:00 GMT+0900 (日本標準時) セキュリティコード：111 出品者用 メールアドレス名: aaaa@yyy.gmail.com パスワード: 12121985a Githubリポジトリ https://github.com/kawayu-yu/fleamarket_sample_73c.git 開発状況 開発環境 Ruby/Ruby on Rails/MySQL/Github/AWS/Visual Studio Code 開発期間と平均作業時間 開発期間：6/20〜8/30（72日間) 1日あたりの平均作業時間：5 開発体制 人数：5 アジャイル型開発（スクラム） Trelloによるタスク管理 動作確認方法 Chromeの最新版を利用してアクセスしてください。 ただしデプロイ等で接続できないタイミングもございます。その際は少し時間をおいてから接続ください。 接続先およびログイン情報については、上記の通りです。 同時に複数の方がログインしている場合に、ログインできない可能性がございます。 テストアカウントでログイン→トップページから出品ボタン押下→商品情報入力→商品出品 確認後、ログアウト処理をお願いします。 開発担当箇所 担当箇所一覧と確認方法 ●　DB設計 ●　商品詳細ページ（フロントエンド） 　　　○　出品者用アカウント、または購入者用アカウントでログイン後、適当な 　　　　 商品を選択することで商品詳細ページへ進めます。 ●　商品詳細表示（バックエンド） 　　　○　出品者用アカウント、または購入者用アカウントでログイン後、適当な 　　　　 商品を選択することで商品詳細ページへ進めます。 ●　商品情報編集（バックエンド） 　　　○　出品者用アカウントでログイン後、トップページ右上からマイページにアクセスして　　　　 いただき、「出品した商品-出品中」から、適当な商品を選択することで商品詳細ペー 　　　　 ジへ進めます。その後、ページ中ほどにある編集ボタンを押す事で、商品を編集する 　　　　 事ができます。 ●　商品についての質問・コメント機能（バックエンド） 　　　○　出品者用アカウント、または購入者用アカウントでログイン後、適当な 　　　　 商品を選択することで商品詳細画面へ進めます。その後、ページ中ほど 　　　　 のコメント欄からコメントする事ができます。 各担当箇所の詳細 ●　DB設計 　　　○　概要 　　　　　　■　必要なテーブル、カラムの選定 　　　　　　■　アソシエーションの決定 　　　○　　担当内容 　　　　　　■　　ER図の作成 ●　商品詳細ページ 　　　○　概要 　　　　　　■　商品名、値段、画像など、商品の詳細が表示されるページ 　　　○　担当内容（バックエンド） 　　　　　　■　商品名、値段、画像、出品者、カテゴリーなど表示させるルーテ 　　　　　　　 ィング、コントローラーの作成 　　　○　担当内容（フロントエンド） 　　　　　　■　haml,scssを使用し、商品詳細の各項目の確認画面を実装 ●　商品情報編集 　　　○　概要 　　　　　　■　出品した商品の画像、登録情報を変更できるページ 　　　○　担当内容（バックエンド） 　　　　　　■　出品者だけが編集ページに遷移できる様にする機能の実装 ●　商品についての質問・コメント機能 　　　○　概要 　　　　　　■　出品されている商品について、出品者に質問、コメントができ、 　　　　　　　 出品者も同様に回答、コメントができる機能 　　　○　担当内容（バックエンド） 　　　　　　■　コメントを保存するモデル、コントローラ、ルーティングの作成 　　　　　　■　コメントの際の、非同期通信の実装 　　　　　　■　出品者のニックネームの下には出品者とわかる様に、「出品者」 　　　　　　　 と表示される機能の実装 開発を通じて得られた知見 工夫した点 ①チームとして工夫を行った点 マークアップ作業を行った人が、そのページのバックエンド作業を行うことにしたため、作業をスムーズに進めることができました。また、疑問に思ったことは、積極的にzoomやSlackで情報の共有を図った事で、問題点がチームで共有されやすくなり、早期の問題解決につながりました。 ②個人として工夫を行った点 コメント機能において、コメントを見やすくするために、コメントのニックネームを自分のものは右に、その他のユーザーのものは左に来る様にしました。 また、コードを書く際にBEMの考え方でクラス指定を行ったことで、コードの可読性の向上に努めました。 苦労した点 ①チームとして苦労した点 開発当初、メンバー各々がマージする度にコンフリクトが起こり、解決するのに苦労しました。そのため、コンフリクトが起きた時は、どのコードを残すのか、積極的に連絡を取り合うことにしました。その後は、コンフリクトが起きてもミスなく、作業を進める事ができました。 この経験から、コミュニケーションの大切さを学びました。今後は、コミュニケーションを密にとり、仕事を進めていきたいです。 ②個人として苦労した点 わからない部分を調べた際、理解の浅いまま実装してしまい、後に修正する必要が出てきた時に、なぜこのコードを書いたのかわからなくなり、苦労しました。 その後は、メンバーに聞いたり、より深く調べたりして、しっかり理解してから実装するようにしました。 今後は、この経験を仕事に生かし、わからない事はしっかり理解してから実装する様にしたいです。