専門２年でグループウェアシステム作ってみた①
お久しぶりです。はるです。
早いもので、もう入社して２ヶ月が経とうとしています。
研修は相変わらず、って感じで暇な時間が多く、自分の学習したいことをしている感じとなってます。
早速ですが、今回は専門学生時代に卒業研究で作ったグループウェアシステムに書いていこうと思います。
こちらは、卒業式の日に校長先生より優秀賞をいただいた作品です。
1. 企画について
コロナ禍の昨今、オンライン授業を受ける機会が増えており、その中でもグループワークなどをスムーズに行えるツールが学校内で欲しかった。
また、多くのグループウェアは有料が多いのと出退勤、会議室の予約など学生には必要のない機能が数多くあるので機能の取捨選択をしたかった。
既存のグループウェアを研究して必要な機能を下記にまとめました。
（本当はもう少し機能をつけたかったが納期の関係上5つに絞りました。）
・グループ機能
・タスク機能
・カレンダー機能
・ガントチャート機能
・リアルタイムチャット機能
権限については、リーダとメンバを作りました。
リーダ： グループにユーザを追加、グループ名の変更
全ユーザへのタスクの割り当て・更新・削除
メンバ： 自分のタスクの新規作成・進捗の更新のみ
あまりパソコンを使ったことのない学生でも登録が簡単に行えたり、操作性を重視してシンプルな画面構成にしたり、学生向けを意識したUIを心がけました。
2. 設計について
正直、ここに一番時間がかかりました。
設計に関してはほぼ学習する機会がなく、ネットで調べたりしながら手探りで設計を行なっておりました。
流れとしては、
ユースケース記述
ユースケース図
アクティビティ図 画面設計
E-R図 画面遷移図
クラス図 ロバストネス図
シーケンス図
同時並行で進めていた箇所があるため、横に並べて書いております。
学校側で、最低限上記の設計書が必要とのことだったのでとりあえず作成しました。
私的にはユースケース図やアクティビティ図、ロバストネス図は省略して他の時間に当ててもいいのかなとも思いました。
言語については、学校で習った言語をフルで無視して、
React と Laravel を選定しました。（DBはMySQL）
理由は至って簡単です。流行りの言語を触りたかったからです。
余談ですが、会社の先輩にこの話をした時に鼻で笑われましたw
学校側での運用上、Virtual Boxでの構築をしないといけなかったためUbutuServerなどについても調べましたが今回は割愛させていただきます。
ReactとLaravelについては下記の公式サイトが一番わかりやすいと思いますので参考にしてみてください。（卒業研究で使う場合はよく調べてから使ってください。）
Reactは、create react appで作成をしてMaterialUIで画面を作成しています。
Stateの管理はReduxで、API接続にAxiosを使いました。
いい感じの画面を素早く作ることができるのでMaterial UIはおすすめです。
Reduxは学習コストは高めですが、Hooksと合わせて使うとStoreの値を簡単に取得することができます。（mapStateToPropsとか使わなくていい）
Axiosを使ってますが、学習時間が足りずJWTが使えなかったのが一番の後悔です。
Laravelは、Laradockで構築を行いAPIサーバとして使ってました。
ユーザ登録時にはメール送信を行い、学校用のメールアドレスしか登録できない仕様にしました。
チャットについてはPusherを使ってリアルタイムにやりとりができるように作りました。（無料で使えるのでおすすめ。）
①はこんな感じで文章が多めなのですが、②以降はもっと具体的な内容を書いて行けたらと考えております。
次回は、実際にどんな設計書を書いたのかどういう風に進めていったのかなど書いていくつもりです。
以上です。まだまだ書き方に不慣れがあり、読みにくい記事かもしれませんが皆さんのいいねとコメントをお待ちしております。
この記事が気に入ったらサポートをしてみませんか？