初学者がRuby on Railsでポートフォリオを作成しました。

### はじめに
今回の内容は就職活動中で作成しているポートフォリオの説明です。
アドバイスなどありましたらよろしくお願いいたします。

###開発環境

- Ruby 2.6.2
- Rails 5.2.3
- DB：Mysql5.6
- AWS/S3
- 少しだけVue.js
- Route53,ACM,ALBでSSL化

##修正箇所

- RuboCop導入しました。（8/21)
- モーダル実装しました。（8/23)
- コメントで指摘していただいたHelper部分を修正しました。(8/23)
- 画像のプレビュー表示を実装しました。（8/31)
- Route53,ACM,ALBでSSL化を実装しました。(9/1)

## アプリ概要
・業者などに頼むほどではない作業や困りごとを得意な人に助けてもらう。
・使う機会がないスキルや自分の得意なことを活かして、困っている人を助ける。
そのような人と人が助け合うアプリがあればいいなという思いから作成しました。


⚠️URLはデプロイなどで接続できないタイミングがございます。その際は少し時間をおいてから接続してください。
⚠️簡単ログインでログインした方は終わる時にログアウトもお願いいたします。


##何ができるか？(機能）
Koto_Kotoは、以下のことができます。

####・困りごと,スキルの作成/編集/削除
![ezgif.com-video-to-gif.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/39c68122-fd88-b4e8-9b7a-0bcb88d1b277.gif)

困りごとを作成したいときは、demandボタン、スキルを提案したいときはsupplyボタンから作成することができ、目的別に分けて投稿ができます。
編集や削除は下の画像の赤丸のところからできます。
<img width="976" alt="スクリーンショット 2019-08-19 21.52.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/5c4ab410-796b-b72c-5881-eacab8e84a85.png">

####・クレジット登録機能
#####クレジット登録機能
![ezgif.com-video-to-gif (1).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/78050031-6ba0-dda9-2a63-8153242de83d.gif)

Test用としてこちらを入力して頂ければ使用できます。

- カード番号　4242424242424242
- 有効期限　12/22
- CVC番号　123
- 名前　　　適当に入力してください

カードの削除も可能です。

####・スキル,困りごとの助け合い機能（購入機能）
![ezgif.com-video-to-gif (2).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/0541e92e-ed22-5148-7915-49351a1d5deb.gif)

カードを登録した場合のみ購入,助けることが可能です。（ポートフォリオなので、万が一購入しても、仮想的に作っているので、お支払いは発生しません。）

あと、助けるボタンを押した場合は、購入ではないので、クレジットからお支払いは発生しないような作りになっています。

####・購入後のチャットのやりとり
![ezgif.com-video-to-gif (3).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/6b3fc692-9b88-e15b-72ad-e1f5e591f744.gif)

スキル購入、困りごとへの助けるボタンを押したら、チャットルームが作成される仕様になっており、お互いでやりとりが可能です。

####・契約完了後の評価
![ezgif.com-video-to-gif.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/92a574c8-a63b-c25c-2f7b-05a3b91064bf.gif)
契約完了したら、スキル購入の場合は購入者,困りごと解決の場合は困りごと出品者がその契約内容に関して、評価する仕様になっています。その評価に応じて対象者の信頼スコア（各々が持っている評価指標。マイページの右側の円に囲まれたもの）が加算されます。信頼スコアが高ければ高いほど、その人の評価が高いことになります。


~~⚠️評価画面の見た目部分は後々、モーダルで作成したいため、いじっておりません。~~
8/23 モーダルで評価画面の見た目部分を実装しました。

####・ポイント機能
<img width="1019" alt="スクリーンショット 2019-08-18 15.13.28.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/1049feb6-309e-7330-1d84-ba5212170195.png">

評価されて信頼スコアが上がるだけだとモチベーションupには繋がらないと思ったので、ポイント機能を作成しました。
信頼スコアをあげればあげるほど、ポイント倍率が高くなって、ポイントをためやすくなる仕様にしています。
今後、このポイントを使用して、スキル購入の時に割引として使えるなどの機能を実装したいと考えています。



####・ユーザー登録/編集/退会機能
deviseは使用せずに作成しました。（Session&Cookieの概要を学ぶため）
ユーザー登録をすると、確認メールが届くようにしており、そのメールに書かれているリンクを押して初めて、ユーザーが登録される仕様になっています。

####・簡単ログイン機能
<img width="964" alt="スクリーンショット 2019-08-19 22.41.08.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/9213e67e-1b3b-3cde-ce7f-7bc856f42a9e.png">

就活用に簡単ログイン機能を実装しました。
ボタン一つでログインできれば、就活の際に見てもらいやすくなるのではないかと考え実装に至りました。


####・スキルや困りごとのコメント機能
スキルや困りごとに対してコメントができます。
![ezgif.com-video-to-gif (5).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/0311d0d8-abda-da30-a90f-f08e56d6d91b.gif)

####・レスポンシブ対応
![ezgif.com-video-to-gif (6).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438198/99abe216-e354-456f-ad25-2d15e37458fe.gif)

スマートフォンが主流なので、そちらでも使いやすくするためにレスポンシブ対応にしました。


##課題＆追加したい機能
- ~~vueでのモーダル実装（評価する部分）~~
- ~~画像のプレビュー表示~~
- ポイント機能の使用（スキル購入の時に割引として使えるなど）
- カテゴリー別一覧表示
- Rspecテスト

##最後に
記事を読んでいただきありがとうございました。
また機能を追加次第、更新していきたいと思います。