チーム開発の奮闘記 - Best Awardに至るまでの道のり

## はじめに
アプレンティス4期生のKazukiです
HTML,CSS,JavaScript,PHPの基礎編が終わりいよいよチーム開発！

「自分たちの役に立つものを開発せよ」をテーマにこれまで学んだことをチームでアウトプットする期間となっています。

普段の学習と並行してだったのでタイトなスケジュールでした。

2/12(月) - 2/25(日)	アイデア決め
2/26(月) - 3/10(日)	スライド作成、要件定義
3/11(月) - 3/24(日)	設計、タスク出し、環境構築
3/25(月) - 3/31(日)	実装、プレゼン準備
3/31(日) 19:00 - 21:00	プレゼン
4/1(月) -	ブログ記事にチーム開発のことを記載する

アプレンティス詳細はこちら↓
https://apprentice.jp/

## プロダクト紹介
作ったのはチーム特化のタスク管理アプリ
「TEAM WEEKLY REPORT」

大きな特徴は以下の３つです。

1. パッとみてプロジェクトの進捗度がわかる
2. 他のメンバーのタスクも一目でわかる
3. 仲間のピンチも一目でわかる

以下は実際にできることのデモです。

・タスクの登録（タスクを完了するにはどんなタスクが必要かも登録可能）
![登録.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3731414/7714c9c4-54e0-412e-724e-5395ffadd71d.gif)

・進捗度の変更（リアルタイムで進捗度が変わる）
![親タスク進行度.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3731414/60e1cceb-dac8-1dc3-2abd-16b95c1ff22e.gif)

・メンバーのタスク確認（ログインユーザー以外は編集できない）
![自分以外は編集できない.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3731414/e98a278e-4df7-ee40-d104-0a0c25681d24.gif)

・タスク削除->プロジェクト進捗度
![削除->プロジェクト進行度.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3731414/ebda010d-2ac7-91f3-59ac-ffd54231ba2c.gif)

ER図はこんな感じす
![ER図.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3731414/3671b48c-cfa8-d137-eb97-2bd20e72e84a.jpeg)


## 開発背景
![](https://storage.googleapis.com/zenn-user-upload/dd8c21053b7f-20240402.png)
テーマを元にメンバーがブレストを行ってくれたが風呂敷を広げすぎて収拾がつかなくなった
↓
1人1案次のミーティングまでに考えてくるのはどうかと提案
↓
現状から次のチーム開発までに解決しておきたい問題を考えた
↓
・チームメンバーそれぞれ割ける時間もできることが違うので、誰がどんなことをしているのか明確にする必要があった。
（タスク進捗度、タスク詳細画面で解決）
・チームが出来て間もないので助けてほしいと言いづらいメンバーもいると思った。
（タスクの進捗度バーで解決）
・プロジェクトを決められた期間で間に合わせる意識作りをしたかった
（プロジェクト進捗度で常に共有し解決）
↓
これらが実装できれば、次のチーム開発でも役に立つんではないかと思った。
↓
結果自分の案が採用されました！

## 悩んだところ
#### 環境構築
担当ではDockerの環境構築もあったのですが`no matching manifest for linux/arm64/v8 in the manifest list entries`というエラーにハマり
WindowsやMac、M1チップとIntelチップでも使えるイメージが違うというのを知り、対応するイメージを探し、一人一人できるか試すのに時間を取られてしまいました。次のチーム開発では早々に環境構築の共有は済ませておきたいなと思います。

#### データの流れの把握
メンバーの1人が主軸となってコードを書いてくれたのですが、そのコードが全くわからず苦戦しました。

特にJSとPHP間でのデータの受け渡しではどの変数になんの値が入っているのかが掴みづらく、どうしたものかと考えたのですが、とりあえず「この機能作ってみます！」でやらざるを得ない状況に自分を置いたことが功を奏しました。

担当する機能に責任を持つことで、試行錯誤して詰まってしまっても解像度の高い質問ができるようになり、そこから派生して他の機能も実装できたからです。
最後に作った削除機能はスムーズにデータのやり取りができたと感じています。

#### プレゼン
プレゼンも「とりあえずやります」で自分をやらざるを得ない状況下に置きました。
意識した点は以下の３つです。
1. どういう流れで進めるとプロダクトの良さがわかりやすく伝わるか
2. 声のトーン、表情は親しみやすいか
3. 先述したプロダクトの３つの特徴に重心を置けているか

プレゼン開始10分前に自分がやると決まったので、少し時間がなかったですが結果的に「チームメンバーのピンチを救う」という特徴が評価されメンターさんから賞を頂くことができました。

メンバーや他のチームの方々からもプレゼン良かったと言ってもらえ、自信にもなりました！

## 反省点
自分の行っていることを都度メンバーに共有することの大切さを感じました。

ワイヤーフレームで今回は必要ない画面を作ってしまったり、自分の理解を共有せずに進めてしまったため他のメンバーがヘルプに入りづらかったりしました。

オフラインではなくオンラインのコミュニケーションなので1人1人解釈の違いがあり、それでも認識をすり合わせられる力を高いレベルで身につけたいなと強く思いました。

メンターさんからの評価が最も高いチームとして今回Best Awardを頂きましたが、まだまだターゲットを絞りきれていないのも甘かった。

実際に今回作ったものは本当にプロジェクト管理がうまくいくのか？というボトルネックの疑問に100%答えられるものではないのが悔しかったです。

次回からはターゲットを身近な人に置き換え、似ているサービスがあってもその人に特化させたプロダクトを設計段階から時間を使っていこうと思います！

## 終わりに
まだまだ書きたいことはありますが、何はともあれチームのメンバーと夜中にああだこうだ言い合って実装したこと、睡眠時間を削ってでも動くものを作れたことは今後の自信にも繋がりましたし、貴重な経験だったなと振り返って思います。（本当にチームのメンバーには感謝です）

ありがたい環境で学ばせていただいているので、ものに出来るよう今後も頑張っていこうと思います！

今回のチーム開発で使ったレポジトリ↓
https://github.com/apprentice-team-3/team-weekly-report