インシデントアプリを作成しました

# インシデントアプリ
![ホーム画面.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/529959/1aa13308-b93a-c451-16d1-00ba769d4520.png)

## 目的

1. 学習中に発生した事象を記録しておき、同じような事象が起きた際に参考にする。
2. 質問する際に記録した内容を共有することで、教育者と、生徒との齟齬をなくす。
3. 過去事象を参考にすることで調査時間の短縮

## アプリ概要

インシデントを共有し、他ユーザが事象解決を迅速化するためのアプリです。

1. スクール
   - 先生
     生徒から質問を受けたときに、時系列がわかるので対応しやすい
     フォーマットが決めることで必要情報が揃いやすい
   - 生徒
     フォーマットに従い事象を記載することで質問が具体的になる
     過去事象を探すことで、インシデント解決につながる
2. 個人利用
   - 過去事象を探すことで、インシデント解決につながる
   - 自身が以前遭遇したインシデントを記録しておくことで、次回発生時解決が迅速化する

## 背景

現職では、ユーザの問い合わせやエラー発生時、有識者への対応依頼、質問を実施し事象を解決しています。
また、発生した際は対応方法記録の記録を取り、次回発生時その情報をもとに対応できるようにしています。
そして、この方法が学習中にわからないことが発生した際に、講師に質問することと同じであると気づきました。
そこで現職で用いているインシデント管理アプリを学習者向けにカスタマイズすることで、学習効率を挙げられると考え、本アプリを作成しました。
現状、学習中にわからないことを調査している際に感じることを以下にまとめます。

1. 同じような事象を何回も調査し、時間を要する
2. google 検索では間口が広すぎて、欲しい情報にたどり着くのに時間を要する
3. 質問をする際、すべてを伝えられない場合がある
   1. OS、バージョン情報、言語など
   2. 自身で実施した内容

以下を実施することで事象解消が迅速化すると考えました。

1. わからないことを調査した際は必ず、記録する
2. 範囲を限定することでほしい情報の取得時間を短縮
3. 予め入力項目を決めておくことで情報漏れを防ぐ

本アプリにて上記事項の解消ができるよう作成いたしました。

## 特に見てほしい点

同一スクール受講生に使ってもらい、見直しを実施した。
ここに感想を挿入予定
単体テスト、複合テストを実施した。

## 開発で苦労したこと

- データベースを利用したダミーデータの挿入がなかなかうまく行かなかった
- ログインをメールアドレスから、ユーザ ID に変更したら管理者画面にログイン不可となった。
- 記事投稿機能を実施するのが難しかった。
- 一覧画面のテーブル表示をモバイル利用時カード型にするのが難しかった。

## その他工夫したこと

- heroku で利用する本番環境のみに使う定数を設定した。
- ダミーデータを入れて、利用している状況を生み出しながら実装していった。
- 行き詰まったり乗り気にならない場合、タスクを小さく分解しながら作業を実施した。
- ストロングパラーメータを利用して、予想外のデータが挿入されないようにした。
- 理想の実装をはじめから実装するのではなく、簡単な機能を実装後拡張していくようにした。

## 機能一覧

- ログイン機能
- インシデント投稿機能
- インシデント内に記事投稿機能
- 検索機能
- ソート機能
- ページネーション機能
- レスポンシブ対応
- プルダウン入力

## 使用イメージ

### ソート機能
![ソート機能](https://user-images.githubusercontent.com/58265802/141595191-cd801f34-ad03-4000-94d1-03d8e2e9f935.gif)

### 検索機能（事象入力）
![検索機能](https://user-images.githubusercontent.com/58265802/141595215-30943f54-a470-423d-b1d9-10217a62d445.gif)



### 検索機能（プルダウンメニュー）

![検索機能（プルダウンメニューから）](https://user-images.githubusercontent.com/58265802/141595244-6aaf7b71-ec3b-4675-8e8a-a7bb86826989.gif)


## インシデント発行機能
![新規投稿機能](https://user-images.githubusercontent.com/58265802/141595261-9a09135a-4b2f-4cec-8e42-ab2716372d2e.gif)


### 記事投稿機能
![記事投稿機能](https://user-images.githubusercontent.com/58265802/141595263-974849a3-1302-4b3a-8b61-69a71712ed60.gif)

## テーブル設計

- users テーブル（ユーザーを情報管理するテーブル）

| カラム名 | データ型 | 備考 |
| :------- | :------- | :--- |
| id       | integer  | PK   |
| name     | string   |      |
| email    | string   |      |
| password | string   |      |

- incidents テーブル（インシデント内容を管理するテーブル）

| カラム名 |データ型 |備考 |
|:--|:--|:--|
|id| integer| PK|
|user_id| integer |FK|
|coding_lang_id| integer |FK|
|os_name_id |integer |FK|
|status_id |integer| FK|
|incident| text||
|solution| text||
|created_at|datetime| 自動生成|
|updated_at|datetime| 自動生成|

- coding_langs テーブル（プログラミング言語を管理するテーブル）

| カラム名 |データ型 |備考 |
|:--|:--|:--|
|id| integer| PK|
|name |string ||

- statuses テーブル（ステータスを管理するテーブル）

| カラム名 |データ型 |備考 |
|:--|:--|:--|
|id| integer| PK|
|status |string|

- os_name テーブル（OS を管理するテーブル）

| カラム名 |データ型 |備考 |
|:--|:--|:--|
|id |integer| PK|
|name |string |

- articles テーブル（コメントを管理するテーブル）

| カラム名 |データ型 |備考 |
|:--|:--|:--|
|id| integer| PK|
|user_id| integer| FK|
|incident_id |integer |FK|
|created_at| datetime||
|updated_at| datetime||
|content| text||

## ER 図
![ER図.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/529959/3ef69875-2177-990b-902f-c390b3139552.png)

## 今後追加予定機能

- Slack 投稿機能
- github 連携
- 管理者画面
- ジャンルごと検索
- 添付ファイルを投稿機能

## 開発環境

言語：Ruby (2.7.2)
フレームワーク：Ruby on Rails (6.1.3.2)
フロントエンド：HTML&CSS/Bootstrap/JavaScript/jQuey
DB：PostgreSQL
インフラ：AWS
ソースコード管理：GitHub(issue で、タスク管理する)